Reference

Filter Editor Floating Reference

Floating filter options for desktop and mobile call buttons, popups, overlays, and touch behavior.

Updated May 25, 2026SEO-ready86 options

This Reference page covers the Floating tab in the Filter Editor. It is a manual draft for the full option Reference, not a standalone public release of the whole Reference set.

Floating mode moves the filter into a button-triggered popup. Because the final public Free/Pro treatment for floating and mobile floating still needs product confirmation, availability is written as check pricing on this page.

General

Enable Floating Mode

Public label: Enable Floating Mode
Location: Filter Editor > Floating > General
Type: Toggle
Default value: Off
Shown when: Always.
Availability: Check pricing
What it does: Turns the filter into a floating, button-triggered experience instead of a static inline filter.
When to use: Use it when filters should stay accessible without occupying permanent page space.
Side effects / performance notes: Floating filters add overlay and popup behavior that must be checked against theme headers, sticky elements, and mobile navigation.
Related options: Floating Devices, Show Call Button, Desktop Popup, Mobile Popup.

Floating Devices

Public label: Floating Devices
Location: Filter Editor > Floating > General
Type: Radio
Default value: Both / Desktop / Mobile
Shown when: Enable Floating Mode is on.
Availability: Check pricing
What it does: Chooses which device classes use floating mode.
When to use: Use Desktop, Mobile, or Both depending on where the inline filter takes too much space.
Side effects / performance notes: Device targeting depends on the active responsive breakpoints and should be checked in real viewports.
Related options: Enable Floating Mode, Default Mobile Breakpoint, Mobile Layout.

Show Call Button

Public label: Show Call Button
Location: Filter Editor > Floating > General
Type: Toggle
Default value: On
Shown when: Enable Floating Mode is on.
Availability: Check pricing
What it does: Shows the button shoppers use to open the floating filter.
When to use: Keep it on unless another custom trigger opens the floating popup.
Side effects / performance notes: Without a visible call button, shoppers need another clear way to open the filter.
Related options: Desktop Call Button, Mobile Call Button, Popup Trigger.

Desktop Call Button

Customize Desktop Call Button

Public label: Customize Desktop Call Button
Location: Filter Editor > Floating > Desktop Call Button
Type: Toggle
Default value: Off
Shown when: Enable Floating Mode is on and desktop floating is active.
Availability: Check pricing
What it does: Enables custom styling for the desktop floating call button.
When to use: Turn it on when the desktop button needs custom text, icon, position, colors, or spacing.
Side effects / performance notes: Custom fixed buttons should be checked against sticky headers, chat widgets, and theme controls.
Related options: Desktop Button Type, Desktop Fixed Position, Desktop Z-Index.

Desktop Button Type

Public label: Button Type
Location: Filter Editor > Floating > Desktop Call Button
Type: Visual picker
Default value: Text / Icon / Text+Icon
Shown when: Customize Desktop Call Button is on.
Availability: Check pricing
What it does: Sets whether the desktop call button shows text, an icon, or both.
When to use: Use icon-only for compact controls and text plus icon when the action needs clearer wording.
Side effects / performance notes: Icon-only buttons need accessible labels and should be recognizable without surrounding text.
Related options: Desktop Button Text, Desktop Button Icon, Show Call Button.

Desktop Button Text

Public label: Button Text
Location: Filter Editor > Floating > Desktop Call Button
Type: Text
Default value: Filters
Shown when: Customize Desktop Call Button is on and the selected button type includes text.
Availability: Check pricing
What it does: Sets the text on the desktop floating call button.
When to use: Change it to match storefront language such as Filter, Refine, or Shop Filters.
Side effects / performance notes: Long text can increase the fixed button width and overlap page content.
Related options: Desktop Button Type, Desktop Font Size, Desktop Padding.

Desktop Button Icon

Public label: Button Icon
Location: Filter Editor > Floating > Desktop Call Button
Type: Select
Default value: Filter / Sliders / Funnel / Search
Shown when: Customize Desktop Call Button is on and the selected button type includes an icon.
Availability: Check pricing
What it does: Chooses the icon shown on the desktop call button.
When to use: Use a familiar filter or sliders icon when the button text is short or hidden.
Side effects / performance notes: Icons should remain readable at the configured button size.
Related options: Desktop Button Type, Desktop Font Color, Desktop Button Text.

Desktop Fixed Position

Public label: Fixed Position
Location: Filter Editor > Floating > Desktop Call Button
Type: Toggle
Default value: On
Shown when: Customize Desktop Call Button is on.
Availability: Check pricing
What it does: Keeps the desktop call button fixed in the viewport while shoppers scroll.
When to use: Use it when filters should remain reachable throughout long product lists.
Side effects / performance notes: Fixed controls can overlap sticky headers, cookie banners, or page-builder widgets.
Related options: Desktop Position X, Desktop Position Y, Desktop Z-Index.

Desktop Position X

Public label: Position X
Location: Filter Editor > Floating > Desktop Call Button
Type: Number
Default value: 20 px
Shown when: Customize Desktop Call Button is on and Fixed Position is on.
Availability: Check pricing
What it does: Sets the horizontal offset of the desktop call button.
When to use: Adjust it to avoid page edges, scrollbars, or other fixed controls.
Side effects / performance notes: The offset should be checked in wide and narrow desktop viewports.
Related options: Desktop Fixed Position, Desktop Position Y, Desktop Z-Index.

Desktop Position Y

Public label: Position Y
Location: Filter Editor > Floating > Desktop Call Button
Type: Number
Default value: 50%
Shown when: Customize Desktop Call Button is on and Fixed Position is on.
Availability: Check pricing
What it does: Sets the vertical offset of the desktop call button.
When to use: Use it to place the button near the middle, top, or bottom of the viewport.
Side effects / performance notes: Percentage positioning can interact with viewport height and sticky content.
Related options: Desktop Fixed Position, Desktop Position X, Desktop Z-Index.

