Theme Extension Settings

This guide outlines the Filter Menu settings available in the "App Embed" section in your theme editor.

Chris Durkan avatar
Written by Chris Durkan
Updated over a week ago

The Filter Menu settings are found in a different location in the Theme App Extension, compared to the Theme installer version of the app. You'll find all the same settings in both versions though. With some new additions in the Theme App Extension.

For general layout settings, see this guide:

Base Settings

Inside the Filter Menu app section you can find some base settings such as the display options, mobile options, and options for hiding/showing certain components in the filters. As well as some more advanced options for how the filters should behave.

You can find even more options for customising the filters in the App Embed settings.

Where to find the App Embed settings

To access all the different settings options to customise your filter menu, simply go to the App Embed section in your theme editor:

Default / Required settings

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. These settings are:

  • Custom Colors/Design

  • Custom Fonts

Make sure these two are always enabled as they apply most of the default styling required for the filters. If you're also using "small boxes" display in the app, you'll also need to toggle the "Enable Small Boxes" app embed block too.

Here's a quick run through of all the settings available:

Custom Colors / Design

This section allows you to edit the colors for the filter group headings, filter links, and clear buttons. You can also change the icon for checkboxes and adjust the size of color swatches in this section. There are also options for background color and padding for the filters. And an option for mobile padding - which you might need if you're using the Existing Sidebar display option.

Custom Fonts

In this section you can adjust the font family, font size and font weight for the filter group headings, filter links, and default mobile button.

Enable 'Apply' Button

Enable the 'Apply' button to allow customers to select multiple filters without the page reloading. Once they've made their selection they can apply all selected filters in one go.

You can find options for setting the apply button color and shape here too.

With this setting enabled, each time a filter is selected the filters will be reloaded. This is done to make sure that we don't show any links that might lead to an empty collection.

Enable AJAX Reloading

AJAX is a web development technique that allows a webpage to send and receive data from a server in the background, without requiring a full page reload, making websites more responsive and user-friendly. Enabling this setting will allow the filters and product grid to be reloaded, while the rest of the page remains the same.

For this setting to work correctly, you'll need to provide the correct selector - the default is "main" and should work for most themes. The selector should match the container that includes the Filter Menu, the Product Grid, and the Collection title.

There is also an option here to include additional scripts to run after the AJAX completes, this will depend on your theme design entirely, if your theme uses loading animations or a quick product view - you may need to rerun those scripts after the AJAX has run.

Please note that this setting can cause issues on themes that also use AJAX, as conflicts can occur. If you have any trouble with the AJAX settings, please reach out to our support team.

Enable Accordions

The accordion settings allow each filter group to be collapsible. Clicking on the filter group title will make it collapse or expand to show or hide the filters below it. You can set the accordions to always open, always closed, or open the first non-selected by default. You can also change the icon style with a choice or arrows, or plus/minus icons.

Enable Drawer

The drawer setting will hide the filters off the left side of the page, with a "Filter" button to show them. This setting can be set to always show a drawer, or to only show the drawer on mobile. You can set the mobile breakpoint in the main Filter Menu app block - the default value is 767px. Which means the drawer will enable on screens smaller than 767 pixels wide (when set to mobile only).

You'll also find options for the drawer colors, padding, and options for the drawer button design.

Enable Small Boxes

If you're using the "Small Boxes" display option in the Filter Menu admin - you will need to enable this app embed block as well. You'll find options for customising the color and design of the small boxes in this section.

Enable Sort By

The Filter Menu includes a Sort By section, you can choose to display it in the first or last position in the list of filters, as well as show it as a drop-down.

Enable Sticky Sidebar

Sticky sidebar will keep the Filters in place as you scroll down your collection page, this works well on collection pages with infinite loading, or when displaying a larger number of items per page.

This setting works best with the Smart Sidebar display, but you can adjust the selector settings here to use it with other sidebar layouts.

You can find settings for the CSS selector - this should be the outer-most container in the sidebar. It can be a bit of a tricky setting and it does depend on your theme design, as well as the layout option you've chosen for the filters.

If you have any issues enabling this setting, please reach out to our support team.

Enable 'View More' Button

The "View More" button allows you to shorten the list of filters in each group. Just set the number of filters to show, and the app will hide the rest, showing a button to see the rest.

Force Dropdowns

This setting is pretty straightforward, force all filters to display as drop-down menus. There are two designs available, but we're happy to help if you're looking for something more customised!

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

Did this answer your question?