Image Cards Section

Use the Multicolumn Image Cards section to showcase featured collections or categories. Each card can display an image, title, and link, making it easy for customers to explore products.

Steps to Set Up and Configure Multicolumn Image Cards

Steps:

1. Access the Multicolumn Image Cards Section

   • In the Shopify admin, go to Online Store > Customize to open the theme editor.

   • In the left sidebar, locate Multicolumn image cards under Template.

   • If this section is not already added, click Add section and select Multicolumn image cards.

2. General Settings

   • Make section full width: Enable this option to stretch the section across the screen width.

   • Heading and Heading size: Add a main heading to the section and select a suitable size.

3. Image Configuration

   • Image ratio: Choose an image aspect ratio, such as Portrait, Square, or Circle, depending on your design preference.

   • Title position: Set the position for the title of each image.

4. Style and Color Options

   • Style: Select a display style for the image cards: Standard, Card, or Faded.

   • Title color scheme: Choose a color scheme that matches your brand’s look.

5. Layout Settings

   • Number of columns on desktop: Adjust the slider to set the number of columns displayed on desktop screens.

   • Mobile Layout: Select the number of columns for mobile view and enable swipe on mobile for a touch-friendly experience.

6. Button and Link Options

   • Button label and Button link: Add a call-to-action button with a label and link if desired. Enable the outline button style if you want the button to have a bordered style instead of a filled one.

7. Spacing Settings

   • Section padding: Adjust the top and bottom padding to control the spacing above and below the section.

Adding and Configuring Individual Columns

Steps:

1. Locate Multicolumn Image Cards Section

   • In your Shopify admin, go to Online Store > Customize to open the theme editor.

   • In the left sidebar, locate and select Multicolumn image cards under Template.

2. Editing Existing Columns

   • Each column comes preloaded with placeholder images and text. To customize, click on each existing Column to edit.

3. Add New Columns

   • If additional image cards are needed, click Add Column within the Multicolumn image cards section.

4. Customize Column Details

   • Image: Upload an image that best represents the category or product for this column.

   • Heading: Enter a title in the Heading field to give the card a clear label (e.g., "Sweatshirts").

   • Description: Provide additional information in the Description field to add context or appeal.

   • Link: Insert a URL in the Link field to direct customers to a relevant page, such as a collection or product page.

5. Save Changes

   • Once you’ve configured the columns to your preference, click Save in the top-right corner to apply the changes.