Desktop Font Family

Public label: Font Family
Location: Filter Editor > Floating > Desktop Call Button
Type: Select
Default value: inherit
Shown when: Customize Desktop Call Button is on.
Availability: Check pricing
What it does: Sets the font family for desktop call button text.
When to use: Use it when the button should match the storefront's button typography.
Side effects / performance notes: The font must already be available on the storefront.
Related options: Desktop Font Size, Desktop Button Text, Button styles.

Desktop Font Size

Public label: Font Size
Location: Filter Editor > Floating > Desktop Call Button
Type: Number
Default value: 14 px
Shown when: Customize Desktop Call Button is on.
Availability: Check pricing
What it does: Sets the text size for the desktop call button.
When to use: Increase it for stronger visibility or reduce it for compact fixed placement.
Side effects / performance notes: Larger text increases button dimensions and overlap risk.
Related options: Desktop Font Family, Desktop Padding, Desktop Button Text.

Desktop Font Color

Public label: Font Color
Location: Filter Editor > Floating > Desktop Call Button
Type: Color picker
Default value: #ffffff
Shown when: Customize Desktop Call Button is on.
Availability: Check pricing
What it does: Sets the desktop call button text and icon color.
When to use: Use it to maintain contrast against the button background.
Side effects / performance notes: Check contrast in normal and hover states if the theme adds hover styling.
Related options: Desktop Background Color, Desktop Button Icon, Desktop Font Size.

Desktop Background Color

Public label: Background Color
Location: Filter Editor > Floating > Desktop Call Button
Type: Color picker
Default value: #2271b1
Shown when: Customize Desktop Call Button is on.
Availability: Check pricing
What it does: Sets the desktop call button background color.
When to use: Use a high-contrast brand color so shoppers can find the floating filter.
Side effects / performance notes: Very bright colors can compete with primary add-to-cart actions.
Related options: Desktop Font Color, Desktop Border Radius, Desktop Box Shadow.

Desktop Button Border Radius

Public label: Border Radius
Location: Filter Editor > Floating > Desktop Call Button
Type: Number
Default value: 4 px
Shown when: Customize Desktop Call Button is on.
Availability: Check pricing
What it does: Rounds the desktop call button corners.
When to use: Match it to the storefront's button radius.
Side effects / performance notes: Large radius values can make the fixed button feel like a floating pill.
Related options: Desktop Background Color, Desktop Padding, Desktop Box Shadow.

Desktop Button Box Shadow

Public label: Box Shadow
Location: Filter Editor > Floating > Desktop Call Button
Type: Text
Default value: 0 2px 8px rgba(0,0,0,0.2)
Shown when: Customize Desktop Call Button is on.
Availability: Check pricing
What it does: Adds shadow around the desktop call button.
When to use: Use it when the button needs separation from product images or page content.
Side effects / performance notes: Heavy shadows can look out of place on flat themes.
Related options: Desktop Background Color, Desktop Border Radius, Desktop Z-Index.

Desktop Button Padding

Public label: Padding
Location: Filter Editor > Floating > Desktop Call Button
Type: Four-value number control
Default value: 10/15/10/15 px
Shown when: Customize Desktop Call Button is on.
Availability: Check pricing
What it does: Sets inner spacing inside the desktop call button.
When to use: Increase it for a stronger call-to-action or reduce it for compact fixed placement.
Side effects / performance notes: Padding affects button size and overlap risk.
Related options: Desktop Font Size, Desktop Button Text, Desktop Border Radius.

Desktop Z-Index

Public label: Z-Index
Location: Filter Editor > Floating > Desktop Call Button
Type: Number
Default value: 9999
Shown when: Customize Desktop Call Button is on.
Availability: Check pricing
What it does: Controls the stacking level of the desktop call button.
When to use: Adjust it when the button appears behind theme headers, overlays, or other fixed elements.
Side effects / performance notes: Very high values can place the button above modals or checkout overlays.
Related options: Desktop Fixed Position, Desktop Popup, Desktop Enable Overlay.

Desktop Active Count Badge

Public label: Show Active Count Badge
Location: Filter Editor > Floating > Desktop Call Button
Type: Toggle
Default value: Off
Shown when: Customize Desktop Call Button is on.
Availability: Check pricing
What it does: Shows the number of active selections on the desktop call button.
When to use: Use it when shoppers should see that filters are active while the popup is closed.
Side effects / performance notes: Badges need enough space and contrast to stay legible.
Related options: Display Selected Params, Show Results Count in Button, Filter Synchro.

Public label: Customize Desktop Popup
Location: Filter Editor > Floating > Desktop Popup
Type: Toggle
Default value: Off
Shown when: Enable Floating Mode is on and desktop floating is active.
Availability: Check pricing
What it does: Enables custom styling and behavior for the desktop floating popup.
When to use: Turn it on when the desktop popup needs custom size, animation, overlay, title, or button behavior.
Side effects / performance notes: Popup settings should be checked against the theme's modal and drawer styles.
Related options: Desktop Popup Width, Desktop Arrival Side, Desktop Enable Overlay.

Public label: Popup Background
Location: Filter Editor > Floating > Desktop Popup
Type: Color picker
Default value: #ffffff
Shown when: Customize Desktop Popup is on.
Availability: Check pricing
What it does: Sets the background color of the desktop popup panel.
When to use: Use it to match the storefront surface color or create contrast with the page overlay.
Side effects / performance notes: Text and controls inside the popup must remain readable against the chosen background.
Related options: Desktop Overlay Color, Desktop Title Background, Desktop Border Color.

