Articles on: Engage

How to integrate UGC in Mailchimp Email Campaigns

This article walks you through the process of embedding Email Campaign Display Images using two of Mailchimp’s template builders:
The Classic Builder
The New Builder

View instructions for integrating UGC in other email marketing platforms.


Embedding Email Campaign Display Images in Mailchimp Classic Builder



Step 1: Place a Mailchimp Component Block in your Email template.

Email Campaign Display Images can be embedded via the ‘Text’, ‘Boxed Text’, or ‘Code’ content blocks in Mailchimp’s Classic Builder:

Mailchimp classic builder blocks

Select one on these content blocks from the list and drag it to the position where you would like to insert your Display Image in your Email template.

Step 2: Select the content block you just placed


Mailchimp Classic Builder - text block

Click on the ‘Edit’ button of the content block you just placed in your Email template on the left-hand side. The Text block is shown above as an example, and the same process applies to the Boxed Text and Code blocks.


Step 3: Paste the embed code of your Display Image


Mailchimp classic builder - text block editor

On the right-hand side of the editor, click on the ‘Source’ toolbar button. Note that this step is not needed for the Code block, which shows the source view by default.
In the source view, paste the ‘HTML’ embed code of your Display Image – see How to get the embed code for an Email Campaign Display Image.
Click the ‘Save & Close’ button at the bottom to save changes to the component.
Your Display Image will then render in the Email template preview – the example below shows a Display Image with three Tiles in a grid layout.

Example of UGC embedded in an email




Embedding Email Campaign Display Images in Mailchimp New Builder



Step 1: Place a Mailchimp Code Block in your Email template.

Email Campaign Display Images can be embedded via the ‘Code’ blocks in Mailchimp’s New Builder.

Mailchimp New Builder Blocks

Select the ‘Code’ block from the list and drag it to the position where you would like to insert your Display Image in your Email template.

Step 2: Select the code block you just placed


Mailchimp New Builder - Code Block

Click on the code block you just placed in your Email template on the right-hand side.

Step 3: Paste the embed code of your Display Image


Mailchimp New Builder - code block editor

In the Code view on the left-hand side of the editor, paste the HTML embed code of your Display Image – see How to get the embed code for an Email Campaign Display Image.
Click the ‘Save & Close’ button at the bottom to save changes to the component.
Your Display Image will then render in the Email template preview – the example below shows a Display Image with three Tiles in a grid layout.

Example of UGC embedded in an email

Updated on: 05/04/2023

Was this article helpful?

Share your feedback

Cancel

Thank you!