Toolset allows you to design custom WooCommerce templates for single-product pages using the WPBakery Page Builder (formerly Visual Composer). This means that all your products will be displayed using a single uniform design.
First, you need to disable the WooCommerce default templates. Please ensure that you have the WooCommerce Views plugin installed in your site.
- Go to Toolset -> WooCommerce Views.
- In the Product Template File section, select WooCommerce Views plugin default single product template, as shown in the figure below.
- Save all settings.
- Go to Toolset -> Dashboard.
- Click Create Content Template from the Products row:
- You will be taken to the Content Template Editor. Click the Edit with WPBakery Page Builder button.
Use the WPBakery Page Builder (Sections, Columns, and Elements) to build the content of your product template.
To insert WooCommerce fields, you can use either the Text Block or any other Elements.
As an example, let’s insert a Product image:
- Define the number of Column(s) you need.
- Insert a Text Block.
- Click the Fields and Views button.
- Locate the WooCommerce section.
- Choose the Product image field to insert it, as shown in the figure below:
The Product Image field will be inserted as a shortcode:
Repeat the above steps to insert more WooCommerce fields.
To insert the product title, choose Post title. You can also display custom fields and custom taxonomies, if you have any. Check the Adding Custom Fields and Taxonomies to Products tutorial to see how custom fields can be added to your products.
This is how the Content Template for a single product looks like:
All products on your site will be displayed using exactly the same template that was created using the WPBakery Page Builder. If you tweak this template later, the changes will be reflected in all product listings.
Toolset can also be used to create comparison product grids, customize the profile page, and much more. Visit our dedicated page to learn more about developing custom WooCommerce sites with Toolset.
If you need assistance with using Toolset in combination with WPBakery Page Builder, please visit our professional support forum dedicated to this topic.