How to Create a Single Product Page Template

You can make your online shop stand out a little more and truly create a unique experience for your customers by creating a unique product page. A well-designed single page template is paramount to keeping a single style throughout your online shop.

WooCommerce Products as Custom Post Types

In your dashboard, navigate to Templates > Theme Builder > Single Product > Add New.

From the dropdown choose Single Product, give it a name, and click Create Template.

Choose a Single Product Block and Insert. Alternatively, you can choose not to use a pre-build layout and design your own from scratch.

 

Here is a breakdown of all the parts that make up a regular product page, and it's corresponding Elementor Widgets.

file-qYYorVEy8v.png

file-cfWEhgrTJG.png file-q2lztreWAm.png

Menu Cart Widget - This special custom widget we've built, opens the cart in a window, so you can display your cart from any page of your website without leaving it.

file-LuvRQwDrkv.png file-ak5IbJSlGM.png

Woocommerce Breadcrumbs Widget - Control the colors and layout for WooCommerce Breadcrumbs.

file-JYIYMb0zOz.png file-w9pJ6KmQBi.png

Product Title Widget - Control the style and layout of your Product Title.

file-0viusPIWad.png file-QqmbehYeVi.png

Product Price Widget - Set the Product Price position and style.

file-mbDNMCZyis.png file-tAfSFkR299.png

Product Rating Widget - Add a Product Rating Widget.

file-JhssPUCJTh.png file-eZVrNcfNm7.png

Short Description Widget - Control the Short Description layout and style.

file-h7OEngnXXY.png file-kV60vFqQro.png

Product Stock Widget - Add a Product Stock Widget to display the product's stock number.

file-DkVzGbeWHi.pngfile-JkMalCLWd0.png

Add To Cart Widget - Control the layout and style of the Add To Cart button.

file-RCv7MtUnKK.png file-xXW9mBUsjL.png

Product Meta Widget - Set the distance between the text, display it stacked or inline, and control the style of your Metadata.

file-d2SLu8aZBr.png file-aKgO5UaLHr.png

Product Data Tabs Widget - Control the Data Tabs style.

file-1d6hG8JGP0.png file-PhGSoOAxXu.png

Product Images Widget - Set the image or gallery you wish to display.

file-QWzl6xsdnp.png file-4MBy2Ccfmo.png

Upsells Widget - Set your own style to the Upsell Products.

file-2GR4odQkJa.pngfile-biqtqKr4TJ.png

Product Related Widget - Set your own style to the Related Products. *See note below.

file-VsrFr0Gncc.pngfile-vVhVNpYKjR.png

Additional Information Widget - Add  Additional Information to your product display.

 

 

 

After you’ve finished designing, click Publish.

Choose a Condition.

Well done on successfully creating your Single Product template page!

  • 45 Users Found This Useful
Was this answer helpful?

Related Articles

How To Add A New Simple Product To Your Online Shop

Introduction: WooCommerce (the plugin that we use for your shop`s e-commerce) classifies...

How To Add A Variable Product To Your Online Shop

Introduction A Variable product is a product type that lets you offer a set of variations on a...

How To Enable Guest Checkout On Your Site

  At Creative Yadley we believe that checkout processes must be as easy and as short as...

How To Configure Your Transactional Emails

What are transactional emails? Transactional emails are automated emails that are sent to your...

How To Create A Shop Page

When you visit an online store, you're often taken to the Shop Page, where all the products...