Public label: Popup Width
Location: Filter Editor > Floating > Desktop Popup
Type: Number with unit
Default value: 350 px
Shown when: Customize Desktop Popup is on.
Availability: Check pricing
What it does: Sets the width of the desktop popup panel.
When to use: Use wider panels for complex filters and narrower panels for simple sidebar-like filters.
Side effects / performance notes: Very wide panels can obscure product context; very narrow panels can wrap labels.
Related options: Desktop Popup Max Height, Desktop Arrival Side, Block Width (Desktop).

Public label: Popup Max Height
Location: Filter Editor > Floating > Desktop Popup
Type: Text
Default value: 80vh
Shown when: Customize Desktop Popup is on.
Availability: Check pricing
What it does: Sets the maximum height of the desktop popup panel.
When to use: Use viewport-based values so the popup stays within the visible screen.
Side effects / performance notes: If content exceeds the max height, scrolling behavior must remain usable.
Related options: Desktop Show Scrollbar, Desktop Padding, Desktop Popup Width.

Desktop Arrival Side

Public label: Arrival Side
Location: Filter Editor > Floating > Desktop Popup
Type: Select
Default value: Right / Left / Top / Bottom / Center
Shown when: Customize Desktop Popup is on.
Availability: Check pricing
What it does: Sets where the desktop popup appears from.
When to use: Use right or left for drawer-like filters, or center for modal-like behavior.
Side effects / performance notes: Top and bottom arrivals can conflict with sticky bars or browser viewport height.
Related options: Desktop Animation, Desktop Popup Width, Desktop Enable Overlay.

Desktop Animation

Public label: Animation
Location: Filter Editor > Floating > Desktop Popup
Type: Radio
Default value: Slide / Fade / None
Shown when: Customize Desktop Popup is on.
Availability: Check pricing
What it does: Sets the desktop popup opening animation.
When to use: Use slide for drawer panels, fade for modal panels, or none for reduced motion contexts.
Side effects / performance notes: Animation should be tested with large product pages and user reduced-motion preferences.
Related options: Desktop Animation Speed, Desktop Arrival Side, Close on ESC Key.

Desktop Animation Speed

Public label: Animation Speed
Location: Filter Editor > Floating > Desktop Popup
Type: Number
Default value: 300 ms
Shown when: Customize Desktop Popup is on and animation is enabled.
Availability: Check pricing
What it does: Sets how quickly the desktop popup opens and closes.
When to use: Use shorter values for snappy interfaces and longer values only when the animation is intentionally prominent.
Side effects / performance notes: Slow animations can make filtering feel delayed.
Related options: Desktop Animation, Desktop Arrival Side, Desktop Close on ESC Key.

Desktop Enable Overlay

Public label: Enable Overlay
Location: Filter Editor > Floating > Desktop Popup
Type: Toggle
Default value: On
Shown when: Customize Desktop Popup is on.
Availability: Check pricing
What it does: Shows a backdrop overlay behind the desktop popup.
When to use: Keep it on when the popup should focus attention and block background interaction.
Side effects / performance notes: Overlays can conflict with other theme modals if stacking is not tested.
Related options: Desktop Overlay Color, Desktop Close on Overlay Click, Desktop Z-Index.

Desktop Overlay Color

Public label: Overlay Color
Location: Filter Editor > Floating > Desktop Popup
Type: Color picker with alpha
Default value: rgba(0,0,0,0.5)
Shown when: Customize Desktop Popup is on and Enable Overlay is on.
Availability: Check pricing
What it does: Sets the desktop popup backdrop color and opacity.
When to use: Use it to make the panel feel modal without hiding all page context.
Side effects / performance notes: Dark overlays can make page content unreadable while the popup is open.
Related options: Desktop Enable Overlay, Desktop Popup Background, Desktop Close on Overlay Click.

Desktop Close on Overlay Click

Public label: Close on Overlay Click
Location: Filter Editor > Floating > Desktop Popup
Type: Toggle
Default value: On
Shown when: Customize Desktop Popup is on and Enable Overlay is on.
Availability: Check pricing
What it does: Lets shoppers close the desktop popup by clicking the overlay.
When to use: Keep it on for modal-like behavior that users expect.
Side effects / performance notes: Turning it off can make the close icon and keyboard behavior more important.
Related options: Desktop Enable Overlay, Desktop Close Icon, Desktop Close on ESC Key.

Desktop Close Icon

Public label: Close Icon
Location: Filter Editor > Floating > Desktop Popup
Type: Select
Default value: X / close / back arrow
Shown when: Customize Desktop Popup is on.
Availability: Check pricing
What it does: Chooses the icon used to close the desktop popup.
When to use: Use a standard close icon unless the popup behaves like a back-navigation drawer.
Side effects / performance notes: Nonstandard close icons can be harder for shoppers to recognize.
Related options: Desktop Close Icon Size, Desktop Close Icon Color, Desktop Close on Overlay Click.

Desktop Close Icon Size

Public label: Close Icon Size
Location: Filter Editor > Floating > Desktop Popup
Type: Number
Default value: 20 px
Shown when: Customize Desktop Popup is on.
Availability: Check pricing
What it does: Sets the desktop popup close icon size.
When to use: Adjust it so the close control is easy to see but not visually dominant.
Side effects / performance notes: Very small close icons can hurt usability; very large icons can crowd the title area.
Related options: Desktop Close Icon, Desktop Close Icon Color, Desktop Title Padding.

Desktop Close Icon Color

