Seventh > Popovers

Popovers

The Popovers section shows overlay cards (popups) that can appear after a delay or on scroll. Each block is a popover card: generic card, collection card, or product card.

What it does

This section displays:

• A stack of popover blocks aligned left or right
• Each block can show after a delay (seconds) or after scrolling a percentage of the page
• Visibility rules and repeat frequency (once, daily, weekly) per block
• Card content and styling options per block type

Section settings explained

Alignment

• Left or Right — Horizontal alignment of the popover stack (e.g. where the cards appear on screen).

The section has no other settings. All behavior and content are configured per block.

Popover block types and options

All popover blocks use the same settings for visibility, functionality, and (where applicable) card style.

Popover Card

A generic card that can hold any mix of theme blocks (headings, text, buttons, newsletter form, etc.) and app blocks.

Visibility

• Where to show — All pages, Homepage only, All product pages, All collection pages, Cart, or No homepage.
• Selected collections / Selected products — Limit visibility to chosen collections or products.

Functionality

• Show after — Delay in seconds (1–60) before the popover appears.
• Show after scroll — When enabled, trigger is based on scroll instead of (or in addition to) time.
• Scroll position — Page scroll percentage (0–100%) that triggers the popover when scroll-based trigger is on.
• Frequency — Day, Week, or Once (how often the popover is shown to the same visitor).

Card style

• Text alignment — Left, center, right.
• Inner blocks spacing — xxsmall through xlarge.
• Padding — xsmall through xxlarge (when background is not hidden).
• Add padding to media — When background is visible.
• Remove card background — Hide card background.
• Border radius — 0, 5, 10, or 30 (when background is visible).
• Color scheme — Theme color scheme for the card.

Inner blocks

• Theme & app blocks — e.g. heading, text, button, newsletter form.

Popover Collection Card

A popover that shows a selected collection with optional title, thumbnail, caption, and count.

Visibility

• Same as Popover Card

Functionality

• Same as Popover Card

Content

• Collection — Collection picker (select a collection to feature).

Card style

• Same as Popover Card

Inner blocks

• Collection specific blocks
• Theme & app blocks — e.g. heading, text, button, newsletter form.

Popover Product Card

A popover that shows a selected product with thumbnail, title, price, vendor, variants, etc.

Visibility

• Same as Popover Card

Functionality

• Same as Popover Card

Content

• Product — Product picker (select a product to feature).

Card style

• Same as Popover Card

Inner blocks

• Product specific blocks
• Theme & app blocks — e.g. heading, text, button, newsletter form.

Common use cases

• Newsletter signup popover after a few seconds or after scrolling
• Promotional product or collection popover on product/collection pages
• One-time announcement (frequency: Once) with a CTA

Tips for success

• Keep popover content short (headline, short text, one CTA).
• Use visibility so product/collection popovers only show on relevant pages.
• Avoid too many popovers in one overlay group to reduce clutter.

Troubleshooting

• If the popover never appears, visibility (page type and selected collections/products), and Show after / Show after scroll.
• If it appears too often or not often enough, adjust frequency and (for scroll) scroll position.
• If card layout looks wrong, adjust card style (padding, spacing, background) in the block settings.
• If popups are cut out, reduce the number of popups in a specific page, or give more time between each appearance.