How to edit Magento 2 product page template and layout?

In this blog, let’s look at how to edit Magento 2 product page template and layout.

The product layout and design template showcase the information such as product name, images, description, add-to-cart and so on. Templates and layouts play a vital role in Magento 2 website. These layouts need not be the same as your Magento 1 site.

The only thing that makes your product page looks vibrant is the Templates. It is must consider a clear template as it shows the product to the customers.

Because the Magento 2 platform comes with numerous improvements including better user interface and stunning templates and layouts.

The Product Layout Design allows flexibility in the site’s appearance of the product display pages. A user can choose any one of the in-built templates or can create one from scratch.

Therefore, editing the product page template and layout for every product is a necessary thing for every store-owners to learn. This version of the Magento platform allows you to edit the product page template and layouts at the same time.

Here we explain how to edit the product page template and layout in Magento 2. Follow the below-mentioned steps to start editing,

  • Open product in Edit mode.
  • Expand the Advanced setting section
  • Click on the Design section

There you go, lets we start,

Edit product template and layout


An eCommerce site’s Product page template consists of a particular product view. The details that displayed on the product page may include price, reviews, shipping information, size, and other product-related information that customers want to know before making purchase decisions.

Now in the design section, you can find the fields edit product page template:

You have to fill all the following blanks:

  • Custom Design: Here, you can set the product page template. Now select any one of the available themes from the list.
  • Active from: To set the product page template for a specific period. Edit the beginning date here.
  • Active to: Here you enter the ending date of the period for the product page template.


The product page layout is something that the users get attracted to your eCommerce site. Mostly it is considered as the centerpiece of the user’s online store experience.

  • Custom Layout Update: With simple XML coding, this field allows you to edit the product page layout.
  • Page Layout: You can choose any one of the options to edit the product page layout,
  • No layout updates: This option is a default one, it means your product doesn’t apply the layout changes.
  • Empty: In general, this option lets you define your layout, such as a 4-column page. This option is not necessary for beginners as it requires the XML knowledge.
  • To create a 1 column to apply 1-column layout, 2 columns to apply 2-column layout, 2 columns with right bar is the 2 column with right bar layout and 3 columns to apply 3-column layout.

Thus, we provided you with all the options to edit the product page layout. Depends on your product requirement, you can decide the most suitable layout for your site.

  • The Display product options allow you to choose between Product Info Column or Block after the Info column.

Thanks for reading. We hope that everything you should know about the Editing product page template and layout in Magento 2 is been provided in this blog.

Let us help you to overcome Magento migration-related issues and development queries.

Last Update: March 12, 2020  

February 25, 2020   98   Haribabu    Magento, Magento 2 Tutorial, Magento Migration    
Total 0 Votes:

Tell us how can we improve this post?

+ = Verify Human or Spambot ?

Leave a Reply

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