PrestaShop 1.5.x. How to change default products listing view

In this tutorial you will learn how to change default products listing view in PrestaShop template.

PrestaShop. How to change default products listing view

1. Connect to your domain via FTP. Contact your hosting provider if you do not know how to do it.

2. Navigate to /themes/themeXXX folder – where XXX is your theme number.

3. Edit product-list.tpl file

4. Search for the following line of code:

<ul id="product_list" class="list">

class=”list” means that list is set as default product listing view in your theme.

5. Change it to:

<ul id="product_list" class="grid">

to set grid as default product listing view.

6. Edit product-sort.tpl file.

7. Search for the following lines of code:

<ul class="product_view">
<li id="product_view_grid"></li>
<li id="product_view_list" class="current"></li>
</ul>

The code stands for displaying list and grid icons. You should set class=”current” to corresponding <li>. That would be <li id="product_view_grid" class="current"></li> in our case.

The final code will look like:

<ul class="product_view">
<li id="product_view_grid" class="current"></li>
<li id="product_view_list"></li>
</ul>

8. Clean cookies and cache in your web browser and reload your product-list page.

Feel free to check the detailed video tutorial below:

PrestaShop. How to change default products listing view