All Collections
Filter Menu
Theme Installation
Installing the filters to show horizontally, and with drop downs
Installing the filters to show horizontally, and with drop downs

Most themes use sidebar filters. Learn how to set the filters up horizontally with drop downs, in your theme (Advanced).

Brad Rees avatar
Written by Brad Rees
Updated over a week ago

Most of the theme installers we provide for the Filter Menu either add a sidebar to your theme or add the filters to your theme's existing sidebar on collection pages. We also support adding the filters as a row of horizontal drop-downs above the product grid on collection pages. 

If you're not comfortable editing your theme code, please reach out to our friendly support team, who will be more than happy to help with a custom installation!

The installation process for this is a bit different from the automated installer and it does require some minor changes to the theme code. However, this also allows you to place the drop-downs in an ideal position for your theme and design.

To start, we need to find out if you have already installed the Filter Menu on your theme. If so, we need to remove it to undo those changes. If you have a backup theme, then we would suggest working on the backup theme - don't worry, we'll make a new backup of the backup.

Once the app has been removed, you should now have a clean theme to start work on. 

Go to the Theme Installer page in the Filter Menu, by clicking on "Theme Installer" in the app sidebar and select your clean theme. It may now prompt you to run the installer for that theme type, instead, we want to choose the 'Generic Theme with dropdowns' installer. This can be found in the list of installers shown on the page.

Make sure you select to take a backup of your theme, just in case.

Once the installer is done, you will need to make the final change to your theme code. You can edit your theme using the theme editor, on the 'Online Store' Sales Channel page in your Shopify Admin. Click on the three dots button for the theme you want to edit, then select 'Edit Code'

The final step is adding the:


{% render 'filter-menu' %}


command to your theme's collection page. There are no rules to where this code should go, however a good place is often after your collection description, and before the product grid. In the Dawn theme, these can be found in 'main-collection-product-grid.liquid' file.

Some additional changes may be required, depending on your theme, such as hiding the theme filters. If you need any help please reach out to our support team.


If you have any additional questions, please contact support through the live chat in the app, or at support@powertoolsapp.com

Did this answer your question?