The Media cards section allows you to showcase products, collections, lookbooks, or lifestyle features using structured multi-column visual cards. Each card supports either image or video media paired with customizable text blocks, helping you create clean editorial grids or interactive carousels.
Click on Media cards in the left sidebar to access the general section settings in the right sidebar.
Configure the column layout and mobile scrolling behavior:
Number of columns on desktop: Set how many media cards display per row on desktop screens (e.g., 3 columns).
Mousewheel control: Toggle to enable horizontal scrolling using a mouse wheel when viewing cards in carousel mode.
Mobile slide width: Adjust the visible width percentage of cards on mobile screens (in percentage, e.g., 100%; setting below 100% reveals a preview of the next slide).
Customize header text alignment and supplementary right-aligned content:
Header right text: Add optional descriptive text or links aligned to the right side of the section header.
Center section header: Toggle to center-align the section header.
Adjust the aspect ratio and text alignment across all cards in the section:
Media height: Select the height/aspect ratio for card visuals on desktop (e.g., Adapt to first image).
Mobile media height: Select the height/aspect ratio for card visuals on mobile devices (e.g., Adapt to first image).
Alignment: Choose the text alignment inside each card (Left, Center, or Right).
Customize the color scheme, container width, and outer spacing:
Color scheme: Select a color scheme for the section. Click Edit scheme to customize presets.
Width: Choose between Page (contained width layout) or Full (edge-to-edge full width).
Padding: Control the top and bottom spacing for desktop and mobile views.
Click Add block under Section header to insert elements such as Heading, Subheading, Text, or Spacer.
Subheading: Add a short introductory tagline above the main title (e.g., Discover versatile silhouettes crafted for modern living).
Heading: Enter the main headline to highlight your message or promotion (e.g., Carried Your Way).
Text: Add a descriptive paragraph or supporting summary.
Group button & Button: Insert call-to-action buttons or redirect visitors to other pages.
Click Add block under Media cards to insert individual Media card blocks. Each block represents one visual card item.
Media type: Choose between Image or Video for the card's primary visual.
Image / Video: Upload or select the visual asset to display inside the card.
Inside each Media card block, click Add block to insert text or action elements below the media:
Heading: Add a title for the card (e.g., Effortless Crossbody, The Workday Tote, Timeless Shoulder Bag).
Text / Subheading / Button: Optionally add descriptions or call-to-action links to direct shoppers to specific products or collections.