Display galleries of images in your campaign and add captions and clickthrough links.
Use an image section to add images to your campaign. You can add multiple images, each with captions and clickthrough URLs, and choose different layouts to change the placement of images and captions.
Follow this guide to learn how to set up image sections in your campaigns and about other places in your campaign where images may display.
To prevent blurry images, we recommend keeping your image width 750px or less. For more help with image formatting, visit Formatting your images for display on the web.
Multiple images display in a vertical stack, but you can choose different layouts to change the placement of images and captions.
Add an image section
To add an image section to a campaign:
- Create or open your campaign draft. For more help, visit Building email campaigns.
- Click + anywhere in the campaign between the header and footer.
- Click Image.
- In the right panel, click Add Images to upload up to four images from your device, or click Select from Library to select images from your library or Unsplash. It's not possible to license premium images in Email Campaigns, but you can use previously licensed Getty Images.
- After uploading at least one image, click Manage Images below the thumbnail to add, rearrange, or delete images.
- Click Unlinked beside an image name to add a clickthrough URL.
- Click the layout drop-down menu to change the image section layout.
- Click Spacing and Section Color to make style changes.
- Depending on your layout, add a caption to your images.
All changes save automatically. You can undo or redo changes as long as the draft is open.
Tip: To open the image editor, hover over the image you want to edit in the draft and click the pencil icon.
Add, rearrange, or delete images
After adding at least one image, click Manage Images. Here, you can:
- Add more images by clicking Add Image. You can add up to four images in all layouts.
- Rearrange images by clicking and holding the six dots to the right of the filename and dragging the image to a new position.
- Delete an image by clicking - to the left of the filename.
After making changes, click Back to return to the Images panel.
Add a clickthrough URL
Image clickthrough URLs turn the whole image into a link, so when a subscriber clicks the image, it opens the link.
To add a clickthrough URL:
- Click Unlinked beside the images name in the right panel. If an image already has a clickthrough URL, the URL displays beside the image name. If you don't see Unlinked or a URL beside your image name, you might be in the Manage images panel. Click Back to return to the Images panel.
- In the clickthrough URL field, you can add a web address directly, or click to open the link editor for more options.
- In the link editor, you can link to an external web address, a page on your site, an email address, or a phone number. To learn more about links in Squarespace, visit Adding links to your site.
- After setting up the URL in the link editor, click Save.
Add alt text
Adding alt text to images makes them more accessible to visitors. If you don't add alt text manually, no alt text displays. To add alt text to an image in an image section:
- Click the image section, then click the image file name in the right panel.
- Click into the field under Image Alt Text and add your image description.
- The alt text saves automatically.
You can also add alt text to blog sections and product sections with the same steps. For more about alt text in general, including best practices, visit Adding alt text to images.
Image section layouts
Click the layout drop-down menu to choose how images and captions appear. By default, when you add a new image section, its set to the Banner layout.
You can choose from these layouts:
- Banner - Full-bleed images with captions below.
- Grid - Images display in a grid of small thumbnails. It's not possible to add captions in this layout.
- Card - Images with captions displaying on an overlapping card. The captions display on alternating sides for each image, starting on the right.
- List (Left) - Images in a list on the left side with captions on the right.
- List (Right) - Images in a list on the right side with captions on the left.
- Side - Images in a list with captions displaying on alternating sides.
Each section can use one layout style. To add another image with a different layout, add a new section.
Style the image section
Use the size, spacing, and color options to style your image section. Your options may vary depending on your layout.
With the grid, side, and list layouts, you can edit image size directly.
Click Image Size, then click S, M, or L, or click ... to set the size manually.
For banner and card layouts, use the Side padding tweak under Spacing to change the image width. Keep in mind, images always display full-width on Windows Outlook.
Click Spacing to change the padding in your image section. Depending on your layout, your spacing options may vary:
- Side padding - Add white space on either side of the image. For banner and card layouts, use this tweak to change the image width.
- Padding between sections - Add white space at the top and bottom of the image section.
- Padding between rows - Add vertical white space between images in the section. This only appears if you add multiple images to a single section.
- Horizontal Alignment and Vertical Alignment- Align the images in the grid layout.
- Center padding - Add white space between the images and captions in the side and list layouts.
You can change the following section-specific colors:
- Section color - Change the color that appears behind images and captions. If set to transparent, the content background or email background appears instead.
- Text color - Change the color of captions. Font and text size follow global campaign styles.
- Card color - Change the background of the captions on the card layout.
To learn more, visit Styling email campaigns.
To add captions:
- If you're using the banner layout, enable Show Caption in the images panel.
- Click Write here... in the preview and add text.
- Highlight text to format it or add a link.
Keep in mind:
- The grid layout doesn't support captions.
- Captions in email campaigns don't become alt text.
- Text added to images is image-specific. If you delete an image, its caption is deleted too.
- Use the side panel to style the text color. The font matches your global fonts.
Add an image without a caption
To add an image without a caption:
- Add an image section.
- After adding your image, choose the Grid or Banner layout.
- On the banner layout, switch the Show Caption toggle off to hide the caption.
Can I add an image slideshow?
There isn't a built-in slideshow layout. To add a slideshow effect, create an animated .gif from a set of images, then upload it to the image section.
You can upload or reuse an image from your library to your campaign's header, or include your site logo if your site uses one. To learn more, visit Building email campaigns.
Blog and product images
Blog and product sections pull blog posts and products into your campaign from your site, including the post or product featured images.
It's not possible to change the post or product featured images in these sections, but you can hover over them and click the pencil icon to open the image editor. To add a different image entirely, change the featured images in your blog page or store page, or use an image section to directly choose the image and caption.