Public label: Close Icon Color
Location: Filter Editor > Floating > Desktop Popup
Type: Color picker
Default value: #333333
Shown when: Customize Desktop Popup is on.
Availability: Check pricing
What it does: Sets the close icon color for the desktop popup.
When to use: Use it to maintain contrast against the popup background or title background.
Side effects / performance notes: Low contrast close controls can make the popup feel hard to dismiss.
Related options: Desktop Close Icon, Desktop Popup Background, Desktop Title Background.

Public label: Border Width
Location: Filter Editor > Floating > Desktop Popup
Type: Number
Default value: 0 px
Shown when: Customize Desktop Popup is on.
Availability: Check pricing
What it does: Sets the border width for the desktop popup panel.
When to use: Use it when the panel needs a visible outline against the page or overlay.
Side effects / performance notes: Border width needs a visible border color to matter.
Related options: Desktop Border Color, Desktop Border Radius, Desktop Popup Background.

Public label: Border Color
Location: Filter Editor > Floating > Desktop Popup
Type: Color picker
Default value: #cccccc
Shown when: Customize Desktop Popup is on.
Availability: Check pricing
What it does: Sets the desktop popup border color.
When to use: Use it to match theme card or drawer borders.
Side effects / performance notes: It is visible only when border width is greater than zero.
Related options: Desktop Border Width, Desktop Border Radius, Desktop Popup Background.

Public label: Border Radius
Location: Filter Editor > Floating > Desktop Popup
Type: Number
Default value: 0 px
Shown when: Customize Desktop Popup is on.
Availability: Check pricing
What it does: Rounds the desktop popup panel corners.
When to use: Use it for centered modal-like popups or theme-aligned drawers.
Side effects / performance notes: Drawer panels flush to the viewport edge often look cleaner with low or zero radius.
Related options: Desktop Border Width, Desktop Box Shadow, Desktop Popup Width.

Public label: Box Shadow
Location: Filter Editor > Floating > Desktop Popup
Type: Text
Default value: -4px 0 20px rgba(0,0,0,0.15)
Shown when: Customize Desktop Popup is on.
Availability: Check pricing
What it does: Adds shadow around the desktop popup panel.
When to use: Use it to separate the floating panel from the product page.
Side effects / performance notes: Strong shadows can look heavy over dark overlays.
Related options: Desktop Popup Background, Desktop Border Radius, Desktop Overlay Color.

Public label: Padding
Location: Filter Editor > Floating > Desktop Popup
Type: Four-value number control
Default value: 20/20/20/20 px
Shown when: Customize Desktop Popup is on.
Availability: Check pricing
What it does: Sets inner spacing inside the desktop popup.
When to use: Increase it for roomy modal layouts or reduce it for dense drawer layouts.
Side effects / performance notes: Padding reduces room for filter controls and can increase scrolling.
Related options: Desktop Popup Max Height, Desktop Title Padding, Block Padding.

Desktop Title Text

Public label: Title Text
Location: Filter Editor > Floating > Desktop Popup
Type: Text
Default value: Filter Products
Shown when: Customize Desktop Popup is on.
Availability: Check pricing
What it does: Sets the desktop popup title.
When to use: Use wording that clearly tells shoppers they are refining product results.
Side effects / performance notes: Long titles can collide with the close icon.
Related options: Desktop Title Font Size, Desktop Title Font Color, Desktop Close Icon.

Desktop Title Font Size

Public label: Title Font Size
Location: Filter Editor > Floating > Desktop Popup
Type: Number
Default value: 18 px
Shown when: Customize Desktop Popup is on.
Availability: Check pricing
What it does: Sets the desktop popup title size.
When to use: Use it to match modal or drawer heading styles in the theme.
Side effects / performance notes: Larger title sizes need enough padding and close-icon space.
Related options: Desktop Title Text, Desktop Title Padding, Desktop Close Icon Size.

Desktop Title Font Color

Public label: Title Font Color
Location: Filter Editor > Floating > Desktop Popup
Type: Color picker
Default value: #333333
Shown when: Customize Desktop Popup is on.
Availability: Check pricing
What it does: Sets the desktop popup title color.
When to use: Use it to maintain contrast with the popup or title background.
Side effects / performance notes: Check title contrast separately from option-label contrast.
Related options: Desktop Title Background, Desktop Title Text, Desktop Popup Background.

Desktop Title Background

Public label: Title Background
Location: Filter Editor > Floating > Desktop Popup
Type: Color picker
Default value: transparent
Shown when: Customize Desktop Popup is on.
Availability: Check pricing
What it does: Sets the background behind the desktop popup title area.
When to use: Use it when the title should read as a header bar.
Side effects / performance notes: A title background makes padding and close icon placement more visible.
Related options: Desktop Title Font Color, Desktop Title Padding, Desktop Close Icon Color.

Desktop Title Padding

Public label: Title Padding
Location: Filter Editor > Floating > Desktop Popup
Type: Four-value number control
Default value: 10/10/10/10 px
Shown when: Customize Desktop Popup is on.
Availability: Check pricing
What it does: Sets inner spacing around the desktop popup title.
When to use: Use it when the title has a background or needs more tap-friendly spacing around the close control.
Side effects / performance notes: Padding adds height to the popup header and reduces content space.
Related options: Desktop Title Background, Desktop Close Icon Size, Desktop Padding.

Desktop Show Scrollbar

Public label: Show Scrollbar
Location: Filter Editor > Floating > Desktop Popup
Type: Toggle
Default value: On
Shown when: Customize Desktop Popup is on.
Availability: Check pricing
What it does: Shows a scrollbar when popup content exceeds available height.
When to use: Keep it on for long filter sets so shoppers can tell more content is available.
Side effects / performance notes: Hidden scrollbars can reduce discoverability in long popup panels.
Related options: Desktop Scrollbar Color, Desktop Popup Max Height, Desktop Padding.

