Warning: You are browsing the documentation for PrestaShop 1.7, which is outdated.
You might want to read an updated version of this page for the current version, PrestaShop 8. Read the updated version of this page
PrestaShop 1.7 relies a lot on template inheritance in order to create the most consistent theme possible while heavily reducing the amount of duplicated code.
We took it even further introducing the Parent Child theme feature. The point to is to avoid modifying the main theme so you can update it!
So far we talked about extending template within the same theme. In PrestaShop 1.7 you can now extend templates from another theme.
First you need to have the theme you want to use as parent in your store /themes
folder.
Then you can create a very minimal theme, containing only the following files:
.
├── config
│ └── theme.yml
└── preview.png
Once you have this, you will specify in your child theme theme.yml
which theme should be used as a parent.
The value must be the theme technical name (ie: the theme folder name).
parent: classic
name: childtheme
display_name: My first child Theme
version: 1.0.0
assets:
use_parent_assets: true
Go ahead, select this theme in your backoffice and you’re all set.
Without any further modification the child theme will use every template from the parent theme.
In the following example we’ll modify the category template.
Create the category template in your child theme templates/catalog/listing/category.tpl
. At this point you
can do anything you want in this template but most likely you still want to extend product-list template. If so,
you don’t have to copy product-list template to your child theme, PrestaShop will use the parent file.
Extend product-list the normal way and override the block you need.
{extends file='catalog/listing/product-list.tpl'}
Another way to overriding the category template would be to extend the parent template and define just the block you need. There is a little difference if you want to override the same template, you need to add the parent resource (note the parent keyword in the example below).
{extends file='parent:catalog/listing/category.tpl'}