Let’s first see what our main product listing looks like. To do it, we will click the ‘View Page’ button in the catalog general settings:
Default Main Catalog Listing
The main catalog listing will have a ‘products’ slug by default. It means that you will find it under example.com/products. We will customize it later. For now, let’s see what we can find on this page:
For this tutorial, we are using the Catalog Me! theme. However, you can use whichever theme you want. The colors and layout can be different. However, the content should be similar.
The default page template in Catalog Me! theme is a page with a right sidebar. We don’t need this sidebar for this tutorial, so that we will change the main product listing page template to full width.
To change the main product listing template:
- Click ‘Edit Product Listing’ on the top admin bar:
- Now you should see a standard WordPress page edit screen. We will have to switch the ‘Template’ drop-down inside the ‘Page Attributes’ box located on the right side to change the template.
We will choose the ‘No Sidebar Page’ option. Please note that the available options depend on your theme. In your case, the option name can be different, e.g., ‘Full Width.’ - Now hit the ‘Update’ button in the ‘Publish’ box:
Now when you go to your main listing page, you will see the updated layout:
As you can see on the screenshot now, our listing is full width and has:
- Only one product is called ‘Sample Product Page’. This product has been created automatically for demonstration purposes only. You should delete it as soon as you are ready with your catalog.
- If the page title is called ‘Private: Products’. This means that we’ve created a page with the title: ‘Products’ and private status.
- ‘All Products’ is a catalog page label. You can modify the label in Catalog > Settings > Front-end Labels. See the headings docs for details.
- The box with a grey background that says ‘Product Filters Bar has now widgets’ is a widget area. You can add any widget there; however, it has been designed for catalog widgets. You can find them in WP-Admin > Appearance > Widgets.
What to do next?
- Set catalog currency or disable price
- Select single product page design
- Customize your catalog URLs
- Add your products or import them from a spreadsheet
- Change the integration method if you have any problems with the catalog layout