Stories

A row of tappable story circles, similar to social-media stories, each opening a full-screen slideshow of images, videos, or YouTube clips with optional text, buttons, and linked products.

Enable Section

Turns the whole section on or off without deleting its settings.

Section Header

• Section Title / Section Description - the heading and supporting text for the section.
• Title Font Weight / Subtitle Font Weight - how bold each text appears.
• Header Style - centered above the stories, or split to sit side by side.
• Heading Alignment - left, center, or right.
• Title Pre Decoration / Subtitle Pre Decoration - a small decorative touch before each: none, a bar/underline/spark for the title, or a line/spark for the subtitle.
• Eyebrow (above title) - a short line of text shown just above the section title, handy for a small tagline such as “New Arrivals”. Leave it empty to hide it.
• Eyebrow Style - how the eyebrow looks: Plain text, With Line (a short line before the text), or Pill (the text inside a small rounded badge).
• Eyebrow Font Weight - how bold the eyebrow text appears, from Light to Extrabold.
• Eyebrow Color - the color of the eyebrow text. If left empty, the theme’s accent color is used.
• Badge Background Color - the fill color behind the eyebrow text. Only shows when Eyebrow Style is set to Pill.
• Main Title Color (optional) - a custom color for the section title. Leave it empty to keep the default color.
• Subtitle Color (optional) - a custom color for the subtitle. Leave it empty to keep the default color.

Section Appearance

• Show Heading - turns the section’s own heading text on or off.
• Maximum Width (0 = full width) - the widest the section can grow, in pixels.
• Top Spacing / Bottom Spacing - the empty space above and below the section.
• Background Color / Background Gradient (CSS) / Background Image - the section’s background, as a solid color, a color blend, or a picture (whichever is set takes effect).
• Background Image Overlay / Background Image Overlay Opacity - a tinted layer over the background image and how strong it appears.

Stories Rail

• Circle Size - the diameter of each story circle.
• Space Between Stories - the gap between circles.
• Stories Alignment - Start, Center, or End.
• Number of Stories on Desktop / Tablet / Mobile - how many circles are visible at once before scrolling, at each screen size.

Circle Style

• Show Story Title - toggles the label under (or inside) each circle.
• Story Title Position - Below the circle, or Inside it. Only relevant when Show Story Title is on.
• Story Title Color / Story Title Font Size - the look of that label.
• Story Border Width - the thickness of the ring around each circle.
• Story Border Radius (50% = full circle) - how rounded the circle is; 50% is a perfect circle, lower values are more square.
• Story Border Color (Unviewed) / Story Border Color (Viewed) - the ring color before and after a visitor has opened that story.
• Story Background Color - the fill color behind the story’s cover image.
• Enable Hover Animation / Enable Entrance Animation - small motion effects when a visitor points at a circle, or when the row first appears.

Story Viewer

Settings for the full-screen slideshow that opens when a story is tapped.

• Enable Progress Bar / Progress Bar Color / Progress Bar Height - the thin bar showing how far through the current story a visitor is.
• Show Close Button / Show Story Counter / Show Navigation Buttons - toggle the close (×) button, a “2 / 5” style counter, and next/previous arrows.
• Enable Keyboard Navigation / Enable Swipe Gestures - lets visitors move between slides with arrow keys, or by swiping on touch devices.
• Enable Autoplay - automatically advances to the next slide after its duration.
• Pause When Tab Is Hidden - pauses playback if the visitor switches to a different browser tab.

Performance

• Lazy-load Story Covers - only loads circle cover images as they scroll into view, speeding up the initial page load.
• Preload Next Slide - loads the upcoming slide in the background while the current one is showing, for a smoother transition.

Stories

Each entry in this list is one story (one circle).

• Enable Story - turns this specific story on or off.
• Story Title - the label shown with the circle.
• Story ID (optional) - used to remember the viewed state - an internal identifier so the theme can remember a visitor already watched this story.
• Sort Order (lower shows first) - controls the order stories appear in, independent of the list order.
• Start Date / End Date (optional - YYYY-MM-DD) - a date range during which this story is shown; outside that range it’s hidden automatically.
• Cover Image - the picture shown on the circle itself.
• Cover Background Color / Cover Gradient (CSS) - a fallback color or gradient behind the cover, visible if the image doesn’t fill the circle.
• Override This Story’s Border - when on, lets this specific story use its own border color/width/radius instead of the shared Circle Style settings.
• Cover Border Color / Cover Border Width / Cover Border Radius - this story’s own border settings, used only when the override above is on.
• Show “New” Badge / Badge Text / Badge Color - an optional small badge (like “New”) shown on this story’s circle.
• Story Action - what happens when this circle is tapped: Open Story Viewer (the normal slideshow), or jump straight to a Product, Category, Brand, Collection, or an External URL.
• Product / Category / Brand Page URL / Collection Page URL / URL - the destination, matching whichever Story Action is chosen.
• Open Link In New Tab - when the action is a direct link, whether it opens in a new browser tab.

Story Slides

Each story contains its own list of slides - the sequence shown when that story is opened.

• Enable Slide - turns this specific slide on or off.
• Media Type - Image, an Uploaded Video, or a YouTube Video.
• Image / Image Alt Text / Image Fit - the picture, its accessibility description, and whether it fills the frame (Cover) or fits inside it fully (Contain). Used when Media Type is Image.
• Video File / Autoplay / Loop / Mute / Show Controls / Start Time / End Time - the uploaded video and its playback behavior. Used when Media Type is Uploaded Video.
• YouTube URL and the matching Autoplay / Mute / Loop / Show Controls / Hide YouTube Branding / Privacy Enhanced Mode / Start Time / End Time - the YouTube video and its playback behavior. Used when Media Type is YouTube Video.
• Slide Background - Transparent, a Solid Color, a Gradient, or a Background Image shown behind the media (mainly visible if the media doesn’t fill the frame).
• Enable Overlay / Overlay Color / Overlay Opacity - a tinted layer over the slide, which can help text stand out.
• Small Label / Heading / Description - text overlaid on the slide.
• Text Alignment / Text Color - how that text is aligned and colored.
• Heading Font Size / Description Font Size / Font Weight - sizing and boldness of the overlaid text.
• Enable Button / Button Label / Button URL / Open In New Tab / Button Style - an optional button on the slide, its destination, and its look.
• Linked Card At The Bottom - whether a small card appears at the bottom of the slide, linking to None, a Product, a Category, or an External URL/Page.
• Linked Product / Linked Category / Link - external page, store page, or legal page - the destination, matching the link type chosen.
• Card Title / Card Image (optional) - the title and picture on that linked card, for the URL link type.
• Show Price - shows the price on the linked card, when linking to a Product.
• Card Action Text (optional) / Linked Card Style - a short call-to-action label, and whether the card shows as a full Card With Image or a Compact Pill.
• Slide Duration - how long the slide stays on screen (3, 5, or 8 seconds), Play Full Video to let an uploaded video finish before advancing, or Custom for a specific duration you set below.
• Custom Duration (seconds) - the exact duration, only used when Slide Duration is Custom.