Locale and entity based layouts in the PrestaShop theme

In this blog, we will learn how to change PrestaShop theme layout based on locale and entity ID. Suppose, you are running a store in multiple languages (ie: English & French).

You want to display the different layouts for each language. The customer can see different theme looks when they switch the languages.

While rendering any template, PrestaShop finds the template in multiple locations in the currently active theme. For example, when the product page is loaded, PrestaShop looks for the product.tpl file under the theme <Theme>/templates/catalog/ folder.

To know in detail what PrestaShop performs the checks during the template rending, check the TemplateFinder.php class’ below methods:

• getTemplate
• getTemplateHierarchy

You can see how PrestaShop checks the template location entity-wise (in getTemplateHierarchy method) and then locale-wise (in getTemplate method).

Let’s see this process in the graphical representation to understand this process easily with an example.

Product page example

With the product page, the PrestaShop will check the following locations (in order) and return the first template found:

Example for the product with ID = 1 and locale = en-US:

1. en-US/catalog/product-1.tpl
2. catalog/product-1.tpl
3. en-US/catalog/product.tpl
4. catalog/product.tpl

Let’s see this example in practice. We are going to modify the product page layout for the product ID 1. We just interchange the product information and product image positions.

To do this, we will create a file product-1.tpl in the <Theme>/templates/catalog/ folder and copy the code of the existing product.tpl file and made some minor changes in the code to interchange positions.

After making all these changes, when we browse product ID 1, it will look like the below image:

You can also create a folder for locale (ie: en-US) under the <Theme>/templates/ folder and create a new product.tpl file.

A new file path will be <Theme>/templates/en-US/catalog/product.tpl

Now, you can make changes as per your need and save it. When you change your language to English (en-US) then this template will be rendered.

You can do the same with the other pages like category, CMS, brands, etc.

For more information, please check the below link:

https://devdocs.prestashop-project.org/8/themes/reference/templates/templates-layouts/

That’s all about this blog.

If any issue or doubt please feel free to mention it in the comment section.

I would be happy to help.

Also, you can explore our PrestaShop Development Services & a large range of quality PrestaShop Modules.

For any doubt contact us at support@webkul.com.