Desktop Scrollbar Color

Public label: Scrollbar Color
Location: Filter Editor > Floating > Desktop Popup
Type: Color picker
Default value: #cccccc
Shown when: Customize Desktop Popup is on and Show Scrollbar is on.
Availability: Check pricing
What it does: Sets the scrollbar color in the desktop popup.
When to use: Use it to make popup scrolling visible without clashing with the theme.
Side effects / performance notes: Browser support for scrollbar styling can vary.
Related options: Desktop Show Scrollbar, Desktop Popup Max Height, Desktop Popup Background.

Desktop Show Apply Button

Public label: Show Apply Button
Location: Filter Editor > Floating > Desktop Popup
Type: Toggle
Default value: On
Shown when: Customize Desktop Popup is on.
Availability: Check pricing
What it does: Shows an apply button inside the desktop popup.
When to use: Use it when shoppers should confirm selections before results update or before closing the panel.
Side effects / performance notes: If filtering already applies automatically, the apply button text should not confuse the interaction.
Related options: Desktop Apply Button Text, Desktop Results Count in Button, Activation Type.

Desktop Apply Button Text

Public label: Apply Button Text
Location: Filter Editor > Floating > Desktop Popup
Type: Text
Default value: Apply Filters
Shown when: Customize Desktop Popup is on and Show Apply Button is on.
Availability: Check pricing
What it does: Sets the text for the desktop popup apply button.
When to use: Match it to the store's wording, such as Show Results or Apply.
Side effects / performance notes: Long labels can wrap in narrow popup widths.
Related options: Desktop Show Apply Button, Desktop Results Count in Button, Button Styles.

Desktop Results Count in Button

Public label: Show Results Count in Button
Location: Filter Editor > Floating > Desktop Popup
Type: Toggle
Default value: On
Shown when: Customize Desktop Popup is on and Show Apply Button is on.
Availability: Check pricing
What it does: Adds the result count to the desktop popup apply button.
When to use: Use it when shoppers should know how many products match before closing the popup.
Side effects / performance notes: Live counts can depend on recount and AJAX behavior.
Related options: Desktop Apply Button Text, Recount Products, Show Counts in Filters.

Desktop Close on ESC Key

Public label: Close on ESC Key
Location: Filter Editor > Floating > Desktop Popup
Type: Toggle
Default value: On
Shown when: Customize Desktop Popup is on.
Availability: Check pricing
What it does: Lets shoppers close the desktop popup with the Escape key.
When to use: Keep it on for keyboard-friendly modal behavior.
Side effects / performance notes: If another modal is open, keyboard handling should be checked for conflicts.
Related options: Desktop Close Icon, Desktop Close on Overlay Click, WCAG Accessibility.

Mobile Call Button

Customize Mobile Call Button

Public label: Customize Mobile Call Button
Location: Filter Editor > Floating > Mobile Call Button
Type: Toggle
Default value: Off
Shown when: Enable Floating Mode is on and mobile floating is active.
Availability: Check pricing
What it does: Enables custom styling for the mobile floating call button.
When to use: Turn it on when the mobile button needs custom text, icon, placement, or tap-target sizing.
Side effects / performance notes: Mobile fixed controls must be checked against bottom navigation, cookie banners, and safe areas.
Related options: Mobile Button Type, Mobile Fixed Position, Mobile Z-Index.

Mobile Button Type

Public label: Button Type
Location: Filter Editor > Floating > Mobile Call Button
Type: Visual picker
Default value: Text / Icon / Text+Icon
Shown when: Customize Mobile Call Button is on.
Availability: Check pricing
What it does: Sets whether the mobile call button shows text, an icon, or both.
When to use: Use text plus icon when space allows; use icon-only only when the icon is unmistakable.
Side effects / performance notes: Small icon-only buttons can be hard to understand without an accessible label.
Related options: Mobile Button Text, Mobile Button Icon, Show Call Button.

Mobile Button Text

Public label: Button Text
Location: Filter Editor > Floating > Mobile Call Button
Type: Text
Default value: Filters
Shown when: Customize Mobile Call Button is on and the selected button type includes text.
Availability: Check pricing
What it does: Sets the text on the mobile floating call button.
When to use: Use short wording that fits a narrow mobile viewport.
Side effects / performance notes: Long labels can cover product content or wrap inside the fixed button.
Related options: Mobile Button Type, Mobile Font Size, Mobile Padding.

Mobile Button Icon

Public label: Button Icon
Location: Filter Editor > Floating > Mobile Call Button
Type: Select
Default value: Filter / Sliders / Funnel / Search
Shown when: Customize Mobile Call Button is on and the selected button type includes an icon.
Availability: Check pricing
What it does: Chooses the icon shown on the mobile call button.
When to use: Use a recognizable filter icon for compact mobile placement.
Side effects / performance notes: Icon size and contrast matter more on small screens.
Related options: Mobile Button Type, Mobile Font Color, Mobile Button Text.

Mobile Fixed Position

Public label: Fixed Position
Location: Filter Editor > Floating > Mobile Call Button
Type: Toggle
Default value: On
Shown when: Customize Mobile Call Button is on.
Availability: Check pricing
What it does: Keeps the mobile call button fixed in the viewport while shoppers scroll.
When to use: Use it when filters must remain reachable on long mobile product lists.
Side effects / performance notes: Fixed mobile buttons can overlap bottom bars, chat widgets, and browser safe areas.
Related options: Mobile Position X, Mobile Position Y, Mobile Z-Index.

Mobile Position X

