Header with mobile teaser
Example 3 - Header with mobile teaser
You can add graphic elements in the header that will only be displayed in the mobile view. These elements are called mobile teasers.
Stylised view
_4.8.11_1.0_de_mobile_optimierung/c_advanced_template_kopfbereich_4_stlisiert_de.png)
As a central scenario, it is advisable here to store a banner graphic for desktop display and, as a mobile teaser, an image that has been optimised for mobile display. In this scenario, it is important to hide the banner graphic on mobile devices, so that banner graphics and mobile teasers are not displayed in the desktop view.
In this example, a high-resolution image has been saved as a mobile teaser. The text contained in the image has been placed above the people depicted. This makes the text easy to read in the mobile view. At the same time, the text does not hide the people depicted.
Desktop display
_4.8.11_1.0_de_mobile_optimierung/c_kopfbereich_mit_bannerelement_rechts_desktopdarstellung_de.png)
Mobile display
_4.8.11_1.0_de_mobile_optimierung/c_kopfbereich_mit_bild_aus_mobilem_teaser_mobile_darstellung_de.png)
Mailing editor view
_4.8.11_1.0_de_mobile_optimierung/s_advanced_template_kopfbereich_beispiel_3_de.png)
Note Please note that using mobile teasers may lead to display problems with some mobile email clients. Mobile teasers also increase the size of your mailing.
Related topics
