Adding and Configuring Two Image+Text for an Email Template

Overview

The Two Images + Text component in the Email Builder allows users to create visually rich email layouts by combining two images with corresponding text sections. This component is ideal for showcasing multiple pieces of content side-by-side with descriptive text.

Users can configure IDs, Titles, Section Version Type, image properties, and text content for each section individually. It also supports image uploads, formatting, and link configurations. Participants can validate how the component appears and functions in the final email content.

Step-by-Step Approach

1. Add the Two Images + Text Component

• On the Event Dashboard, go to the Content module.
• Click on Email Campaigns.
• Select an existing campaign or create a new one.
• Go to the Design tab and click the Edit Template button.
Locate the Two Images + Text component from the available elements.
• Drag and drop the component onto the email canvas into the desired section of the email layout.

2. Configure Component Properties

• Click on the Two Images + Text component to open its settings panel.
• Enter or edit the following:
  • ID: Assign a unique identifier.
  • Title: Provide a meaningful title.
  • Section Version Type: Select the appropriate version type from the dropdown.

3. Configure Text Sections

• For each header/headline/text field:
  • Enter or edit the ID.
  • Enter or edit the Title.
• Edit the text directly within the Email Builder.
• Apply formatting options such as:
  • Font size and style
  • Text alignment
  • Bold, italic, underline
  • Color adjustments

4. Configure Image Settings (For Each Image)

• For each image:
  • Enter or edit the Alt Text.
  • Enter or edit the URL (with or without HTTPS).
  • Select the Target (e.g., same tab or new tab) from the dropdown.
• Upload or drag and drop images from your local system.
• Alternatively, use Select Image to choose from the media library popup.

5. Apply Image Formatting

• Select each image within the component.
• Apply formatting options such as:
  • Alignment
  • Size adjustments
  • Spacing or padding
• Ensure both images are aligned properly with their respective text sections.

6. Reposition the Component

• Click and drag the Two Images + Text component.
• Move it to the desired location within the email layout.

7. Remove the Component

• Select the Two Images + Text component.
• Click on Delete/Remove.
• Confirm the action to remove it from the email template.

8. Validate Two Images + Text (Participant View)

• Open or preview the email as a participant.
• Verify that both images and text sections are visible.
• Ensure:
  • Images are displayed correctly alongside their respective text.
  • Alt text is applied correctly (where applicable).
  • Clicking each image redirects to the correct URL.
  • Target behaviour (same tab/new tab) works as expected.
  • Text formatting (font, alignment, styling) is displayed correctly.
  • Layout alignment between images and text is consistent across devices.