Card settings

Customize the appearance, layout, images, text, and call-to-action buttons across all cards in your shop with flexible settings for styles, aspect ratios, and alignments, ensuring a consistent and on-brand storefront experience.

Last updated 4 months ago

Overview

Card settings define the global appearance of all card elements across your store—used for products, collections, blog posts, and more. They ensure every card maintains a cohesive, on-brand look while allowing section- or block-level customization when needed.

⚠️ Important: Adjusting Card settings sets a unified visual standard for all cards, helping you maintain a polished, consistent, and user-friendly storefront.

Key components and functionality

Card settings let you fine-tune layout, imagery, button style, text display, and alignment for all cards. These options are designed for flexibility, making it simple to keep cards appealing, accessible, and visually unified.

Image aspect ratio (cards)

This setting governs the proportions of card images on desktop and larger screens. Consistent aspect ratios can help avoid awkward cropping and maintain visual balance throughout your store. Use this option to give your imagery a uniform, professional appearance.

  1. Use theme setting
    Default. Adopts the global image aspect ratio setting.

  2. Default
    Preserves each image's natural shape.

  3. Landscape
    Uses a wide-format ratio for card images.

  4. Portrait
    Sets a tall, vertical shape for imagery.

  5. Square
    Makes all card images perfectly square.

  6. Widescreen
    Creates a cinematic, broad appearance.

  7. Ultrawide
    Uses the widest ratio available for bold, panoramic visuals.

Image aspect ratio (mobile cards)

This setting allows you to provide a different image proportion for cards on smaller screens. It’s useful for optimizing images for mobile users, maintaining both function and aesthetics when space is limited.

  1. Use theme setting
    Default. Inherits the desktop/standard aspect ratio unless overridden.

  2. Default
    Keeps each image's natural proportions.

  3. Landscape
    Wide format, useful for mobile grids or lists.

  4. Portrait
    Tall format; details remain prominent on smaller screens.

  5. Square
    Uniform appearance for mobile card layouts.

  6. Widescreen
    Cinematic effect for mobile imagery.

  7. Ultrawide
    Generates panoramic impact even on compact displays.

💡 Tip: Supplying unique image aspect ratios for mobile enables you to prioritize key image areas and optimize for mobile context and performance.

Card text display

This setting manages which text elements are visible in your cards. You can balance detail, clarity, and design simplicity as needed by choosing how much or how little text to show.

  1. Use theme setting
    Default. Mirrors card text rules from your global settings.

  2. Title and excerpt
    Shows both a headline and summary or excerpt for richer context.

  3. Excerpt only
    Displays only the summary or supporting text.

  4. Title only
    Limits display to the headline for a concise appearance.

  5. No text
    Card contains visuals only, with no text present.

Usage notes

  1. You might consider setting unique aspect ratios for desktop and mobile to keep images clear—especially when details or orientation matter for content.

  2. Always confirm accessibility by maintaining high color contrast and legibility for text—this is vital no matter what design choices you make.

⚠️ Important: Setting clear defaults for imagery, text, and CTA buttons helps you deliver a consistent, visually attractive experience. Review all card presentations across devices and layouts to ensure updates display as intended.