WooCommerce Storefront Designer Extension
WooCommerce Storefront Designer Extension

WooCommerce Storefront Designer Extension gives you additional style options to further customize the appearance of your Storefront-powered website.

Installation for WooCommerce Storefront Designer

  1. Download the .zip file from your WooCommerce account.
  2. Go toWordPress Admin > Plugins > Add New to upload the file you downloaded with Choose File.
  3. Activate the extension.

Also, Get WooCommerce Storefront Checkout Customiser

Setup and Configuration for WooCommerce Storefront Designer Extension

This extension integrates with WordPress Customizer, giving you new settings in several existing sections.


Header layout

Choose a different preset header layout.

  • Default – How Storefront displays the header by default.
  • Expanded – Moves the secondary navigation and search bar above the logo/title/tag line.
  • Central – Aligns everything to the midline and works best when not using secondary navigation, potentially hiding the search bar.
  • Inline – Removes the secondary navigation/search box and displays the site title, main navigation and cart link in a single horizontal line.

Sticky header

Gives you the option to lock the entire header or only the navigation to the top of the page as the user scrolls. Be aware that sticky navigation only works in conjunction with ‘Expanded’ or ‘Compact’ header layouts.


Footer Text

Control text to display in the footer.

Display footer credit

Toggle display of the Storefront credit note/link in the footer.


Background style

Choose a solid fill background (default), a gradient background or transparent background. If you select gradient, the gradient is automatically generated based on the button background colour setting.

Easy Header Customizations

Choose now from ‘default’, ‘expanded’, ‘central’  or ‘sticky’ header layouts.

  • ‘Expanded’ header layout: Features a search and secondary navigation above the site logo.
  • ‘Central’ header layout: Centers your logo, description and primary menu navigation– this styling previous required custom coding unless you were using the Canvas ‘Duo’ theme.
  • ‘Sticky’ header layout: Header stays at the top of the page even as the user scrolls down.

Easy Layout Customizations

Define a content frame and choose a background colour for that frame. Alternatively, choose a ‘full-width’ layout for your site.


Please enter your comment!
Please enter your name here