Habka Madow ee iimaylka ayaa helaya korsasho… Waa tan sida loo taageero
Habka mugdiga ah wuxuu yareeyaa isticmaalka tamarta shaashadda wuxuuna kordhiyaa diiradda. Isticmaalayaasha qaar ayaa sidoo kale sheegaya inay dareemayaan cadaadis isha oo yaraaday, laakiin taasi waa ayaa la weydiiyay.
Korsashada qaabka mugdiga ah ayaa sii socota inay koraan. Habka mugdiga ah ayaa hadda laga heli karaa guud ahaan macOS, iOS, Android, iyo martigeliyaha abka, oo ay ku jiraan Microsoft Outlook, Safari, Reddit, Twitter, YouTube, Gmail, iyo Reddit. Had iyo jeer ma jirto taageero buuxda mid kasta, in kastoo. Inta badan maaha in horumar laga sameeyo tignoolajiyada iimaylka, markaa way fiicantahay in la arko qaadashada taageerada qaabka mugdiga ah ee iimaylka sidoo kale.
Waxaan aragnay 28% isticmaalayaasha ku daawashada Qaab mugdi ah Agoosto 2021. Ogosto 2022, tiradaasi waxay korodhay ilaa 34%.
Litmus
Fahamka hababka ugu fiican, code si loo fuliyo, iyo taageerada macmiilka ayaa muhiim u ah guusha fulinta ee qaabka mugdiga ah. Sababtaas awgeed, kooxda Uplers waxay daabacday hagahan qaab mugdi ah taageero email.
Recently, DK New Media u sameeyay Salesforce Suuqgeynta Cloud template ee macmiilka oo ku daray Qaabka Madow, taasoo si wayn uga soo horjeeda qaybaha iimaylka marka lagu arko macmiilka iimaylka. Waa dadaal kicin kara ka-qaybgal dheeraad ah iyo qiimaha guji-ku-gudbinta macaamiishaada.
Koodhka Email ee Madoow
Tallaabada 1: Ku dar metadata si aad awood ugu yeelatid habka mugdiga ee macaamiisha emaylka - Talaabada ugu horeysa waa in la suurtageliyo habka mugdiga ah ee emailka loogu talagalay macaamiisha leh habka mugdiga ah. Waxaad ku dari kartaa xogtan badan tag
<meta name="color-scheme" content="light dark">
<meta name="supported-color-schemes" content="light dark">
Tallaabada 2: Ku dar qaababka qaabka mugdiga ah ee @media (doorbidaya-midabka-nidaamka: mugdi) - Ku qor su'aashaan warbaahineed adoo gundhig ah tags to customize the dark mode styles in Apple Mail, iOS, Outlook.
com, Muuqaalka 2019 (macOS), iyo Muuqaalka App (iOS). Haddii aadan rabin sumad qeexan iimaylkaga, waad isticmaali kartaa .dark-img
iyo .light-img
fasalada sida hoos ku cad.
@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; }
}
Tallaabada 3: Isticmaal horgalaha [data-ogsc] si aad u nuqul u sameyso qaababka qaabka mugdiga ah - Ku dar lambarradan emaylka si ay ula jaan qaadaan habka mugdiga ah ee barnaamijka Muuqaalka ee '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; }
Talaabada 3: Ku dar qaababka kaliya ee mugdiga u ah jirka HTML - Calaamadahaaga HTML waa inay lahaadaan fasallo hab mugdi sax ah leh.
<!-- 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 -->
Iimaylka Talo-bixinta Xaaladda Madaw iyo Ilaha Dheeraadka ah
Waxaan ka shaqeynayay Martech Zone Wargeysyada maalinlaha ah iyo kuwa toddobaadlaha ah si ay u taageeraan qaabka mugdiga ah… hubi inaad ku qor halkan. Sida inta badan iimaylka koodka, ma fududa sababtoo ah macaamiisha iimaylka ee kala duwan iyo hababka kood u gaarka ah ee ay leeyihiin. Mid ka mid ah arrin aan la kulmay waxay ahayd ka-reebis… tusaale ahaan, waxaad rabtaa qoraal cad oo badhan ah iyadoon loo eegin qaabka mugdiga ah. Qadarka koodku waa wax lagu qoslo… Waxa aan lahaa waxyaalaha ka reeban ee soo socda:
@media (prefers-color-scheme: dark ) {
.dark-mode-button {
color: #ffffff !important;
}
}
[data-ogsc] .dark-mode-button { color: #ffffff; color: #ffffff !important; }
Qaar ka mid ah ilaha dheeriga ah:
- Litmus - hagaha ugu dambeeya ee habka mugdiga loogu talagalay suuqgeeyayaasha emaylka.
- Maamulaha Ololaha - Hagaha horumariyaha ee qaabka mugdiga ah ee iimaylka.
Haddii aad rabto in moodeelkaaga iimaylka loogu beddelo taageerada qaabka mugdiga ah, ha ka labalabayn inaad la xidhiidho DK New Media.