How to Add and Customize Image with Text Blocks

Getting Started

The Image with Text block is a convenient tool for displaying and linking a specific, large image. This tool is a very useful means of displaying and advertising specific products, events, collections, etc. We recommend utilizing this feature for events or products that require strong visual elements / displays.

Finding Image with Text Blocks

In order to find the customization screen for your store's webpage, and in order to adjust your Collection Lists, please follow these steps:

From your myShopify homepage, go to Online Store > Themes
Find and click Customize
You will see the customization menu on the left of your screen. Click Image with Text
If you do not see Image with Text, scroll to the bottom of the customization menu and select Add section
From here, find and select Image with Text to add the block to your page

Customizing Image with Text Blocks

Once you have found your Image with Text block, you will notice several areas for customization. These are:

Image
Image Position
Image Width
Heading
Text
Button Text
Button Link

Image

In order to add a new image to your block, click Select Image. From here you can upload or select the image your store wishes to display alongside your collection. Please note that the recommended image size is beneath this section. It will look something like this:

If your image doesn't fit these specifications, it will not properly fit.

The recommended image size is calculated as the optimal size across many possible screen sizes (PC monitors of differing sizes, Mac, mobile, tablet, etc.)

After you have chosen your image, you will notice another customization option become available: Add alt text.

Adding alt text is a good way for your to include addition descriptions that will appear just beneath your icon. You can add up to 255 characters to this alt text feature

Image Position

This section includes a drop-down menu with two options: Left and Right. This will adjust which side of the block, the image appears on. The text descriptions will appear opposite of the image.

Image Width

This section includes a scrolling cline allowing for the size of the Image to be adjusted. The cline adjusted from 20% to 70%. We recommend playing with these settings to adjust the image to best fir your webpage.

Heading

This section includes a text box allowing for the customization of a content heading. This heading will be positioned above both the Text and Button that describe and link to the collection being displayed in the block. For the Heading, we recommend something attention grabbing and catchy to capture the eye of customers.

Text

This section includes a text box allowing for the customization of a content description. This will be positioned between the Heading and Button and serves to describe the products being displayed in the block. We recommend using a short and succinct message here, if any at all.

Button Text

This section includes a text box allowing for the customization of the message that will appear on your block's content Button.

Button Link

This section includes a text box that allows for your store to connect a link to the above Button. You can utilize this text box to insert either a direct link through a URL or by selecting the text box and searching through collections. It will appear something like this: