Soul Documentation
  • Greeting
  • UPDATES
    • What's new in Soul
      • Release Notes
      • Version 3.1.0 release
      • Version 3.0.0 release
    • Demo stores
      • Elegant
      • Warm
      • Dark
  • SECTIONS
    • Header
      • Announcement bar
      • Header
    • Template sections
      • A to Z brands
      • Blog posts
      • Collage
      • Collapsible content
      • Collection list
      • Collection showcase
      • Collection spotlight grid
      • Contact form
      • Custom Liquid
      • Dynamic hover blocks
      • Email signup
      • Featured collection
      • Featured product
      • Flexible content
      • Image banner
      • Image comparison
      • Image gallery
      • Image with text
      • Image with product
      • Lookbook
      • Map
      • Multicolumn
      • Multirow
      • Rich text
      • Page
      • Recently viewed products
      • Running text with image
      • Shop the look
      • Slideshow
      • Testimonials
      • Video
    • Footer
    • Popup
  • THEME SETTINGS
    • Logo
    • Colors
    • Typography
    • Layout
    • Animations
    • Buttons
    • Variant pills
    • Inputs
    • Product cards
    • Collection cards
    • Blog cards
    • Pop-ups
    • Badges
    • Social media
    • Search behavior
    • Currency format
    • Cart
    • Breadcrumb
    • Preloading screen
    • Back to top
    • Custom CSS
  • COLLECTION LIST PAGE
    • Collections list page
  • COLLECTION PAGE
    • Collection
      • Collection banner
      • Product grid
  • PRODUCT PAGE
    • Product page
      • Product information
      • Product tabs
      • Related products
  • BLOG & BLOG POST PAGE
    • Blog page
    • Blog post page
  • CART
    • Cart
  • OTHER PAGES
    • How to create a page?
    • Search page
    • Password page
    • 404 page
  • TUTORIALS & TOPICS
    • How to enable size chart on product page
    • How to enable gift wrap option on cart page
    • How to enable free shipping notification
    • How to add a countdown timer on the product page
  • Knowledge base
    • Getting started in Shopify
    • Shopify help center
    • Shopify developers platform
  • Get Support
Powered by GitBook
On this page
  1. THEME SETTINGS

Product cards

Product cards allow you to customize the style of product cards in the theme.

  1. From your Shopify admin, go to Online Store -> Themes.

  2. Find the theme that you want to edit, and then click Customize.

  3. Click Theme Settings -> Product cards.

Setting
Description

Style

Select the style of the card layout:

  • Standard

  • Card

Image padding

Set the space between image and its border.

Text alignment

The alignment of the text within the product card:

  • Left (default) - Aligns the text to the left.

  • Center - Aligns the text in the center.

  • Right - Aligns the text to the right.

Title size

The size of the title text:

  • Small

  • Medium

  • Large

Title font weight

The font weight of the title text:

  • Regular

  • Medium

  • SemiBold

  • Bold

  • ExtraBold

  • Black

Price size

The size of the price text:

  • Extra small

  • Small

  • Medium

  • Large

Quick add button radius

Set the radius of the quick add button corners. Can be from 0px to 40px, increasing arithmetically of 1px (pixel).

Color scheme

Set the color for the product card.

Border

Setting
Description

Thickness

Set the width of an product card's four borders. Can be from 0px to 12px, increasing arithmetically of 1px (pixel).

Opacity

Sets the opacity level for an product card's four borders. Can be from 0% to 100%, increasing arithmetically of 5%.

Corner radius

Set the radius of the product card's corners. Can be from 0px to 40px, increasing arithmetically of 1px (pixel).

PreviousInputsNextCollection cards

Last updated 1 month ago