Auto-collapse banner on scroll Consentik Shopify

Overview

Auto-collapse on scroll lets the cookie banner shrink into a small floating button after a visitor scrolls down the page.
This keeps your store tidy and reduces interruption, while still letting visitors reopen the banner whenever they want. The feature is optional and can be turned on only for supported banner layouts.

How it works

When the feature is enabled, the banner automatically collapses once the visitor scrolls past 200 px down the page.
The collapsed state appears as a small floating cookie icon, positioned in the same corner as the re-open button. It uses the banner's own cookie icon, so the collapsed button, the re-open button, and the banner all stay visually consistent.
Before consent is given, the behavior is bi-directional:

• Scrolling down past 200 px collapses the banner.
• Scrolling back up above 200 px expands the banner again.

After consent is given, the behavior becomes one-way for each cycle:

• Scrolling down past 200 px collapses the banner.
• Scrolling back up does not expand it again.
• The visitor clicks the collapsed button (or the re-open button) to show the banner again.

If a visitor lands on a page that is already scrolled past the trigger point, the banner starts in the collapsed state right away — there is no flash of the full banner.

Supported layouts

Auto-collapse on Scroll is available for:

• Corner layouts (any corner).
• Full-Width Top or Full-Width Bottom layouts when the banner width is set to 100%.

It is not available for:

• Center layout.
• Full-width banners narrower than 100%.
• Any layout outside the supported corner and full-width options.

The option only appears in your settings when your current layout supports it. It also runs on the latest version of the banner, so if your store is still using an older banner version, the option won't be shown.

How to turn it on

1. In your app admin, go to Settings → Design.
2. Find the Auto-collapse on scroll card (between Layout & Position and Theme).
3. Turn on the toggle.
4. Review the confirmation dialog and select Enable.

What happens when you enable it

To keep the collapsed button, the re-open button, and the banner consistent, turning on the feature automatically applies a few related changes:

• Shows the banner's cookie icon.
• Shows the re-open button.
• Switches the re-open button from text to icon (if it was set to text).
• Matches the re-open button's icon and size to the banner's cookie icon.
• Anchors the re-open button to the banner's corner and margin.
• Turns off Block Interaction, because visitors must be able to scroll for the banner to collapse.

These changes are applied automatically when you enable the feature. They are not automatically reverted when you turn it off — if you want your previous setup back, adjust those settings manually.

Re-open button behavior

While Auto-collapse on Scroll is active, the re-open button stays in icon mode and uses the same icon as the banner. Its position and margins are managed by the feature so it lines up exactly with the collapsed button.
If you switch the re-open button back to text mode, Auto-collapse on Scroll is turned off. The app asks you to confirm first, so this never happens by accident. This prevents a mismatch between the collapsed button and the standard re-open button.

Block Interaction

Auto-collapse on Scroll and Block Interaction cannot be active at the same time, because Block Interaction overlays the page and prevents visitors from scrolling.
If you turn Block Interaction back on while Auto-collapse is enabled, the app asks you to confirm, and turning it on switches Auto-collapse off.

Position and visual consistency

The collapsed button and the re-open button always share the same corner, margin, icon, and size, so the experience stays consistent before and after consent.
The collapsed button uses the banner's cookie icon rather than a separate custom icon. It also takes its background color from the banner, and if you use the Glass Effect, it inherits the same translucency and blur.

Visitor experience

When a visitor scrolls down far enough, the full banner smoothly contracts into the small floating icon instead of disappearing abruptly.
The visitor can click that icon at any time to open the banner again. The same handoff happens at consent: when a visitor selects Accept, Decline, Accept Selection, or Close, the banner shrinks into the icon, which then acts as the re-open button. The icon a visitor sees after consent is the same one the banner collapsed into while scrolling.

Turning the feature off

There are three ways to turn Auto-collapse on Scroll off:

• Toggle it off in the Auto-collapse on scroll card. The changes applied when you enabled it are not reverted automatically, and the re-open button's position and margin inputs reappear with your previously saved values.
• Switch the re-open button back to text mode (after confirming).
• Turn Block Interaction back on (after confirming).

Important limitations

• Auto-collapse on Scroll cannot run together with Block Interaction.
• It is available only for the supported corner and full-width (100%) layouts — not Center layout or full-width banners narrower than 100%.
• It runs on the latest banner version only.
• The feature is controlled by plan availability, so it is shown only for merchants whose plan includes Scroll Collapse support.

Updated on: 24/06/2026