Image with Text Block

Overview

An Image with Text Block section allows you to display a background image while featuring a block of text.

This is an eye-catching way to highlight keywords related to your products, collections, and overall brand, with the option to link these to another page.

Image with Text Block was introduced with Envy v.25.0.0 - if this section is not available to you, you may need to update your theme version.

Example of an Image with Text Block section.

Steps

  1. Within your Shopify admin, go to Sales Channels > Online Store > Themes.

  2. Click your theme, and select Customize.

  3. On the left-hand menu, select Add section.

  4. Scroll down to select Image with Text Block.

  5. Click Select.

Add section > Image with Text Block.

Adding an Image

To add an image to display in the background of the section, click Select image.

Upload a new image, or select a pre-existing image from your Library or Shopify's Free Images.

Adding an image to the section.

Text Colors

To change the color scheme of your text block, simply select the Text and Background color boxes and use the color selector.

Changing your text colors.

Content Position

To alter the position of your text block, use the Content position drop-down menu to move it to the:

  • Left

  • Center

  • Right

Altering the content position over your image.

Text Contents

Heading and Subheading

While neither are required fields, you can choose to add a Heading and a Subheading to your text block by typing them into the entry fields under Settings.

A new Heading will also rename this section entirely.

The Heading and Subheading can only feature plain text, and therefore can't include any bold or italic text.

Adding a subheading & heading to your text block.

Text

Use the Text entry field to type in the body of your text block.

Enter your text.

Adding a Button

You can add a button which can take you to another page, which sits inside your text block - simply add a Button link and type in your Button label.

To link this button to another page, click the Link entry field and select a page from the menu - alternatively, you can paste a URL.

Your button will not be visible until you enter text into the Button label field.

Linking your text block button to another page.

Button Label

To make your button visible within your text block, use the Button label entry field to write something that will incentivize your customers to click.

Naming your button, and making it visible within your text block.