Categories

Featured templates

Shopify. How to change default products listing view

Ray Taylor June 15, 2016
Rating: 5.0/5. From 2 votes.
Please wait...

This tutorial will show you how to change the default product list view from Grid to List in Shopify themes.

  1. Go to the Online Store -> Themes -> Edit HTML/CSS.

  2. Open the collection.liquid under the Snippets tab.

  3. Locate the toggle_grid and/or toggle_list class names.

  4. Change these items around. Then assign an active class to the toggle_list id.

    shopify_how_to_change_default_product_listing-1
  5. Open the jquery.collection-sort.js file under the Assets tab.

  6. Press CTRL+F hotkeys to search for the default text.

  7. Change grid to list and save this file.

    shopify_how_to_change_default_product_listing-2
  8. Reload your site to see the changes.

  9. Note that you must clean your browser Cookies and Cache.

Now you know how to change a Grid to a List view on product listing pages.

Feel free to check the detailed video tutorial below:

Shopify. How to change default products listing view
Shopify Templates
This entry was posted in Shopify Tutorials and tagged layout, product listing, Shopify. Bookmark the permalink.

Submit a ticket

If you are still unable to find a sufficient tutorial regarding your issue please use the following link to submit a request to our technical support team. We'll provide you with our help and assistance within next 24 hours: Submit a ticket