Story sections: Image with text

Image with text is a homepage section that allows you to display an image in one column and text content in the second column. 

On mobile, the content is nicely stacked together:

On desktop, the image position can be placed on the left or right side. On mobile, the image is always presented first with the text content placed below with the slight overlap treatment. 

Here's an overview of the settings in the theme editor for Image with text:

(1) Image to be used

(2) Image alignment - Left or Right

(3) Heading

(4) Text description

(5) To create a button add both, a Button label and also choose a destination for the Button link. 

(6) Background color allows you to choose a white background for the section or the secondary color option in your theme color settings:

Example with secondary background color choice:

(7) The overlap setting allows you to adjust where the shadow resides, on the image or text content. For best results, choose the taller content type.

Example of overlap set to Text above:

You'll notice the slight shadow effect on the text content area. There is no shadow in the middle, the text area is overlapping the image.

When Image above is used, the shadow effect is placed on the image and the text area will be flat. The image is overlapping the text area:

When using multiple Image with text sections together, you can choose the flow where the image is placed. Example of alternating image position on desktop:

When viewing on mobile, the image is always placed first in the stacked format: