Storefront WooCommerce Customizer

Note: This Storefront extension is now available in the Storefront Powerpack, together with many other great features.

The Storefront WooCommerce Customizer extension gives you additional style and layout options for the WooCommerce sections of your Storefront powered web site.

Installation

↑ Back to top

Unzip and upload the plugin’s folder to your /wp-content/plugins/ directory
Activate the extension through the ‘Plugins’ menu in WordPress
Enter the WordPress Customizer to begin using the plugin.

For more information on installing and managing plugins see here

This extension integrates with the WordPress Customizer making it extremely simple to use. Once you enter the Customizer by going to Appearance > Customize, you will notice several new top level sections; Shop, Product Details and Homepage. In addition to this there are new settings in the Header and Homepage sections. The settings should be self explanatory, but let’s work through what each one does. In the following sections.

Header

↑ Back to top

In the Header section there are two new settings both of which are toggles, allowing you to disable certain components:

Search Bar. This setting gives you the ability to hide the search bar.
Cart Link. This setting gives you the ability to hide the cart link (and the cart drop down by association).

Shop

↑ Back to top

The shop section only appears if you’re currently on the shop page. shop-settings

Shop layout. Allows you to choose a full width layout for the shop page and product archives (categories, tags, etc).
Shop columns. Allows you to control the number of columns products are arranged into on the shop page and product archives.
Shop products per page. Allows you to control the number of products displayed per page on the shop page and product archives.
Shop alignment. Specify whether to align product components in archives centrally, to the left or to the right. This governs things like the product image, title, rating, price, add to cart button, sale marker, etc.
Display product image. Toggle the display of product images on the shop page and product archives.
Display product title. Toggle the display of product titles on the shop page and product archives.
Display sale flash. Toggle the display of product sale flashes on the shop page and product archives.
Display rating. Toggle the display of product ratings on the shop page and product archives.
Display price. Toggle the display of product prices on the shop page and product archives.
Display add to cart button. Toggle the display of product add to cart buttons on the shop page and product archives.
Infinite Scroll. Toggle the infinite scroll feature on product archives. This feature will cause more products to be dynamically loaded into the page when the visitor reaches the bottom of the page, instead of having to use the pagination links. You can see a demo of this on our ProShop Child Theme demo.

Note: Infinite scroll feature is no longer part of this extension. We recommend installing Jetpack and using the Infinite Scroll feature included there.

Success / Info / Error message colors. These color settings allow you to customise the background / text colors used in WooCommerce informational messages.

Product Details

↑ Back to top

The product details section only appears if you’re currently on a product page.

Product layout. Allows you to choose a full width layout for the product details pages.
Product gallery layout. Allows you to change the product image / product gallery layout. There are three options:
- Default. As the name suggests, this is the default Storefront layout with the product image / gallery on the left and the description on the right.
- Stacked. This will make the product image / gallery and the product description full width, stacking the image / gallery on top of the description.
- Hide product galleries. Hides the product image / gallery.
Display Product Tabs. Toggle the display of the product tabs.
Display related products. Toggle the display of related products.

Homepage

↑ Back to top

The homepage section only appears if you’re currently on a page using the homepage template. More info at: Installation-Configuration.

Display page content. Toggle the display of the homepage content and title.
Display product categories. Toggle the display of product categories.
Product category title. Customize the product category section title.
Product category columns. Specify how many columns product categories are arranged into.
Product categories to display. Specify how many product categories to display.
Display recent products. Toggle the display of the recent products.
Recent product title. Customize the recent products section title.
Recent product columns. Specify how many columns the recent products are arranged into.
Recent products to display. Specify how many recent products to display.
Display featured products. Toggle the display of the featured products.
Featured product title. Customize the featured products section title.
Featured product columns. Specify how many columns the featured products are arranged into.
Featured products to display. Specify how many featured products to display.
Display top rated products. Toggle the display of the top rated products.
Top rated product title. Customize the top rated products section title.
Top rated product columns. Specify how many columns the top rated products are arranged into.
Top rated products to display. Specify how many top rated products to display.
Display on sale products. Toggle the display of on sale products.
On sale product title. Customize the on sale products section title.
On sale product columns. Specify how many columns the on sale products are arranged into.
On sale products to display. Specify how many on sale products to display.