Hiding Messages content on mobile or desktop devices

Optimizing for different device sizes

Email design is not only about the layout responsiveness, but also about having the appropriate content in the right context. An email that may yield excellent results on desktop screens may not work as well when the user needs to scroll on a mobile device to reach the call-to-action, and vice versa. The best way to solve this issue is to hide unnecessary design and/or content elements depending on where those items would look best.

Content block options

When editing your email, you will see a Hide on setting in the property panel. To use it, simply scroll down in the right panel until you see the Block options section.

When used, the item can be toggled on and off depending on which device should hide that piece of content.

You can check the result of turning this property on for a specific content block by going into the Preview. You will see that, as you toggle between Desktop and Mobile, the content blocks for which Hide on mobile and/or Desktop have been turned on will not be shown.

This option is great for images that might not look good cropped or bump important content too far down within the mobile view.

Here is an example of a before and after adjustment to the mobile view of an email: