Prestashop 1.7 Templates File Structure

Nov 1, 20161959David Narbutovich
Prestashop 1.7 Templates File Structure

Prestashop template files structure has been rather changed in the latest 1.7 version. This lets us structure the content in a more convenient way and it became more user-friendly, that conduct intuitive understanding and easy navigation. This article describes the file structure of Prestashop 1.7 templates.

Prestashop theme location and components

By default, all themes are stored in themes/ directory and each theme should be stored in a separate one:

├── <theme1>
├── <theme2>/
├── <theme3>

The file structure of a Prestashop theme usually should looks as follows:

│ ├───css
│ ├───img
│ └───js
│ ├───module1
│ ├───module2
│ ├───module3
│ └───…
│ ├───catalog
│ │ ├───listing
│ ├───checkout
│ ├───cms
│ ├───customer
│ ├───errors
│ │ └───static
│ ├───layouts
│ └───_partials

So let’s have a closer look at each particular sub-directory.

Directory Description
/_dev It contains a source code of a theme, icons, fonts, .sass files.
/assets Static files that can be loaded directly from the frontend.
/assets/img Images that are used in this theme.
/assets/js Theme JavaScript files.
/assets/css Theme Fonts and Style Sheets.
/templates Folder with Smarty dynamic templates (.tpl) More details you can find below.
/templates/layouts Contains the themes that are described in configuration (/config/theme.yml), mock-ups (for example without side columns, only left or right column, mock-up for errors output).
/modules This is where all the modules are located.

Theme files structure

Here we are going to describe each file and its functionality.

File Required Description
/preview.png The preview.png file is the thumbnail that is used by PrestaShop in its back office theme selector.
/config/theme.yml Theme configuration file that describes:

1. Information:

  • Theme name
  • Theme version
  • Theme author

2. Configuration:

  • Available mockups
  • Page templates and used mockups
  • Sizes of images that used in mockups
  • Plugin modules
/assets/css/theme.css Essential file that contains all styles.
/assets/css/theme.js Required Essential file (analogue of global.js).
/templates/contact.tpl Block for output contact information of a webstore with a help of module (ps_contactinfo).
/templates/index.tpl Welcome page.
/templates/page.tpl Essential file that describes the structure of a page (header / footer are declared in this file).
/templates/catalog/brand.tpl Used when listing all products from a single brand.
/templates/catalog/manufacturer.tpl Used when listing all products from a single manufacturer.
/templates/catalog/product.tpl Used to display details for a single product.
/templates/catalog/supplier.tpl Used to list all the products from a single supplier.
/templates/catalog/listing/best-sales.tpl Used to list all best sale.
/templates/catalog/listing/category.tpl Used to list all products in a current category.
/templates/catalog/listing/manufacturer.tpl Used when listing all products from a single manufacturer.
/templates/catalog/listing/new-products.tpl Used when listing the products that were last added to the cart.
/templates/catalog/listing/prices-drop.tpl Used to list all current promotions.
/templates/catalog/listing/product-list.tpl Used by all pages that list products. Displays the actual products list.
/templates/catalog/listing/search.tpl Used to list results from a search query.
/templates/catalog/listing/supplier.tpl Used to list all the products from a single supplier.
/templates/checkout/cart-empty.tpl Used to empty list products in a client’s cart.
/templates/checkout/cart.tpl Used to list products in a client’s cart.
/templates/checkout/checkout-process.tpl Used for rendering all steps in checkout.
/templates/checkout/checkout.tpl Checkout page.
/templates/checkout/order-confirmation.tpl Used during the order process: Last step, confirming the order (after payment).
/templates/cms/category.tpl Used to list all products in current category.
/templates/cms/sitemap.tpl Used to display the site map.
/templates/customer/addresses.tpl Used when listing a client’s street addresses.
/templates/customer/address.tpl Used when adding or editing a client street address.
/templates/customer/authentication.tpl Used when identifying a user, or creating a new user account.
/templates/customer/discount.tpl Used when listing all discount tickets for a single client.
/templates/customer/guest-login.tpl Used for identification of the guests order.
/templates/customer/guest-tracking.tpl Used when a visitor has no known account on the site, but wants his order to be tracked – and therefore needs to create an account or log in.
/templates/customer/history.tpl Used when listing the order history of a client.
/templates/customer/identity.tpl Used when a client edits his/her personal information.
/templates/customer/my-account.tpl Welcome page for a client’s account.
/templates/customer/order-detail.tpl Used to display the content of a client’s order.
/templates/customer/order-follow.tpl Used when a client needs to ask for a product return.
/templates/customer/order-return.tpl Used to display a client product return details.
/templates/customer/order-slip.tpl Used to display a client’s credit slips.
/templates/customer/password-email.tpl Password recovery page with e-mail field.
/templates/customer/password-infos.tpl Password recovery page with message output. (Successful)
/templates/customer/password-new.tpl Page with a form for entering a new password.
/templates/customer/registration.tpl Used for registration form output.
/templates/errors/404.tpl Used when the requested page is not found (HTTP error 404).
/templates/errors/forbidden.tpl Used when the requested page is forbidden (HTTP error 403).
/templates/errors/maintenance.tpl Used when the site is in maintenance mode.
/templates/errors/not-found.tpl Used when no search results.
/templates/errors/restricted-country.tpl Used when access to the current page is restricted for users.
/templates/_partials/breadcrumb.tpl Used to find the navigation path, or breadcrumb trail.
/templates/_partials/footer.tpl Page footer.
/templates/_partials/form-errors.tpl Used for errors list output.
/templates/_partials/form-fields.tpl Used for output of all types of fields.
/templates/_partials/head.tpl Page head.
/templates/_partials/header.tpl Page header.
/templates/_partials/notifications.tpl Used for output of all types of notifications.
/templates/_partials/pagination.tpl Used by all pages that list products. Displays the pagination button, enable to skip to the next/previous page of products.

Note: the list of essential files is taken from ThemeValidator.php

At any nest level of a catalog you can find a directory that is called “partials”. This folder can contain template files (which functionality was considered to replace to separate file) that might be included inside attached theme templates.

Check also: How to Edit Email Templates in Prestashop 1.7


  1. Very helpful blog. prestashop is free and best open source eCommerce platform. prestashop web 2.0 innovation is easy and very powerful for multitasking web application.

Post a new comment

BelVG Newsletter
Subscribe to our mailing list and get interesting stuff and updates to your email inbox.
Email *