Skip to main content

How Do I Add and Configure Image Right with Text - Image Left with Text on the Email Builder Within an Email Campaign?

Azavista Support
Updated

Adding and Configuring Image Right with Text -Image Left with Text for an Email Template

Overview

The Image Right with Text - Image Left with Text component in the Email Builder allows users to create dynamic and visually balanced email layouts by combining images and text in alternating positions. This layout enhances readability and engagement by structuring content in a visually appealing format.

Users can configure IDs, Titles, Section Version Type, text content, image settings, and button (Jumbotron) properties. Participants can validate how the component appears and functions in the final email content.

Step-by-Step Approach

1. Add the 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 Image Right with Text - Image Left with Text component from the available elements.
  • Drag and drop the component into the desired section of the email layout.

2. Configure Component Properties

  • Click on the 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 Jumbotron Button

  • Enter or edit:
    • Title for the button.
    • URL for redirection.
  • Select the Target (e.g., same tab or new tab) from the dropdown.

5. 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.

6. Apply Image Formatting

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

7. Reposition the Component

  • Click and drag the component.
  • Move it to the desired location within the email layout.

8. Remove the Component

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

9. Validate Image Right with Text - Image Left with Text (Participant View)

  • Open or preview the email as a participant.
  • Verify that images and text sections are visible in alternating layout.
  • Ensure:
    • Images are displayed correctly on the right and left as configured.
    • Text content is readable and properly formatted.
    • Alt text is applied correctly (where applicable).
    • Clicking images or buttons redirects to the correct URLs.
    • Target behavior (same tab/new tab) works as expected.
    • Layout alignment and responsiveness are consistent across devices.

Result

You can successfully add, configure, and validate the Image Right with Text - Image Left with Text component within an email campaign, ensuring a visually engaging and structured layout with alternating image and text sections.

Related to

Related articles