Public label: Position X
Location: Filter Editor > Floating > Mobile Call Button
Type: Number
Default value: 10 px
Shown when: Customize Mobile Call Button is on and Fixed Position is on.
Availability: Check pricing
What it does: Sets the horizontal offset of the mobile call button.
When to use: Adjust it to avoid screen edges or theme controls.
Side effects / performance notes: Small offsets can place the button too close to rounded screen corners or scrollbars.
Related options: Mobile Fixed Position, Mobile Position Y, Mobile Z-Index.

Mobile Position Y

Public label: Position Y
Location: Filter Editor > Floating > Mobile Call Button
Type: Number
Default value: 85%
Shown when: Customize Mobile Call Button is on and Fixed Position is on.
Availability: Check pricing
What it does: Sets the vertical offset of the mobile call button.
When to use: Use it to place the button near the lower part of the viewport without covering bottom navigation.
Side effects / performance notes: Percentage values should be checked on short and tall mobile screens.
Related options: Mobile Fixed Position, Mobile Position X, Mobile Z-Index.

Mobile Font Family

Public label: Font Family
Location: Filter Editor > Floating > Mobile Call Button
Type: Select
Default value: inherit
Shown when: Customize Mobile Call Button is on.
Availability: Check pricing
What it does: Sets the font family for mobile call button text.
When to use: Use it when the mobile button should match the storefront button typography.
Side effects / performance notes: The selected font must already be available on the page.
Related options: Mobile Font Size, Mobile Button Text, Button styles.

Mobile Font Size

Public label: Font Size
Location: Filter Editor > Floating > Mobile Call Button
Type: Number
Default value: 12 px
Shown when: Customize Mobile Call Button is on.
Availability: Check pricing
What it does: Sets the mobile call button text size.
When to use: Use the smallest readable size that still fits the fixed button.
Side effects / performance notes: Very small text can hurt readability and accessibility.
Related options: Mobile Font Family, Mobile Padding, Mobile Button Text.

Mobile Font Color

Public label: Font Color
Location: Filter Editor > Floating > Mobile Call Button
Type: Color picker
Default value: #ffffff
Shown when: Customize Mobile Call Button is on.
Availability: Check pricing
What it does: Sets the mobile call button text and icon color.
When to use: Use it to keep the button readable against its background.
Side effects / performance notes: Check contrast outdoors and on high-brightness mobile screens.
Related options: Mobile Background Color, Mobile Button Icon, Mobile Font Size.

Mobile Background Color

Public label: Background Color
Location: Filter Editor > Floating > Mobile Call Button
Type: Color picker
Default value: #2271b1
Shown when: Customize Mobile Call Button is on.
Availability: Check pricing
What it does: Sets the mobile call button background color.
When to use: Use a visible color that does not conflict with primary add-to-cart controls.
Side effects / performance notes: Strong fixed colors can draw attention away from product cards.
Related options: Mobile Font Color, Mobile Border Radius, Mobile Box Shadow.

Mobile Button Border Radius

Public label: Border Radius
Location: Filter Editor > Floating > Mobile Call Button
Type: Number
Default value: 50 px
Shown when: Customize Mobile Call Button is on.
Availability: Check pricing
What it does: Rounds the mobile call button corners.
When to use: Use pill-like radius for compact mobile floating buttons.
Side effects / performance notes: Large radius works best when padding and height are balanced.
Related options: Mobile Padding, Mobile Background Color, Mobile Box Shadow.

Mobile Button Box Shadow

Public label: Box Shadow
Location: Filter Editor > Floating > Mobile Call Button
Type: Text
Default value: 0 4px 12px rgba(0,0,0,0.25)
Shown when: Customize Mobile Call Button is on.
Availability: Check pricing
What it does: Adds shadow around the mobile call button.
When to use: Use it to separate the button from product images and scrolling content.
Side effects / performance notes: Heavy shadow can make a fixed mobile control feel visually heavy.
Related options: Mobile Background Color, Mobile Border Radius, Mobile Z-Index.

Mobile Button Padding

Public label: Padding
Location: Filter Editor > Floating > Mobile Call Button
Type: Four-value number control
Default value: 12/16/12/16 px
Shown when: Customize Mobile Call Button is on.
Availability: Check pricing
What it does: Sets inner spacing inside the mobile call button.
When to use: Increase it for a stronger tap target or reduce it to avoid covering content.
Side effects / performance notes: Padding directly affects fixed button size and screen coverage.
Related options: Mobile Font Size, Mobile Button Text, Mobile Border Radius.

Mobile Z-Index

Public label: Z-Index
Location: Filter Editor > Floating > Mobile Call Button
Type: Number
Default value: 9999
Shown when: Customize Mobile Call Button is on.
Availability: Check pricing
What it does: Controls the stacking level of the mobile call button.
When to use: Adjust it if the button appears behind sticky headers, bottom bars, or popups.
Side effects / performance notes: Very high values can place the button above important modals or notices.
Related options: Mobile Fixed Position, Mobile Popup, Mobile Enable Overlay.

Mobile Active Count Badge

Public label: Show Active Count Badge
Location: Filter Editor > Floating > Mobile Call Button
Type: Toggle
Default value: Off
Shown when: Customize Mobile Call Button is on.
Availability: Check pricing
What it does: Shows the number of active selections on the mobile call button.
When to use: Use it so shoppers can tell filters are active while the popup is closed.
Side effects / performance notes: Badges must remain legible inside a small fixed control.
Related options: Display Selected Params, Mobile Results Count in Button, Filter Synchro.

Public label: Customize Mobile Popup
Location: Filter Editor > Floating > Mobile Popup
Type: Toggle
Default value: Off
Shown when: Enable Floating Mode is on and mobile floating is active.
Availability: Check pricing
What it does: Enables custom styling and behavior for the mobile floating popup.
When to use: Turn it on when the mobile popup needs custom size, animation, title, overlay, or touch behavior.
Side effects / performance notes: Mobile popup settings must be tested on real narrow viewports and with the theme's mobile navigation.
Related options: Mobile Popup Width, Mobile Arrival Side, Swipe to Close.

