Happy Holidays!
Upto 70% off

How to design WooCommerce single product page template in 5 easy steps

Single Product by CoDesigner

CoDesigner is a complete solution to set up a WooCommerce store. It can help you create single product pages, shop pages, cart, checkout, design WooCommerce emails, and much more. The free version of CoDesigner allows you to create a separate product page using the free Single Product Widgets. But if you wish to create and design a single product page template, you should definitely try CoDesigner Pro. It will allow you to create a single product page template using 20 amazing widgets. Among these widgets 16 widgets are free and 4 are available in the premium version.

The free widgets include –

  • Product Title
  • Product Price
  • Product Rating
  • Breadcrumbs
  • Product Short Description
  • Product Variations
  • Add to Cart
  • Product SKU
  • Product Stock
  • Additional Information
  • Product Tabs
  • Product Meta
  • Product Categories
  • Product Tags
  • Product Thumbnail
  • Product Gallery


Free single product widgets
Free single-product widgets by CoDesigner


The premium widgets are –

  • Product Dynamic Tabs
  • Add to Wishlist
  • Add to Compare
  • Ask for Price


Premium single product widgets by CoDesigner
Premium single product widgets by CoDesigner


Why it’s important to design a custom single-product page?

The default WooCommerce single product layout is boring for most of your site visitors. Also, if you purchase a premium theme the single product page might not represent what you want. That’s why it’s a wise choice to understand the design aspect from the user’s point of view and create a more attractive template for your single product page. This can highly attract more customers and ultimately drive more sales to your WooCommerce store.

Today I will show you how to create a single product page template using CoDesigner. You can easily create a single product page template on your own within minutes by following the steps below.


1. Install necessary plugins

At first, you need to make sure that the following plugins are installed on your WordPress website.


Activate necessary plugins
Install and activate necessary plugins


2. Activate CoDesigner pro with a license

You will need to activate CoDesigner Pro in order to have the option to create templates. For detailed steps on how to activate the premium plugin please read this.


Activate CoDesigner Pro
Activate CoDesigner Pro


3. Enable widgets to create a single product page template

Now it’s time to enable the widgets you want to use on the single product page template. For this, head over to the CoDesigner dashboard and click the Widgets menu.


Go to widgets menu
Go to widgets menu on CoDesigner dashboard


Navigate to the Single Product section to turn on the widgets. After enabling your preferred widgets, make sure to save the settings.


Enable single product widgets
Enable single product widgets


4. Create a new template


Click the Template Menu on the WordPress dashboard and then Add new. A popup will come up where you will need to select WCD Single Product from the dropdown and name your template.


Create new single product template
Create a new single product template


After clicking the Create Template button, you will be redirected to the Elementor template editor screen. Here you can add the single product widgets one by one and design them.


Add single product widgets
Add single product widgets


5. Set conditions for your single product page template


After adding and designing the single product widgets, you need to set the condition for the new template. You can do it by simply clicking on the Settings icon at the bottom left corner of the Elementor editor. If you select All in the condition, the new template design will be visible on all the single product pages. Also, you can set the template for any particular product. After making all the changes your single product page template is ready to be published.


Set condition for your single product template
Set conditions for your single product template


These are the 5 steps to create an attractive single-product template for your WooCommerce store using CoDesigner. The best part is you won’t need to write a single code. You can check out our single product templates and try the widgets in real time from the demo site.

Also, you can check out how easily CoDesigner can help you create a shop, my account, cart, checkout pages, and design WooCommerce emails to boost your online business to the next level.

Share with your friends

Related posts based on your interest

Leave a Reply

Your email address will not be published. Required fields are marked *

Subscribe to
Our Newsletter

No spam. Unsubscribe anytime.