How To create a Product Template?

Author: Iris 581 views

There are two ways to build a Product page. You can stick with the Default Product Template or Create a

There is a limit to the changes you can make with the default Template for your Theme. If you want to make more significant changes, however, if you do want to be able to fully customize your pages, but you don’t know the code, EComposer page builder is a great idea. The question is, how do you do this in this app? We’ll show you how much customization EComposer gives you for your Product page.

There are two ways to build a Product page. You can stick with the Default Product Template or Create a new one.

1. Make default product template (Built with EComposer)

1.1. Create and settings

Admins: By default, Shopify provides only one template for all Products of your store. EComposer default product template will overwrite your current theme template and the changes you made will apply to all your Product pages.

In order to edit the layout for the Default Product Template, please follow these steps:

  1. From App dashboard

  2. Navigate to Product Pages (Build with EComposer
  3. Build product page
EComposer Visual Page Builder Dashboard

After that, there are many ways for you to start building a Product template:

  • Create a totally new template: You must choose a structure first, then drag many other elements from the left-sidebar to configure.
  • Explore Library: There are many sample pages, and sections for you to choose from. You can easily find specific categories by a search tool.
  • Import: You are allowed to import Section data, Page settings, Site styles, etc. by uploading or dragging a file.
  • Paste from clipboard: If you are interested in a section, you can copy then paste it to other templates.
EComposer Visual Page Builder Dashboard

There are so many attractive elements waiting for you. Such as:

  • Image: This element allows you to configure product images flexibly which the original theme can’t do.
  • Title: You can show the Collection title here.
  • Add to cart, Buy now button: This option allows you to set name, animations, color, etc. for them.
  • Variant: If you want to use variants, you must set them in Shopify admin > Products first. Then, you can change many different types.
  • Price: You are allowed to show product prices with labels, especially the After pay function.

On Product page, we only can add Single product and Basic elements. We can’t add collection or homepage, other elements from other pages for product page.

1.2. How to restore the original Shopify Theme Template?

Changing your Default Product Template might not always be the best idea. In such cases, you can only regret and wish to have rolled back to the previous version of your theme. EComposer makes it possible for users! App dashboard >Product Pages > Restore again

EComposer Visual Page Builder Dashboard

2. Create a Custom Template

2.1. Create a Custom Template

Otherwise, if you want different templates for different products. You can create a new Product template and assign it to different products that you want.

There will be two choices for you to keep in mind.

  • The first way: Product pages-> Build product page
  • The second way: EComposer custom -> Navigate on top bar -> Create new template

2.2. How to remove/delete the EComposer template?

As mentioned, you can add different templates for different products. If you wanna remove the template from your theme, here are the steps for you:

EComposer custom -> Click on Save on the top-right-bar -> General > Choose None in Apply for

Description Video About Deleting An Product Template

Regarding deleting the template permanently, there are two ways for you.

  • The first way: From EComposer dashboard -> Choose a template that you want to delete > Delete
  • The second way: Navigate on the top bar -> Choose a template that you want to delete -> More action -> Delete

2.3. Custom template settings

EComposer App allows us to set basic information for your template by clicking on Save on the top bar.

  • Template name, template slug: You’re allowed to enter the name for them.
  • Apply for: You can apply the template for All products, specific collections, and specific products.
  • Page layout: If you want to keep the header ad footer of the current theme, please choose the Shopify theme. Otherwise, choose EComposer canvas.

Besides, you also can add custom CSS, and JS for your template there.

4. How to add app sections for Shopify template default?

Besides allowing to overwrite the default product template for all products, create a custom template for some products/ collections. We also can add product sections for the Shopify template default.

If you are interested in this part so let us help you figure it out by the description below:

  1. From EComposer dashboard choose Extra builder
  1. Insert any section after click on Explore Library, and then go on Save to save the section. Watch the video below to get more details.
  1. Then, please go back to Shopify dashboard and click on Publish Theme -> Customize to add the section into the dproduct template from theme. Drag & drop the section to the position you wish then click Save.
On this page