Public label: Popup Background
Location: Filter Editor > Floating > Mobile Popup
Type: Color picker
Default value: #ffffff
Shown when: Customize Mobile Popup is on.
Availability: Check pricing
What it does: Sets the mobile popup panel background.
When to use: Use it to keep filter content readable above the product page.
Side effects / performance notes: Background color should contrast with labels, controls, and close icons.
Related options: Mobile Overlay Color, Mobile Title Text, Mobile Popup Width.

Public label: Popup Width
Location: Filter Editor > Floating > Mobile Popup
Type: Number with unit
Default value: 100%
Shown when: Customize Mobile Popup is on.
Availability: Check pricing
What it does: Sets the width of the mobile popup panel.
When to use: Keep it full width for bottom sheets and narrow screens unless a custom centered layout is intentional.
Side effects / performance notes: Narrow mobile popups can make controls hard to tap and labels wrap heavily.
Related options: Mobile Popup Max Height, Mobile Arrival Side, Mobile Padding.

Public label: Popup Max Height
Location: Filter Editor > Floating > Mobile Popup
Type: Text
Default value: 90vh
Shown when: Customize Mobile Popup is on.
Availability: Check pricing
What it does: Sets the maximum height of the mobile popup.
When to use: Use viewport-based height so the popup stays usable on short screens.
Side effects / performance notes: Long filters need clear scrolling when max height is reached.
Related options: Mobile Popup Width, Mobile Padding, Mobile Arrival Side.

Mobile Arrival Side

Public label: Arrival Side
Location: Filter Editor > Floating > Mobile Popup
Type: Select
Default value: Bottom / Left / Right / Top / Center
Shown when: Customize Mobile Popup is on.
Availability: Check pricing
What it does: Sets where the mobile popup appears from.
When to use: Use bottom for sheet-like mobile patterns, or side arrivals for drawer-style layouts.
Side effects / performance notes: Top and bottom panels should be checked against mobile browser chrome and sticky bars.
Related options: Mobile Animation, Mobile Popup Max Height, Swipe to Close.

Mobile Animation

Public label: Animation
Location: Filter Editor > Floating > Mobile Popup
Type: Radio
Default value: Slide / Fade / None
Shown when: Customize Mobile Popup is on.
Availability: Check pricing
What it does: Sets the mobile popup opening animation.
When to use: Use slide for bottom sheets or drawers, fade for modal-style panels, or none for reduced motion needs.
Side effects / performance notes: Heavy animation can feel slow on older mobile devices.
Related options: Mobile Animation Speed, Mobile Arrival Side, Swipe to Close.

Mobile Animation Speed

Public label: Animation Speed
Location: Filter Editor > Floating > Mobile Popup
Type: Number
Default value: 300 ms
Shown when: Customize Mobile Popup is on and animation is enabled.
Availability: Check pricing
What it does: Sets how quickly the mobile popup opens and closes.
When to use: Keep it short enough that filtering feels responsive.
Side effects / performance notes: Long transitions can make the interface feel laggy.
Related options: Mobile Animation, Mobile Arrival Side, Sequence Auto-Scroll.

Mobile Enable Overlay

Public label: Enable Overlay
Location: Filter Editor > Floating > Mobile Popup
Type: Toggle
Default value: On
Shown when: Customize Mobile Popup is on.
Availability: Check pricing
What it does: Shows a backdrop overlay behind the mobile popup.
When to use: Keep it on when the popup should block product interaction until closed or applied.
Side effects / performance notes: Overlays can obscure product context and conflict with other mobile modals.
Related options: Mobile Overlay Color, Mobile Close on Overlay Click, Mobile Z-Index.

Mobile Overlay Color

Public label: Overlay Color
Location: Filter Editor > Floating > Mobile Popup
Type: Color picker with alpha
Default value: rgba(0,0,0,0.6)
Shown when: Customize Mobile Popup is on and Enable Overlay is on.
Availability: Check pricing
What it does: Sets the mobile popup backdrop color and opacity.
When to use: Use it to focus attention on the filter panel while preserving enough page context.
Side effects / performance notes: Dark overlays can make the page feel blocked if filtering is frequent.
Related options: Mobile Enable Overlay, Mobile Popup Background, Mobile Close on Overlay Click.

Mobile Close on Overlay Click

Public label: Close on Overlay Click
Location: Filter Editor > Floating > Mobile Popup
Type: Toggle
Default value: On
Shown when: Customize Mobile Popup is on and Enable Overlay is on.
Availability: Check pricing
What it does: Lets shoppers close the mobile popup by tapping the overlay.
When to use: Keep it on for expected modal behavior unless accidental closes are a concern.
Side effects / performance notes: If it is off, the close icon, apply button, or swipe behavior must be obvious.
Related options: Mobile Enable Overlay, Mobile Close Icon, Swipe to Close.

Mobile Close Icon

Public label: Close Icon
Location: Filter Editor > Floating > Mobile Popup
Type: Select
Default value: X / close / back arrow
Shown when: Customize Mobile Popup is on.
Availability: Check pricing
What it does: Chooses the icon used to close the mobile popup.
When to use: Use a standard close icon for modal behavior or a back-style icon for drawer behavior.
Side effects / performance notes: Small or unusual icons can make the popup hard to dismiss.
Related options: Mobile Close Icon Size, Mobile Close Icon Color, Swipe to Close.

Mobile Close Icon Size

