# Logo Element in Email Builder

> The Logo Element allows you to easily insert your brand logo into email templates, helping you maintain consistent branding and visual identity across…

- Source: https://docs.ghlcustomercare.com/docs/marketing/email-builder-capabilities/logo-element-in-email-builder
- Section: Marketing / Email Builder Capabilities
- Reading time: 2 min
- Images: 5, each explained below

---
The Logo Element allows you to easily insert your brand logo into email templates, helping you maintain consistent branding and visual identity across all communications. You can upload, resize, and align your logo while ensuring it displays clearly on both desktop and mobile devices.

---

**TABLE OF CONTENTS**

-   [What is the Logo Element in Email Builder?](#what-is-the-logo-element-in-email-builder)
-   [Key Benefits of the Logo Element](#key-benefits-of-the-logo-element)
-   [How To Setup the Logo Element](#how-to-setup-the-logo-element)
-   [Frequently Asked Questions](#frequently-asked-questions)

---

## **What is the Logo Element in Email Builder?**

The Logo Element is a drag-and-drop block that lets you add your company or brand logo to an email layout. It helps create instant brand recognition and sets a professional tone for your message.

You can upload a logo image directly or use a hosted image link. The element includes customisation options such as resizing, alignment, and linking, allowing you to control how your logo appears within the design.

> **Note:** For best results, use a transparent PNG or high-quality JPG file.

---

## **Key Benefits of the Logo Element**

Adding the Logo Element to your email design offers several advantages:

-   Reinforces brand recognition and consistency.
    
-   Simplifies logo placement with easy drag-and-drop functionality.
    
-   Supports resizing, alignment, and linking for flexible layout options.
    
-   Ensures sharp, clear display across devices and screen sizes.
    
-   Allows linking the logo to a homepage or landing page for easy navigation.
    

---

## **How To Setup the Logo Element**

Follow these steps to add and configure the Logo 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…](https://s3.amazonaws.com/cdn.freshdesk.com/data/helpdesk/attachments/production/155057292426/original/nY0mLhEspoXmlh8ONd6mp1_qOkY6f_LksQ.png)

**Step 1 of 8: Navigate to Marketing → Emails → Templates from your sub-account…**

This screenshot accompanies step 1 of 8 in the "How To Setup the Logo Element" section of "Logo 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 email template or click the + New button to create one.
- Where to go: Navigate to Marketing → Emails → Templates from your sub-account dashboard.
- Controls: Marketing → Emails → Templates, + New, Email Builder, Add Elements (+), Logo Element, Elements, Edit, Visibility, Device-Based Visibility, Conditional Sending, desktop, mobile
- Next: Open an existing email template or click the + New button to create one.

Full procedure:

1. Navigate to Marketing → Emails → Templates from your sub-account dashboard.  <- this image
2. Open an existing email 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 Logo Element under the Elements section.
5. Drag and drop the Logo Element to the desired position, usually at the top of your layout.
6. Click on the Logo Element to open the Edit tab on the left panel. Here you can:
7. Click the Visibility tab to configure Device-Based Visibility or Conditional Sending settings if needed.
8. Preview your email on both desktop and mobile to ensure the logo displays perfectly.

    
2.  Open an existing email template or click the **\+ New** button to create one.
    
    
![Step 2 of 8: Open an existing email template or click the + New button to create one](https://s3.amazonaws.com/cdn.freshdesk.com/data/helpdesk/attachments/production/155057292443/original/le0YDia2NBkLckdHWNxoaTclVpmJ6r7PFg.jpeg)

**Step 2 of 8: Open an existing email template or click the + New button to create one**

This screenshot accompanies step 2 of 8 in the "How To Setup the Logo Element" section of "Logo Element in Email Builder". At this point in the walkthrough you open an existing email 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.
- Where to go: Open an existing email template or click the + New button to create one.
- Controls: + New, Marketing → Emails → Templates, Email Builder, Add Elements (+), Logo Element, Elements, Edit, Visibility, Device-Based Visibility, Conditional Sending, desktop, mobile
- Next: In the Email Builder, click the Add Elements (+) icon in the left sidebar.

Full procedure:

1. Navigate to Marketing → Emails → Templates from your sub-account dashboard.
2. Open an existing email 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 Logo Element under the Elements section.
5. Drag and drop the Logo Element to the desired position, usually at the top of your layout.
6. Click on the Logo Element to open the Edit tab on the left panel. Here you can:
7. Click the Visibility tab to configure Device-Based Visibility or Conditional Sending settings if needed.
8. Preview your email on both desktop and mobile to ensure the logo displays perfectly.

    
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…](https://s3.amazonaws.com/cdn.freshdesk.com/data/helpdesk/attachments/production/155057292646/original/lnAEEIGI4tn3rtF4xB6TEkTSlEpQWX3KdA.png)

**Step 3 of 8: In the Email Builder, click the Add Elements (+) icon in the left…**

This screenshot accompanies step 3 of 8 in the "How To Setup the Logo Element" section of "Logo 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 Logo Element under the Elements section.
- Where to go: In the Email Builder, click the Add Elements (+) icon in the left sidebar.
- Controls: Email Builder, Add Elements (+), Marketing → Emails → Templates, + New, Logo Element, Elements, Edit, Visibility, Device-Based Visibility, Conditional Sending, desktop, mobile
- Next: Locate the Logo Element under the Elements section.

Full procedure:

1. Navigate to Marketing → Emails → Templates from your sub-account dashboard.
2. Open an existing email 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 Logo Element under the Elements section.
5. Drag and drop the Logo Element to the desired position, usually at the top of your layout.
6. Click on the Logo Element to open the Edit tab on the left panel. Here you can:
7. Click the Visibility tab to configure Device-Based Visibility or Conditional Sending settings if needed.
8. Preview your email on both desktop and mobile to ensure the logo displays perfectly.

    
4.  Locate the **Logo Element** under the **Elements** section.
    
5.  Drag and drop the Logo Element to the desired position, usually at the top of your layout.
    
6.  Click on the **Logo Element** to open the **Edit** tab on the left panel. Here you can:
    
    -   **Upload a Logo:** Select an image from your device.
        
    -   **Use an Image URL:** Paste a direct link to a hosted logo image.
        
    -   **Adjust Size:** Set custom width and height for proper scaling.
        
    -   **Set Alignment:** Align the logo to the left, center, or right of the email layout.
        
    -   **Add a Link:** Link your logo to your website or any relevant page.
        
    -   **Control Padding:** Add spacing around the logo for a balanced layout.
        
        
![Step 6 of 6: Control Padding: Add spacing around the logo for a balanced layout](https://s3.amazonaws.com/cdn.freshdesk.com/data/helpdesk/attachments/production/155057292733/original/JrDkfi5fHuPTT0lGwAL3gmFeBKwQRHjL2w.png)

**Step 6 of 6: Control Padding: Add spacing around the logo for a balanced layout**

This screenshot accompanies step 6 of 6 in the "How To Setup the Logo Element" section of "Logo Element in Email Builder". At this point in the walkthrough you control Padding: Add spacing around the logo for a balanced layout.
- What this covers: Control Padding: Add spacing around the logo for a balanced layout.
- Controls: Marketing → Emails → Templates, + New, Email Builder, Add Elements (+), Logo Element, Elements, Edit, Visibility, Device-Based Visibility, Conditional Sending, desktop, mobile

Full procedure:

1. Upload a Logo: Select an image from your device.
2. Use an Image URL: Paste a direct link to a hosted logo image.
3. Adjust Size: Set custom width and height for proper scaling.
4. Set Alignment: Align the logo to the left, center, or right of the email layout.
5. Add a Link: Link your logo to your website or any relevant page.
6. Control Padding: Add spacing around the logo for a balanced layout.  <- this image

        
7.  Click the **Visibility** tab to configure **Device-Based Visibility** or **Conditional Sending** settings if needed.
    
    
![Step 7 of 8: Click the Visibility tab to configure Device-Based Visibility or…](https://s3.amazonaws.com/cdn.freshdesk.com/data/helpdesk/attachments/production/155057293818/original/IEWCCbhwhzO2_R3DwcIiwTcW4i-pJyIa-w.png)

**Step 7 of 8: Click the Visibility tab to configure Device-Based Visibility or…**

This screenshot accompanies step 7 of 8 in the "How To Setup the Logo Element" section of "Logo Element in Email Builder". At this point in the walkthrough you click the Visibility tab to configure Device-Based Visibility or Conditional Sending settings if needed. The next step is to preview your email on both desktop and mobile to ensure the logo displays perfectly.
- What to click: Click the Visibility tab to configure Device-Based Visibility or Conditional Sending settings if needed.
- Controls: Visibility, Device-Based Visibility, Conditional Sending, Marketing → Emails → Templates, + New, Email Builder, Add Elements (+), Logo Element, Elements, Edit, desktop, mobile
- Next: Preview your email on both desktop and mobile to ensure the logo displays perfectly.

Full procedure:

1. Navigate to Marketing → Emails → Templates from your sub-account dashboard.
2. Open an existing email 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 Logo Element under the Elements section.
5. Drag and drop the Logo Element to the desired position, usually at the top of your layout.
6. Click on the Logo Element to open the Edit tab on the left panel. Here you can:
7. Click the Visibility tab to configure Device-Based Visibility or Conditional Sending settings if needed.  <- this image
8. Preview your email on both desktop and mobile to ensure the logo displays perfectly.

    
8.  Preview your email on both **desktop** and **mobile** to ensure the logo displays perfectly.
    

---

## **Frequently Asked Questions**

**Q: What file types are supported for logos?**

You can use PNG, JPG, or GIF files. PNG is recommended for transparent backgrounds.

**Q: Can I link the logo to my website?**

Yes, you can add a hyperlink in the settings to make your logo clickable.

**Q: Will my logo automatically resize for mobile?**

Yes, the Logo Element is responsive and automatically adjusts to fit smaller screens.

---

Documentation for GHL Customer Care. Support: support@ghlcustomercare.com