Skip to content
Marketing

Image Element in Email Builder

The Image Element in Email Builder allows you to easily add and customise images within your email templates. With support for multiple image sources…

2 min read536 words5 explained images
View as markdownOpen in ClaudeOpen in ChatGPT
Each image has a one line explanation. Switch to full detail for the step it belongs to, the fields and buttons involved, examples and the whole procedure.
On this page
  1. What is the Image Element in GHL Customer Care Email Builder?
  2. Key Benefits of the Image Element
  3. How To Setup the Image Element
  4. Frequently Asked Questions

The Image Element in Email Builder allows you to easily add and customise images within your email templates. With support for multiple image sources, sizing options, and alignment controls, this element helps you create visually engaging and professional-looking emails that capture attention and improve engagement.

TABLE OF CONTENTS

What is the Image Element in GHL Customer Care Email Builder?

The Image Element is a drag-and-drop block in Email Builder that lets you insert images directly into your email layout. You can upload new images, use URLs, or pull from your existing file library.

It supports customization options such as resizing, alignment, and linking, allowing you to use images for branding, product showcases, or visual storytelling. The element ensures that your images render correctly across all major email clients and devices.

Note: To optimise load times and maintain email deliverability, use compressed images (under 1MB) in formats like JPG or PNG.

Key Benefits of the Image Element

Adding the Image Element to your email design offers several key advantages:

  • Quickly insert high-quality images using simple drag-and-drop functionality.

  • Customise width, height, and alignment for balanced layouts.

  • Ensure consistent image display across both desktop and mobile devices.

  • Maintain a polished, branded look with logos, banners, and visuals.

How To Setup the Image Element

