Having a slider of your favourite brands on your home page presents a visually engaging way to show your customers your key product lines to which they can quickly navigate to.


To implement can be done in two ways


1.  Simply add the liquid code within your file - this is only really suited to older style or  simple themes


2. You can create a section that you can then manage via your Theme Customisation - this is much more inline with how modern themes work.


To do options 2 you will need to be a little comfortable with creating and editing code via the Shopify code editor. Instructions below


  • Create a new liquid file under the Sections folder - you can call it whatever you wish. In our example we chose 'brand-slider'.
  • Paste the following code in it
  • <div class="container">
{% include 'instant-brand-page-slider' %}
</div>
{% schema %}
  {
    "name": "Instant Brand Slider",
    "settings": [],
  "blocks": [],
  "presets": [
    {
      "category": "Brands",
      "name": "Instant Brand Slider",
      "settings": {},
      "blocks": [

      ]
    }
  ]
}
{% endschema %}

{% stylesheet %}
{% endstylesheet %}

{% javascript %}
{% endjavascript %}


  • It should look as follows. Click Save when finished
  • Now go to your theme customisation menu for your home page and click the Add Section option at the bottom
  • Select the Instant Brand Slider
  • Click Save



Voila! You now have a section that displays a brand slider and can be moved around and ordered as you wish.


As the Brand Slider now sits on your home page you may need to customise the look of the header and experiment with the number of items to display at a time to fit your site width.  

We are of course more than happy to assist if you need us