E-posbemarking en outomatisering

Donker modus vir e-pos word aangeneem ... Hier is hoe om dit te ondersteun

Donker modus verminder skermenergieverbruik en verhoog fokus. Sommige gebruikers sê ook dat hulle 'n verminderde oogstremming voel, maar dit is ondervra is.

Donkermodus-aanneming groei steeds. Donker modus is nou beskikbaar op macOS, iOS, Android en 'n magdom toepassings, insluitend Microsoft Outlook, Safari, Reddit, Twitter, YouTube, Gmail en Reddit. Daar is egter nie altyd volle ondersteuning oor elkeen nie. Dit is nie gereeld dat daar vooruitgang in e-postegnologie is nie, so dit is lekker om die aanvaarding van donkermodus-ondersteuning ook in e-pos te sien.

Ons het in Augustus 28 gesien dat 2021% van gebruikers in Donker modus kyk. Teen Augustus 2022 het daardie getal tot byna 34% toegeneem.

lakmoes

Om die beste praktyke, kode om te implementeer en kliëntondersteuning te verstaan, is van kritieke belang vir jou implementeringsukses van donkermodus. Om dié rede het die span by Uplers hierdie gids tot donkermodus gepubliseer e-pos ondersteuning.

Onlangs, DK New Media 'n Salesforce Marketing Cloud-sjabloon ontwikkel vir 'n kliënt wat Dark Mode ingesluit het, wat die e-posafdelings dramaties kontrasteer wanneer dit in 'n e-poskliënt bekyk word. Dit is 'n poging wat bykomende betrokkenheid en deurklikkoerse vir jou intekenare kan aandryf.

Donker modus e-poskode

Stap 1: Sluit metadata in om die donker modus by e-poskliënte in te skakel – Die eerste stap is om donker modus in die e-pos te aktiveer vir intekenare met donkermodus-instellings aangeskakel. Jy kan hierdie metadata insluit in die merk.

<meta name="color-scheme" content="light dark"> 
<meta name="supported-color-schemes" content="light dark">

Stap 2: Sluit donkermodusstyle in vir @media (verkies kleurskema: donker) - Skryf hierdie media-navraag in u ingebedde tags to customize the dark mode styles in Apple Mail, iOS, Outlook.com, Outlook 2019 (macOS) en Outlook App (iOS). As jy nie 'n omlynde logo in jou e-pos wil hê nie, kan jy dit gebruik .dark-img en .light-img klasse soos hieronder getoon.

@media (prefers-color-scheme: dark ) { 
.dark-mode-image { display:block !important; width: auto !important; overflow: visible !important; float: none !important; max-height:inherit !important; max-width:inherit !important; line-height: auto !important; margin-top:0px !important; visibility:inherit !important; } 
.light-mode-image { display:none; display:none !important; } 
}

Stap 3: Gebruik die voorvoegsel [data-ogsc] om donkermodusstyle te dupliseer - Sluit hierdie kodes in sodat die e-pos versoenbaar is met die donker modus in die Outlook-app vir Android.

[data-ogsc] .light-mode-image { display:none; display:none !important; } 
[data-ogsc] .dark-mode-image { display:block !important; width: auto !important; overflow: visible !important; float: none !important; max-height:inherit !important; max-width:inherit !important; line-height: auto !important; margin-top:0px !important; visibility:inherit !important; }

Stap 3: Sluit slegs donkermodusstyle by die hoof-HTML in - U HTML-etikette moet die regte donkermodusklasse hê.

<!-- Logo Section -->
<a href="http://email-uplers.com/" target="_blank" style="text-decoration: none;"><img src="https://campaigns.uplers.com/_email/_global/images/logo_icon-name-black.png" width="170" alt="Uplers" style="color: #333333; font-family:Arial, sans-serif; text-align:center; font-weight:bold; font-size:40px; line-height:45px; text-decoration: none;" border="0" class="light-mode-image"/>
<!-- This is the hidden Logo for dark mode with MSO conditional/Ghost Code --> <!--[if !mso]><! --><div class="dark-mode-image" style="display:none; overflow:hidden; float:left; width:0px; max-height:0px; max-width:0px; line-height:0px; visibility:hidden;" align="center"><img src="https://campaigns.uplers.com/_email/_global/images/logo_icon-name-white.png" width="170" alt="Uplers" style="color: #f1f1f1; font-family:Arial, sans-serif; text-align:center; font-weight:bold; font-size:40px; line-height:45px; text-decoration: none;" border="0" /> 
</div><!--<![endif]-->
</a> 
<!-- //Logo Section -->

E-pos wenke en addisionele bronne vir die donker modus

Ek het gewerk aan die Martech Zone daaglikse en weeklikse nuusbriewe om donker modus te ondersteun ... maak seker Teken hier in. Soos met die meeste e-poskodering, is dit nie eenvoudig nie as gevolg van die verskillende e-poskliënte en hul eie koderingsmetodologieë. Een probleem waarmee ek te kampe gehad het, was uitsonderings ... byvoorbeeld, jy wil wit teks op 'n knoppie hê, ongeag die donker modus. Die hoeveelheid kode is 'n bietjie belaglik ... Ek moes die volgende uitsonderings hê:

@media (prefers-color-scheme: dark ) { 
.dark-mode-button {
	color: #ffffff !important;
}
}
[data-ogsc] .dark-mode-button { color: #ffffff; color: #ffffff !important; } 

Enkele bykomende bronne:

  • lakmoes - die beste gids vir donker modus vir e-posbemarkers.
  • CampaignMonitor – die ontwikkelaarsgids vir donker modus vir e-pos.

As jy wil hê dat jou e-possjablone omgeskakel word vir donkermodus-ondersteuning, moet asseblief nie huiwer om uit te reik na DK New Media.

donker modus in e-posse
Bron: Uplers

Douglas Karr

Douglas Karr is CMO van Maak INSIGTE oop en die stigter van die Martech Zone. Douglas het tientalle suksesvolle MarTech-opstartondernemings gehelp, het gehelp met die omsigtigheidsondersoek van meer as $5 miljard in Martech-verkrygings en -beleggings, en gaan voort om maatskappye te help met die implementering en outomatisering van hul verkoops- en bemarkingstrategieë. Douglas is 'n internasionaal erkende digitale transformasie en MarTech deskundige en spreker. Douglas is ook 'n gepubliseerde skrywer van 'n Dummie-gids en 'n besigheidsleierskapboek.

verwante Artikels

Terug na bo knoppie
Sluiting

Advertensieblok bespeur

Martech Zone is in staat om hierdie inhoud gratis aan u te verskaf, want ons verdien ons webwerf deur advertensie-inkomste, geaffilieerde skakels en borgskappe. Ons sal dit waardeer as jy jou advertensieblokkering sal verwyder terwyl jy ons webwerf bekyk.