Image with text

Display a side-by-side image and text block in a single section.

Overview

Pair an image with a complementary block of text - a simple yet powerful section for your storefront.

This section is somewhat smaller in height than other available options so is ideal for placing in between these other larger pieces of content, bringing added dynamism and visual variety to your layout.

Choose to link to a product or collection. You can also link to a page, such as “about us” or a blog post if you prefer.

Images’ impact is amplified when accompanied by text and vice-versa, so this is a great tool to have in your arsenal.


How can I customise my image with text section?

  1. Admin
  2. Online store > Themes > Customise
  3. Sections
  4. Choose “Image with text”

You will then be presented with the following settings:


Color Scheme:

Choose a look for your section.

Minimal: Features a grayscale, clean design.
Light: Shows a very subtle, light grey.
Feature: Pulls in colors from your theme’s customised colors settings.
Dark: Displays a more subdued look, with blacks and charcoals.


Image

Here you can select your image to use - we recommend 600 x 600px.


Enable parallax effect

Parallax, also known as slip-scroll, gives the effect that your image is “underneath” your main website’s content, animated to look as though it is sliding along, whilst hiding under a top layer. As you scroll up and down the page, more of this image is ‘revealed’, depending on the direction you scroll in. This provides an extra sprinkling of dynamism and magic to your page, but is not necessarily to everyone’s taste, so we have provided the option to toggle it on and off.


Text overlapping image

Choose whether you'd like the text to overlap the image or sit next to it:

Text overlapping image enabled:

Text overlapping images disabled:


Layout

Alternate between left and right placements.

Image on right:

Image on left:


Image height:

Choose between small, medium or large


Heading:

Add heading text of your choice here


Text

Add text of your choice here

Tip

It is possible to add bold or italic styling and links to this text too if required.


Button label

This will appear as button text, once you have also added a link to the button (shown in the step below - “button link”).


Button link

Add a link by clicking in the entry field. Choose a link from the list which pops up, or add your own manually:

Here’s how your button label and button link will look, alongside the rest of the completed section components:


Remove section

To delete the entire section, scroll to the bottom of the settings and select “remove section”:



Use this section to create the perfect pairing of image and text. Think about how the two work together and you’ll have a strong team that will help you gain many happy customers.

Did this answer your question? Thanks for the feedback There was a problem submitting your feedback. Please try again later.