Flex Theme - how to show different sidebar on collection pages

Store Design
, ,
1

We use the Flex theme by Out of the Sandbox. I am currently upgrading this to the latest 2.0 version.

In our existing theme we have it configured so that we can show different sidebars on different collection pages. I did this by following the tutorial on the Out of the Sandbox website here > https://help.outofthesandbox.com/hc/en-us/articles/360001562468-How-to-Create-Unique-Sidebars-for-Separate-Collections

However with the new 2.0 theme that uses blocks instead, I can’t figure out how to show a different sidebar on different collection pages.

Can anyone help?

Thank you

1 Like
2

Hi @cs73 , you can create new template on 2.0 theme from Shopify store admin > Sale channels > Online store > Themes > Customize > Collections > Create template

https://help.shopify.com/en/manual/online-store/themes/theme-structure/templates#create-a-new-template

3

Hello @cs73 ,

You can try to follow these steps:

  • Go to Online Store → themes → actions → edit code
  • Go to sections → collection-template.liquid file
  • Locate the code that outputs the collection products, which should look something like this:

  {% for product in collection.products %}
    

      
        
      
      

        ## {{ product.title }}
        {{ product.price | money }}
      

    

  {% endfor %}
  • Add a new block of code above or below this section to display the desired sidebar for the collection page you want to customize. For example, you can create a new div that will contain the sidebar and add it just before the tag that closes the “collection-main” div:

  ### Custom Sidebar
  

This is a custom sidebar for the collection page.
  • Save changes.
  • Go back to Online Store → Pages
  • Find the page that corresponds to the collection you want to customize → Edit
  • Choose Templates → Collection
  • Save and preview

Hope this can help you out.

Ali Reviews team.

1 Like