With more and more people opening emails on their mobile devices, ensuring your emails look good on any screen is crucial. Whether your recipients are checking their emails on a smartphone, tablet, or computer, you can optimize their experience by showing or hiding content based on the device they are using. Thanks to our content visibility settings, create only one email design that will adapt to every device type by showing content only for the device type you selected.
Before you start
- Ensure you understand the difference between section and content blocks.
- Learn how to effectively design your email for mobile devices and the dark mode setting. To learn more, check our dedicated articles Design mobile-responsive emails and Design dark mode-friendly emails.
❓Why show content only on desktop or mobile?
You may wonder why you should show some content only on specific devices. Choosing to show some content only for specific devices can help you transfer what you find most useful and important to desktop or mobile devices only and hide non-essential content.
There are multiple cases in which showing content only for desktop or mobile devices (smartphone or tablet) could be useful:
-
🖥️ Show only on desktop
If you are showcasing a new line of products with extensive specifications, a tutorial, eBook, or whitepaper with rich media and text, you might need to show this content only on desktop devices. Indeed, this type of content may include detailed explanations, videos, or large text blocks that are more easily navigable on desktops. Desktops provide a more comfortable reading experience and the ability to interact with embedded media without screen size constraints. -
📱 Show only on mobile
If you added an in-store promotion to your email design with a QR or bar code, you can display this content only on mobiles to prompt your recipients to visit your physical store as they can easily scan they promotion. This will encourage instant engagement and action.
The same applies if you provide a link to download your mobile app or add special app features in your email design. Recipients on mobiles can directly download or engage with the app from their mobile device, making the process seamless and boosting app interaction.
|
You can go further by choosing to show a section only on desktop and creating the same section but optimized for mobile, and show it only on mobiles! See our example on the right ➡️ |
Show or hide content based on device type
When designing your email from our email editor, you can define display conditions and choose to show content only on specific devices, desktop or mobile (smartphone or tablet). For example, if you choose to show a section only on desktop, this section will be hidden to all recipients opening your email on mobile, and vice versa.
To define display conditions:
- Select the section or content block you want to show only on mobile or desktop.
- In the Content visibility section from the left panel, activate the Show on selected devices option.
- From there, you can either:
- Select Only on desktop to show this content only on desktops and hide it on mobile devices.
- Select Only on mobile to show this content only on smartphones and tablets and hide it on desktop.
- Select Only on desktop to show this content only on desktops and hide it on mobile devices.
Congratulations! 🎉 You have applied display conditions. Your content will only display on the devices you selected. We highly recommend testing your email on different devices before sending it to your recipients.
|
Click the 🖥️ Desktop or📱 Mobile icon at the top of the email editor to switch from one preview to another. Click the content or section for which you applied the display condition to edit or deactivate it. |
⏭️ What's next?
🤔 Have a question?
If you have a question, feel free to contact our support team by creating a ticket from your account. If you don't have an account yet, you can contact us here.
If you’re looking for help with a project using Brevo, we can match you with the right certified Brevo expert partner.