If this tutorial is not what you were looking for, you still have any questions, suggestions or concerns - feel free to let us know. Please help us to serve you better!

Your Name

Your Email

Your Message (required)

captcha

Shopify. How to change default products listing view

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