Follow these steps to add and configure the Image Element in your email template:

  1. Navigate to Marketing → Emails → Templates from your sub-account dashboard.

    Step 1 of 8: Navigate to Marketing → Emails → Templates from your sub-account… What this shows Step 1 of 8: Navigate to Marketing → Emails → Templates from your sub-account dashboard. What this shows Shows where to go for step 1 of 8 in the "How To Setup the Image Element" section of "Image Element in Email Builder". This screenshot accompanies step 1 of 8 in the "How To Setup the Image Element" section of "Image Element in Email Builder". At this point in the walkthrough you navigate to Marketing → Emails → Templates from your sub-account dashboard. The next step is to open an existing template or click the + New button to create one. Step 1 of 8Image 1 of 5 Where to goNavigate to Marketing → Emails → Templates from your sub-account dashboard.
    Buttons and menus referenced Marketing → Emails → Templates+ NewEmail BuilderAdd Elements (+)Image ElementElementsEditVisibilityDevice-Based VisibilityConditional Sendingdesktopmobile
    Next stepOpen an existing template or click the + New button to create one.
    All 8 steps in this procedure
    1. Navigate to Marketing → Emails → Templates from your sub-account dashboard. this image
    2. Open an existing template or click the + New button to create one.
    3. In the Email Builder, click the Add Elements (+) icon in the left sidebar.
    4. Locate the Image Element under the Elements section.
    5. Drag and drop the Image Element into your desired position within the email layout.
    6. Click on the Image Element to open the Edit tab on the left panel. Here you can:
    7. (Optional) Click the Visibility tab to manage Device-Based Visibility or Conditional Sending options.
    8. Preview your email on both desktop and mobile devices to confirm the image displays as expected.

  2. Open an existing template or click the + New button to create one.

    Step 2 of 8: Open an existing template or click the + New button to create one What this shows Step 2 of 8: Open an existing template or click the + New button to create one. What this shows Shows where to go for step 2 of 8 in the "How To Setup the Image Element" section of "Image Element in Email Builder". This screenshot accompanies step 2 of 8 in the "How To Setup the Image Element" section of "Image Element in Email Builder". At this point in the walkthrough you open an existing template or click the + New button to create one. The next step is to in the Email Builder, click the Add Elements (+) icon in the left sidebar. Step 2 of 8Image 2 of 5 Where to goOpen an existing template or click the + New button to create one.
    Buttons and menus referenced + NewMarketing → Emails → TemplatesEmail BuilderAdd Elements (+)Image ElementElementsEditVisibilityDevice-Based VisibilityConditional Sendingdesktopmobile
    Next stepIn the Email Builder, click the Add Elements (+) icon in the left sidebar.
    All 8 steps in this procedure
    1. Navigate to Marketing → Emails → Templates from your sub-account dashboard.
    2. Open an existing template or click the + New button to create one. this image
    3. In the Email Builder, click the Add Elements (+) icon in the left sidebar.
    4. Locate the Image Element under the Elements section.
    5. Drag and drop the Image Element into your desired position within the email layout.
    6. Click on the Image Element to open the Edit tab on the left panel. Here you can:
    7. (Optional) Click the Visibility tab to manage Device-Based Visibility or Conditional Sending options.
    8. Preview your email on both desktop and mobile devices to confirm the image displays as expected.

  3. In the Email Builder, click the Add Elements (+) icon in the left sidebar.

    Step 3 of 8: In the Email Builder, click the Add Elements (+) icon in the left… What this shows Step 3 of 8: In the Email Builder, click the Add Elements (+) icon in the left sidebar. What this shows Shows where to go for step 3 of 8 in the "How To Setup the Image Element" section of "Image Element in Email Builder". This screenshot accompanies step 3 of 8 in the "How To Setup the Image Element" section of "Image Element in Email Builder". At this point in the walkthrough you in the Email Builder, click the Add Elements (+) icon in the left sidebar. The next step is to locate the Image Element under the Elements section. Step 3 of 8Image 3 of 5 Where to goIn the Email Builder, click the Add Elements (+) icon in the left sidebar.
    Buttons and menus referenced Email BuilderAdd Elements (+)Marketing → Emails → Templates+ NewImage ElementElementsEditVisibilityDevice-Based VisibilityConditional Sendingdesktopmobile
    Next stepLocate the Image Element under the Elements section.
    All 8 steps in this procedure
    1. Navigate to Marketing → Emails → Templates from your sub-account dashboard.
    2. Open an existing template or click the + New button to create one.
    3. In the Email Builder, click the Add Elements (+) icon in the left sidebar. this image
    4. Locate the Image Element under the Elements section.
    5. Drag and drop the Image Element into your desired position within the email layout.
    6. Click on the Image Element to open the Edit tab on the left panel. Here you can:
    7. (Optional) Click the Visibility tab to manage Device-Based Visibility or Conditional Sending options.
    8. Preview your email on both desktop and mobile devices to confirm the image displays as expected.

  4. Locate the Image Element under the Elements section.

  5. Drag and drop the Image Element into your desired position within the email layout.

  6. Click on the Image Element to open the Edit tab on the left panel. Here you can:

    • Upload an Image: Choose an image from your computer.

    • Use an Image URL: Paste a direct link to an externally hosted image.

    • Adjust Width & Height: Define custom dimensions or use automatic scaling.

    • Add a Link: Make your image clickable by adding a destination URL.

    • Set Alignment: Align the image to the left, center, or right.

    • Add Padding: Control spacing around the image for better design balance.

      Step 6 of 6: Add Padding: Control spacing around the image for better design balance What this shows Step 6 of 6: Add Padding: Control spacing around the image for better design balance. What this shows Shows what this covers for step 6 of 6 in the "How To Setup the Image Element" section of "Image Element in Email Builder". This screenshot accompanies step 6 of 6 in the "How To Setup the Image Element" section of "Image Element in Email Builder". At this point in the walkthrough you add Padding: Control spacing around the image for better design balance. Step 6 of 6Image 4 of 5 What this coversAdd Padding: Control spacing around the image for better design balance.
      Buttons and menus referenced Marketing → Emails → Templates+ NewEmail BuilderAdd Elements (+)Image ElementElementsEditVisibilityDevice-Based VisibilityConditional Sendingdesktopmobile
      All 6 steps in this procedure
      1. Upload an Image: Choose an image from your computer.
      2. Use an Image URL: Paste a direct link to an externally hosted image.
      3. Adjust Width & Height: Define custom dimensions or use automatic scaling.
      4. Add a Link: Make your image clickable by adding a destination URL.
      5. Set Alignment: Align the image to the left, center, or right.
      6. Add Padding: Control spacing around the image for better design balance. this image

  7. (Optional) Click the Visibility tab to manage Device-Based Visibility or Conditional Sending options.

    Step 7 of 8: (Optional) Click the Visibility tab to manage Device-Based Visibility… What this shows Step 7 of 8: (Optional) Click the Visibility tab to manage Device-Based Visibility or Conditional Sending options. What this shows Shows what to click for step 7 of 8 in the "How To Setup the Image Element" section of "Image Element in Email Builder". This screenshot accompanies step 7 of 8 in the "How To Setup the Image Element" section of "Image Element in Email Builder". At this point in the walkthrough you (Optional) Click the Visibility tab to manage Device-Based Visibility or Conditional Sending options. The next step is to preview your email on both desktop and mobile devices to confirm the image displays as expected. Step 7 of 8Image 5 of 5 What to click(Optional) Click the Visibility tab to manage Device-Based Visibility or Conditional Sending options.
    Buttons and menus referenced VisibilityDevice-Based VisibilityConditional SendingMarketing → Emails → Templates+ NewEmail BuilderAdd Elements (+)Image ElementElementsEditdesktopmobile
    Next stepPreview your email on both desktop and mobile devices to confirm the image displays as expected.
    All 8 steps in this procedure
    1. Navigate to Marketing → Emails → Templates from your sub-account dashboard.
    2. Open an existing template or click the + New button to create one.
    3. In the Email Builder, click the Add Elements (+) icon in the left sidebar.
    4. Locate the Image Element under the Elements section.
    5. Drag and drop the Image Element into your desired position within the email layout.
    6. Click on the Image Element to open the Edit tab on the left panel. Here you can:
    7. (Optional) Click the Visibility tab to manage Device-Based Visibility or Conditional Sending options. this image
    8. Preview your email on both desktop and mobile devices to confirm the image displays as expected.

  8. Preview your email on both desktop and mobile devices to confirm the image displays as expected.

