Skip to content
Marketing

Visibility Section for Layouts in Email Builder

You can now control the visibility of entire layouts in email templates! This powerful new setting lets you hide or show full sections based on device…

3 min read618 words4 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. Key Benefits of Layout Visibility Controls
  2. How To Use Layout-Level Visibility in Email Templates
  3. Best Practices for Responsive Layouts
  4. Apply Conditional Visibility to Layouts
  5. Frequently Asked Questions
  6. Next Steps

You can now control the visibility of entire layouts in email templates! This powerful new setting lets you hide or show full sections based on device type—making responsive email design faster and more flexible than ever.

TABLE OF CONTENTS

What Is Layout-Level Visibility in Email Templates?

Previously, users could only control visibility at the element level, which made hiding large sections for mobile or desktop tedious. With this update, you can now apply visibility settings directly to layout blocks, allowing you to show or hide entire sections depending on the device.

What Is Layout-Level Visibility in Email Templates? (image 1 of 4) What this shows Previously, users could only control visibility at the element level, which made hiding large sections for mobile or desktop tedious. What this shows Illustrates the "What Is Layout-Level Visibility in Email Templates?" section of "Visibility Section for Layouts in Email Builder". This screenshot appears in the "What Is Layout-Level Visibility in Email Templates?" section of "Visibility Section for Layouts in Email Builder". The text alongside this image reads: Previously, users could only control visibility at the element level, which made hiding large sections for mobile or desktop tedious. With this update, you can now apply visibility settings directly to layout blocks, allowing you to show or hide entire sections depending on the device. Immediately after, the guide continues: These controls help you build more responsive and device-optimized emails with less effort. Image 1 of 4 What this coversPreviously, users could only control visibility at the element level, which made hiding large sections for mobile or desktop tedious. With this update, you can now apply visibility settings directly to layout blocks, allowing you to show or hide entire sections depending on the device. Next stepThese controls help you build more responsive and device-optimized emails with less effort.

Key Benefits of Layout Visibility Controls

These controls help you build more responsive and device-optimized emails with less effort.

  • Save Time – Hide entire sections in one click instead of adjusting elements individually

  • Consistency – Unified editing flow between elements and layouts

  • Device Optimization – Customize mobile vs desktop versions of your email layout

  • Better Previews – Use mobile/desktop views to test visibility logic

  • Improved Testing – Send test emails with the correct visibility settings reflected

How To Use Layout-Level Visibility in Email Templates

  1. Create or open an email template in the drag-and-drop builder.

  2. Add a layout block to your email design.

  3. Hover over the layout — you’ll see desktop and mobile icons appear on the block.

    • Click either icon to toggle visibility for that device.

    • A grayed-out icon indicates that the layout is hidden on that view.

  4. Alternatively, click on the layout block and use the Visibility tab in the left-hand panel.

  5. Switch between Desktop and Mobile view using the preview icons in the builder toolbar.

  6. Send a test email to confirm how visibility behaves in a real inbox.

How To Use Layout-Level Visibility in Email Templates (image 2 of 4) What this shows Create or open an email template in the drag-and-drop builder. What this shows Illustrates the "How To Use Layout-Level Visibility in Email Templates" section of "Visibility Section for Layouts in Email Builder". This screenshot appears in the "How To Use Layout-Level Visibility in Email Templates" section of "Visibility Section for Layouts in Email Builder". The text alongside this image reads: Create or open an email template in the drag-and-drop builder. Add a layout block to your email design. Hover over the layout — you’ll see desktop and mobile icons appear on the block. Alternatively, click on the layout block and use the Visibility tab in the left-hand panel. Switch between…. Immediately after, the guide continues: To create polished, device-specific email experiences. Image 2 of 4 How to confirmCreate or open an email template in the drag-and-drop builder. Add a layout block to your email design. Hover over the layout — you’ll see desktop and mobile icons appear on the block. Alternatively, click on the layout block and use the Visibility tab in the left-hand panel. Switch between Desktop and Mobile view using the preview icons in the builder toolbar. Send a test email to confirm how visibility behaves in a real inbox. Next stepTo create polished, device-specific email experiences:
All 6 steps in this procedure
  1. Create or open an email template in the drag-and-drop builder.
  2. Add a layout block to your email design.
  3. Hover over the layout — you’ll see desktop and mobile icons appear on the block.
  4. Alternatively, click on the layout block and use the Visibility tab in the left-hand panel.
  5. Switch between Desktop and Mobile view using the preview icons in the builder toolbar.
  6. Send a test email to confirm how visibility behaves in a real inbox.

