ఇమెయిల్ కోసం డార్క్ మోడ్ అడాప్షన్ పొందుతోంది... దీన్ని ఎలా సపోర్ట్ చేయాలో ఇక్కడ ఉంది
డార్క్ మోడ్ స్క్రీన్ శక్తి వినియోగాన్ని తగ్గిస్తుంది మరియు దృష్టిని పెంచుతుంది. కొంతమంది వినియోగదారులు కంటి ఒత్తిడి తగ్గినట్లు కూడా పేర్కొన్నారు, కానీ అది ప్రశ్నించబడింది.
డార్క్ మోడ్ స్వీకరణ పెరుగుతూనే ఉంది. డార్క్ మోడ్ ఇప్పుడు macOS, iOS, Android మరియు Microsoft Outlook, Safari, Reddit, Twitter, YouTube, Gmail మరియు Reddit వంటి అనేక యాప్లలో అందుబాటులో ఉంది. అయితే, ప్రతి ఒక్కరికి ఎల్లప్పుడూ పూర్తి మద్దతు ఉండదు. ఇమెయిల్ సాంకేతికతలో పురోగతులు ఉండటం తరచుగా జరగదు, కాబట్టి ఇమెయిల్లో డార్క్ మోడ్ సపోర్ట్ని స్వీకరించడం చాలా ఆనందంగా ఉంది.
ఆగస్టు 28లో 2021% మంది వినియోగదారులు డార్క్ మోడ్లో వీక్షించడాన్ని మేము చూశాము. ఆగస్టు 2022 నాటికి, ఆ సంఖ్య దాదాపు 34%కి పెరిగింది.
లిట్ముస్
డార్క్ మోడ్ యొక్క మీ అమలు విజయానికి ఉత్తమ అభ్యాసాలు, అమలు చేయడానికి కోడ్ మరియు క్లయింట్ మద్దతు చాలా కీలకం. ఆ కారణంగా, అప్లర్స్లోని బృందం ఈ గైడ్ని డార్క్-మోడ్కు ప్రచురించింది ఇమెయిల్ మద్దతు.
ఇటీవల, DK New Media క్లయింట్ కోసం సేల్స్ఫోర్స్ మార్కెటింగ్ క్లౌడ్ టెంప్లేట్ను అభివృద్ధి చేసింది, అది డార్క్ మోడ్ను పొందుపరిచింది, ఇమెయిల్ క్లయింట్లో వీక్షించినప్పుడు ఇమెయిల్ విభాగాలను నాటకీయంగా విరుద్ధంగా చేస్తుంది. ఇది మీ సబ్స్క్రైబర్ల కోసం అదనపు ఎంగేజ్మెంట్ మరియు క్లిక్-త్రూ రేట్లను పెంచే ప్రయత్నం.
డార్క్ మోడ్ ఇమెయిల్ కోడ్
దశ 1: ఇమెయిల్ క్లయింట్లలో డార్క్ మోడ్ను ప్రారంభించడానికి మెటాడేటాను చేర్చండి – డార్క్ మోడ్ సెట్టింగ్లు ఆన్ చేయబడిన చందాదారుల కోసం ఇమెయిల్లో డార్క్ మోడ్ను ప్రారంభించడం మొదటి దశ. మీరు ఈ మెటాడేటాను దీనిలో చేర్చవచ్చు ట్యాగ్.
<meta name="color-scheme" content="light dark">
<meta name="supported-color-schemes" content="light dark">
దశ 2: @ మీడియా కోసం డార్క్ మోడ్ శైలులను చేర్చండి (ప్రాధాన్యత-రంగు-పథకం: చీకటి) - మీ పొందుపరిచిన ఈ మీడియా ప్రశ్నను రాయండి tags to customize the dark mode styles in Apple Mail, iOS, Outlook.
com, Outlook 2019 (macOS), మరియు Outlook App (iOS). మీరు మీ ఇమెయిల్లో వివరించిన లోగోను కోరుకోకపోతే, మీరు ఉపయోగించవచ్చు .dark-img
మరియు .light-img
క్రింద చూపిన విధంగా తరగతులు.
@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; }
}
దశ 3: డార్క్ మోడ్ శైలులను నకిలీ చేయడానికి [డేటా- ogsc] ఉపసర్గ ఉపయోగించండి - Android కోసం lo ట్లుక్ అనువర్తనంలో ఇమెయిల్ డార్క్ మోడ్కు అనుకూలంగా ఉండటానికి ఈ కోడ్లను చేర్చండి.
[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; }
దశ 3: శరీర HTML కు డార్క్ మోడ్-మాత్రమే శైలులను చేర్చండి - మీ HTML ట్యాగ్లలో సరైన డార్క్ మోడ్ క్లాసులు ఉండాలి.
<!-- 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 -->
ఇమెయిల్ డార్క్ మోడ్ చిట్కాలు మరియు అదనపు వనరులు
నేను పని చేస్తున్నాను Martech Zone డార్క్ మోడ్కు మద్దతు ఇవ్వడానికి రోజువారీ మరియు వారపు వార్తాలేఖలు... తప్పకుండా ఇక్కడ సభ్యత్వాన్ని పొందండి. చాలా ఇమెయిల్ కోడింగ్ మాదిరిగానే, విభిన్న ఇమెయిల్ క్లయింట్లు మరియు వారి యాజమాన్య కోడింగ్ పద్దతుల కారణంగా ఇది సులభం కాదు. నేను ఎదుర్కొన్న ఒక సమస్య మినహాయింపులు... ఉదాహరణకు, డార్క్ మోడ్తో సంబంధం లేకుండా బటన్పై మీకు తెలుపు వచనం కావాలి. కోడ్ మొత్తం కొంత హాస్యాస్పదంగా ఉంది... నేను ఈ క్రింది మినహాయింపులను కలిగి ఉండాలి:
@media (prefers-color-scheme: dark ) {
.dark-mode-button {
color: #ffffff !important;
}
}
[data-ogsc] .dark-mode-button { color: #ffffff; color: #ffffff !important; }
కొన్ని అదనపు వనరులు:
- లిట్ముస్ - ఇమెయిల్ విక్రయదారులకు డార్క్ మోడ్ కోసం అంతిమ గైడ్.
- ప్రచార పర్యవేక్షకుడు – ఇమెయిల్ కోసం డార్క్ మోడ్కు డెవలపర్ గైడ్.
డార్క్ మోడ్ సపోర్ట్ కోసం మీ ఇమెయిల్ టెంప్లేట్లు మార్చబడాలని మీరు కోరుకుంటే, సంప్రదించడానికి వెనుకాడకండి DK New Media.