Text columns with images
The Text columns with images section lets you a multiple columns of text to your home page or collection pages. Each column has its own image and heading. You can use it to tell a story, explain how your company works, or list out the things that make your store unique.
On mobile devices, the columns stretch out into full-width sections::
The Text columns with images section can be used on the following page templates:
Home page template
Collection pages template
Product pages template
Add Text columns with images to the home page
To set up this section:
Add Text columns with images to other pages
You can add a Text columns with images section to your Collections and Products templates.
To enable a Text columns with images section on these pages:
Settings reference
The Image with features section has the following settings:
Columns per row
Choose to display 2, 3, or 4 features per row.
Image shape
Choose to display the image as Round or Square.
Text alignment
Choose to display the headings and subheadings of each feature to the Left or Right of each image.
Use alternate selection color
Set the background color to the Alternate Section Color as chosen in your Color Settings.
See Spark's Color settings documentation to learn how to set Alternate section colors.
Add columns
You can add many columns to the Text columns with images section. Here's how.
Settings reference
Each column has the following settings:
Image
Choose or upload an image.
If you would like to add an icon, there are plenty of sites that offer high-quality icons in many styles, like The Noun Project and Iconfinder.
Heading
Change the heading displayed above the column.
We recommend keeping this to just a few words long.
Subheading
Add subheading text.
We recommend a single, short paragraph. We also recommend making sure the paragraph is about the same length as the paragraphs in your other text columns.
Button link
Add a link to another page or website.
Button label
Add the anchor text for the link. The link cannot be displayed without it.
Note that if you want to link to a external page, like an Instagram profile page, you need to type (or copy and paste) the full URL starting with https://
. For example: https://example.com/abc123
.
Home page
Collection pages
Product pages