Best Practices for Responsive Layouts

To create polished, device-specific email experiences:

  • Use desktop-only layouts for wide or multi-column designs.

  • Use mobile-only layouts for single-column content or CTA buttons.

  • Don’t forget to preview and test send to confirm what’s shown or hidden.

  • Pair layout visibility with element-level visibility for extra precision.

Apply Conditional Visibility to Layouts

Layouts can now use conditional visibility rules, so you can show or hide an entire layout based on contact data instead of configuring each element one by one.

To set conditional visibility on a layout:

1. Select the layout or section in the Email Builder.

2. Open the Visibility tab.

3. Turn on conditional visibility.

4. Select the custom field you want to evaluate.

5. Choose a condition:

  • Is
  • Is Not
  • Is Empty
  • Is Present

6. Enter a value if the selected condition requires one.

7. Save your changes.

This helps entire sections hide gracefully and reduces repetitive rule setup across multiple elements.

Apply Conditional Visibility to Layouts (image 3 of 4) What this shows This helps entire sections hide gracefully and reduces repetitive rule setup across multiple elements. What this shows Illustrates the "Apply Conditional Visibility to Layouts" section of "Visibility Section for Layouts in Email Builder". This screenshot appears in the "Apply Conditional Visibility to Layouts" section of "Visibility Section for Layouts in Email Builder". The text alongside this image reads: This helps entire sections hide gracefully and reduces repetitive rule setup across multiple elements. This part of the guide covers 4 fields, listed below. Immediately after, the guide continues: Q: What happens if I hide a layout for both desktop and mobile? The layout will be hidden from all views and will not be sent. Ensure at least one view is active. Image 3 of 4 What this coversThis helps entire sections hide gracefully and reduces repetitive rule setup across multiple elements.
Fields in this part of the guide IsIs NotIs EmptyIs Present
Buttons and menus referenced Visibility
Next stepQ: What happens if I hide a layout for both desktop and mobile? The layout will be hidden from all views and will not be sent. Ensure at least one view is active.
All 4 steps in this procedure
  1. Is
  2. Is Not
  3. Is Empty
  4. Is Present
Apply Conditional Visibility to Layouts (image 4 of 4) What this shows This helps entire sections hide gracefully and reduces repetitive rule setup across multiple elements. What this shows Illustrates the "Apply Conditional Visibility to Layouts" section of "Visibility Section for Layouts in Email Builder". This screenshot appears in the "Apply Conditional Visibility to Layouts" section of "Visibility Section for Layouts in Email Builder". The text alongside this image reads: This helps entire sections hide gracefully and reduces repetitive rule setup across multiple elements. This part of the guide covers 4 fields, listed below. Immediately after, the guide continues: Q: What happens if I hide a layout for both desktop and mobile? The layout will be hidden from all views and will not be sent. Ensure at least one view is active. Image 4 of 4 What this coversThis helps entire sections hide gracefully and reduces repetitive rule setup across multiple elements.
Fields in this part of the guide IsIs NotIs EmptyIs Present
Buttons and menus referenced Visibility
Next stepQ: What happens if I hide a layout for both desktop and mobile? The layout will be hidden from all views and will not be sent. Ensure at least one view is active.
All 4 steps in this procedure
  1. Is
  2. Is Not
  3. Is Empty
  4. Is Present

Frequently Asked Questions

Q: What happens if I hide a layout for both desktop and mobile?
 The layout will be hidden from all views and will not be sent. Ensure at least one view is active.

Q: Can I adjust element visibility separately inside a layout?
 Yes, but if the layout itself is hidden, the visibility of inner elements won’t matter—they will not render.

Q: Are visibility settings reflected in test emails?
 Yes. Both desktop and mobile visibility settings are preserved when sending test or live emails.

Q: How is this different from hiding individual elements?
 Layout-level visibility saves time by letting you hide entire sections, rather than toggling each component individually.


Next Steps

  • Open an email template and try out layout visibility settings

  • Use the desktop/mobile preview toggle to test layout behavior

  • Send a test email to validate how your layout appears across devices

  • Save time by using layout-level controls instead of adjusting individual elements

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