Last updated - February 25, 2020
In the older versions of WooCommerce, you may have seen settings to change product display options. In the latest versions of WooCommerce, the Display option is absent under WooCommerce product settings. However, you will be able to find a new set of options under the Appearance tab. We will discuss the latest WooCommerce Customizer settings in detail in this article.
You can access the WooCommerce customizer from the WordPress navigation panel (Appearance > Customize > WooCommerce).
Under WooCommerce, you will find four different settings:
- Store Notice
- Product Catalog
- Product Images
We will take a look at each of these settings in more detail:
A store notice on WooCommerce will help you communicate to your customers by displaying a site-wide message. You will be able to communicate an informational message such as shipping delays to a particular zone through this option. Alternatively, you will be able to catch your customers’ attention on discount offers, events or any other marketing initiatives on your store.
You can add the text to be displayed in the text area. Also, you need to enable the checkbox for Store Notice. Now, you will be able to see a preview of the store notice on the page. Click the Publish button to display it across your site.
Once you publish the Store Notice, your visitors will be able to see it when they visit your site.
Scheduling Store Notice
WooCommerce also provides an option to schedule store notices on your store. For example, if you have scheduled an offer on your store starting from December 1st, you can create a store notice and schedule to display it. The store notice will be displayed only from that date onward.
You can define how products are displayed on your Shop and category pages by adjusting the settings under Product Catalog.
Basically, there are five different settings under this section. Let us take a look at each:
Shop page display
Here you will be able to choose what to display on your main Shop page. There are three options available
- Show products – All your products will be displayed.
- Show categories – Only categories will be displayed.
- or, Show categories and products – Both categories and products will be displayed.
This choice will define the display on your Category page. Again, you will have three options.
- Show products
- Show subcategories
- and, Show subcategories and products
Default product sorting
When a customer lands on your Shop page, how the products will appear to them is an important factor. WooCommerce allows you to choose the default product sorting according to your requirement. There are six different options for this as follows:
- Default sorting (custom ordering + name)
- Popularity (sales)
- Average rating
- Sort by most recent
- Sort by price (asc)
- and, Sort by price (desc)
Product per row
You can change the number of products to be displayed in each row.
Rows per page
Also, you can specify how many rows of products to be displayed on a single page.
This section will help you control how product images are displayed. Basically, the appearance of catalog images and thumbnail images an be controlled using these settings. Catalog images are medium-sized images that are displayed along with products on Shop, Category pages, Related Products, up sells and cross sells. And thumbnail images are associated with product display on cart and widgets.
You can control the appearance of both catalog and thumbnail images here. However, single product images and image gallery settings cannot be controlled here, which you can do from individual product pages. We are describing the basic process of handling product images and image gallery a little later in the article.
There are three options to set up thumbnail and catalog images here:
- 1:1 – In the 1:1 ratio, images will be cropped to form a square.
- Custom – You can set up a custom aspect ratio off your choice if you select the second option. The images will be cropped into the aspect ratio that you choose.
- Uncropped – Here, the images will not be cropped by WooCommerce. The original aspect ratio with which you have uploaded the images will be maintained.
How to handle product images from individual product pages?
You can set the main product image from the individual product page. On the right bottom corner of the product edit page, you will see the main product image as well as the product gallery images.
You can remove or upload new images easily from the media library.
Customers on the product detail page will be able to view both the main image and the multiple gallery images.
There is also a default lightbox option, which will help customers view the product up close.
Preview for different different devices
WooCommerce also lets you see the preview on different devices. By default, you can see preview for desktop. You can also change it to understand how it will look on a tablet or mobile phone as well.
On the right bottom corner of the customization panel of WooCommerce, you will be able to see the settings to change the preview option.
Making certain fields required
Firstly, you can define how you want certain input fields on the checkout page. You can define whether you want company name field, Address line 2 and phone number required or optional. Here there is an option to display an asterisk on required fields. You can tick the checkbox to enable it or leave it blank to not display asterisk.
Now, when you have set a terms and conditions page, you can ensure that customers read it by adding a checkout field. You can also add or edit the text that will be displayed here.
Hope you got an overview of the WooCommerce customizer settings that you will see with the latest versions of WooCommerce. For those who are using the older versions, there is another set of options under the Display tab. Leave us a comment if you have any concerns.