Frequently Asked Questions

Q: Which image file types are supported?

You can upload or link common formats such as JPG, PNG, and GIF.

Q: Can I make an image clickable?

Yes, add a hyperlink in the Redirection Link field to make the image interactive.

Q: Can I use an external image URL?

Yes, simply paste a valid image URL into the Image URL field. Make sure the image is publicly accessible.

Q: Do Spacers affect email deliverability or loading speed?

No, Spacers are lightweight and do not impact deliverability or loading times.

Q: How can I delete an image?

Simply click on the Image Element and use the delete/trash icon to remove it from your layout.

Frequently asked questions

What is the Image Element in GHL Customer Care Email Builder?
The Image Element is a drag-and-drop block in Email Builder that lets you insert images directly into your email layout. You can upload new images, use URLs, or pull from your existing file library. It supports customization options such as resizing, alignment, and linking, allowing you to use images for branding, product showcases, or visual storytelling. The element ensures that your images render correctly across all major email clients and devices. Note: To optimise load times and maintain email deliverability, use compressed images (under 1MB) in formats like JPG or PNG.

Was this guide helpful?

Related guides

@Mention or Tag Profile in Posts from Social Planner2 min read · 4 imagesAdd Location Tagging to Social Post1 min read · 9 imagesAdd Pinterest Pins in Social Planner4 min read · 8 imagesSocial Planner - How to Add Multiple Watermarks4 min read · 8 images