Adding the Filter Menu Extension to your Collection page
Step 1.
Go to your Default Collection page in your theme editor (Theme > Collections > Default Collection).
Step 2.
Navigate to the side menu and choose 'Add Section' within the Template settings. In the opened modal, switch to the 'Apps' tab, locate the Filter Menu extension, and click to select it. The Filter Menu is initially positioned below the product grid, but you have the flexibility to move it above the Product Grid. To access your filter menu settings, simply select the Filter Menu section and a new side menu should either load on the right side of your screen or on the current side menu (depending on your screen size).
Customising your Filter Menu Theme Extension
To access all the different setting options to customise your filter menu, simply go to the App Embed section in your theme editor:
Due to limitations in Shopify's Theme App Extension framework the Filter Menu will have minimal styling applied when you first add it to your theme, so a couple of app embed settings need to be turned on in order to apply all of the default styling settings. These settings are:
Custom Colors/Design
Custom Fonts
All the other settings are optional, and will depend on the design or behaviour you'd like to apply. We have a guide outlining all of the available settings here:
Choosing a layout for the Filter Menu
By default, the Filter Menu will display horizontally. There are also options to display the filters in a sidebar on the left of the product grid, or inside a drawer. Check this guide for more details on the layout options:
If you have any additional questions, please contact support through the live chat in the app, or at support@powertoolsapp.com