Image with product

You can add a section that contains an image and a text block with an optional button to link customers to a new page.

To add this section, please follow the below steps:

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 Add section and choose "Image with product".

Section settings

Setting	Description
Image	The image for the section.
Image height	Determines the height of the image: Adapt to image - Keeps the image's original aspect ratio. Small Medium Large Extra Large
Color scheme	Set the color of the section.

Heading

Setting	Description
Heading	The heading for this section.
Heading size	The size of the heading text: Small Medium Large Extra large Huge
Heading font weight	The font weight of the heading text: Regular Medium SemiBold Bold ExtraBold Black

Product card

Setting	Description
Product	Select a product you want to display.
Image ratio	The image ratio for the product images: Adapt to image (default) - Uses the aspect ratio of the images. This prevents the images from being cropped. Square - Crops the images to use a 1:1 ratio. Portrait - Crops the images to use a 2:3 ratio.
Show second image on hover	When the customer hovers their cursor over the product image, displays the second product image if the product has one.
Show vendor	Displays the vendors of the products.
Enable quick add button	Displays the quick add button that opens a popup displaying all the essential product details.

Button

Setting	Description
Button label	The text that displays on the button. Leave the label blank to hide the button.
Button link	The URL that you want the button to link to.
Button style	Style of the button: Filled Text link Outlined

Animations

Setting	Description
Image behavior	Animation for the image when scroll: None Ambient movement Fixed background position Zoom in on scroll

Section spacing

Setting	Description
Top padding	Determines the height of the top inner space of the footer. Can be from 0px to 150px, increasing arithmetically of 2px (pixel).
Bottom padding	Determines the height of the bottom inner space of the footer. Can be from 0px to 150px, increasing arithmetically of 2px (pixel).