fbpx

How to add a ‘View All Products’ button to the Shopify Minimal theme

How to add a ‘View All Products’ button to the Shopify Minimal theme

Last Updated on October 12, 2021 by LAUNCHTIP

How to add a ‘View All Products’ button to the Shopify Minimal theme

If you’re using the Minimal Theme in your Shopify store, you may struggle with adding a View All Products button to the collections page. Adding this button will allow your customers to see all products in the collection in no particular order. 

View All Products

Here’s an easy way to add this button to Minimal Theme. 

How to add a ‘View All Products’ button

The code used in this method is for adding the button at the bottom of the Featured Collection section. However, if you want to add it to another page in your store, you can do that too. 

  • Go to Edit Code
  • Select Sections and go to Features-collection.liquid. 
  • You will see two same codes </div> on lines 54 and 55. 
  • Paste this code between them. 
{% if section.settings.show_view_all_button %}
          <div class="text-center">
          <a href="/collections/all" class="btn">View All Products</a>
          </div>
{% endif %}

 

  • The code will look like this. 
<div>
{% if section.settings.show_view_all_button %}
          <div class="text-center">
          <a href="/collections/all" class="btn">View All Products</a>
          </div>
    {% endif %}
</div>

 

  • When you come to the bottom of the page, you will see this: 
 "label": "Center text below product images"
      } 

    ],
    "presets": [

 

  • Add a comma ahead of the curly bracket under ‘Label’. Then, add this code underneath this bracket. 
 {
        "type": "checkbox",
        "id": "show_view_all_button",
        "label": "Display the View All Button"
      }

 

  • The final result will look like this. 
 "label": "Center text below product images"
      },

  {
        "type": "checkbox",

        "id": "show_view_all_button",

        "label": "Display the View All Button"

      }

  ],

    "presets": [

 

  • Click on Save and then on Customize
  • In Sections, select Featured Collection. Here, you’ll see a checkbox for viewing all products. 

If you want the text on this button to be something different, you can replace ‘View All Products’ with the new text, such as ‘ ShopAll’. 

{% if section.settings.show_view_all_button %}
          <div class="text-center">
          <a href="/collections/all" class="btn">Shop All</a>
          </div>
    {% endif %}

 

 

Related Posts
Leave a Reply