Public label: Close Icon Size
Location: Filter Editor > Floating > Mobile Popup
Type: Number
Default value: 24 px
Shown when: Customize Mobile Popup is on.
Availability: Check pricing
What it does: Sets the mobile popup close icon size.
When to use: Use a size that is easy to tap and visually balanced with the title.
Side effects / performance notes: The close target should remain comfortable even if the icon graphic is small.
Related options: Mobile Close Icon, Mobile Close Icon Color, Mobile Title Font Size.

Mobile Close Icon Color

Public label: Close Icon Color
Location: Filter Editor > Floating > Mobile Popup
Type: Color picker
Default value: #333333
Shown when: Customize Mobile Popup is on.
Availability: Check pricing
What it does: Sets the mobile popup close icon color.
When to use: Use it to keep the close action visible against the popup background.
Side effects / performance notes: Low contrast close icons are a usability risk on mobile.
Related options: Mobile Close Icon, Mobile Popup Background, Mobile Title Text.

Public label: Padding
Location: Filter Editor > Floating > Mobile Popup
Type: Four-value number control
Default value: 16/16/16/16 px
Shown when: Customize Mobile Popup is on.
Availability: Check pricing
What it does: Sets inner spacing inside the mobile popup.
When to use: Use it to keep filter controls away from screen edges and safe areas.
Side effects / performance notes: Too much padding reduces room for filter content and increases scrolling.
Related options: Mobile Popup Width, Mobile Popup Max Height, Touch-friendly Swatch Size.

Mobile Title Text

Public label: Title Text
Location: Filter Editor > Floating > Mobile Popup
Type: Text
Default value: Filter Products
Shown when: Customize Mobile Popup is on.
Availability: Check pricing
What it does: Sets the mobile popup title.
When to use: Use short wording that makes the filter purpose clear.
Side effects / performance notes: Long titles can collide with the close icon on narrow screens.
Related options: Mobile Title Font Size, Mobile Close Icon, Mobile Apply Button Text.

Mobile Title Font Size

Public label: Title Font Size
Location: Filter Editor > Floating > Mobile Popup
Type: Number
Default value: 16 px
Shown when: Customize Mobile Popup is on.
Availability: Check pricing
What it does: Sets the mobile popup title size.
When to use: Use it to keep the header readable without taking too much vertical space.
Side effects / performance notes: Large titles reduce visible filter content above the fold.
Related options: Mobile Title Text, Mobile Close Icon Size, Mobile Padding.

Mobile Show Apply Button

Public label: Show Apply Button
Location: Filter Editor > Floating > Mobile Popup
Type: Toggle
Default value: On
Shown when: Customize Mobile Popup is on.
Availability: Check pricing
What it does: Shows an apply button inside the mobile popup.
When to use: Use it when mobile shoppers should review choices before updating or closing the popup.
Side effects / performance notes: The apply button should remain easy to reach in long popup content.
Related options: Mobile Apply Button Text, Mobile Results Count in Button, Activation Type.

Mobile Apply Button Text

Public label: Apply Button Text
Location: Filter Editor > Floating > Mobile Popup
Type: Text
Default value: Apply Filters
Shown when: Customize Mobile Popup is on and Show Apply Button is on.
Availability: Check pricing
What it does: Sets the mobile popup apply button text.
When to use: Keep it short and action-oriented, such as Apply or Show Results.
Side effects / performance notes: Long labels can wrap or crowd result counts.
Related options: Mobile Show Apply Button, Mobile Results Count in Button, Button Styles.

Mobile Results Count in Button

Public label: Show Results Count in Button
Location: Filter Editor > Floating > Mobile Popup
Type: Toggle
Default value: On
Shown when: Customize Mobile Popup is on and Show Apply Button is on.
Availability: Check pricing
What it does: Adds the result count to the mobile popup apply button.
When to use: Use it when shoppers should know how many products match before applying or closing.
Side effects / performance notes: Counts depend on recount and AJAX behavior and can increase button text length.
Related options: Mobile Apply Button Text, Recount Products, Show Counts in Filters.

Mobile Close on ESC Key

Public label: Close on ESC Key
Location: Filter Editor > Floating > Mobile Popup
Type: Toggle
Default value: On
Shown when: Customize Mobile Popup is on.
Availability: Check pricing
What it does: Allows the mobile popup to close when the Escape key is sent by a keyboard or browser environment.
When to use: Keep it on for keyboard and assistive-device consistency.
Side effects / performance notes: Keyboard behavior is more relevant on tablets, external keyboards, and accessibility tools.
Related options: Mobile Close Icon, Mobile Close on Overlay Click, WCAG Accessibility.

Swipe to Close

Public label: Swipe to Close
Location: Filter Editor > Floating > Mobile Popup
Type: Toggle
Default value: On
Shown when: Customize Mobile Popup is on.
Availability: Check pricing
What it does: Lets shoppers close the mobile popup with a swipe gesture.
When to use: Use it for bottom-sheet or drawer patterns where swipe dismissal is expected.
Side effects / performance notes: Swipe behavior should not conflict with scrolling long filter lists.
Related options: Mobile Arrival Side, Mobile Animation, Mobile Close on Overlay Click.

Touch-Friendly Swatch Size

Public label: Touch-friendly Swatch Size
Location: Filter Editor > Floating > Mobile Popup
Type: Number
Default value: 0 px (auto)
Shown when: Customize Mobile Popup is on.
Availability: Check pricing
What it does: Sets or inherits a mobile-friendly size for swatch controls in the popup.
When to use: Increase it when color, image, or visual swatches are hard to tap on mobile.
Side effects / performance notes: Larger swatches can increase scrolling in filter blocks with many values.
Related options: Swatch Shape, Mobile Padding, Checkbox Size.