Dark Mode : Cara membuat Mode Malam (gelap) di blog – Hai sobat Blogger, sebagai seorang Blogger sudah pasti ingin memberikan dan menyajikan kenyamanan pada para pengunjung atau visitor. Baik melalui konten yang berkualitas maupun kenyamanan fitur yang mantab yang membuat pengunjung betah dalam berselancar di blog anda.
Salah satu fitur yang dapat memberikan kenyamanan dan memiliki pengaruh kuat terhadap user experience adalah Tombol Dark Mode (Mode Malam atau disebut juga Night Mode).
Dengan adanya Fitur Dark Mode ini, manfaat yang di rasakan visitor adalah mata yang tak lelah dan sakit dalam melihat layar, terutama ketika berada di ruangan gelap.
Sebenarnya Chrome sendiri sudah menyediakan Dark Mode pada fitur temanya, tapikan kita sebagai blogger apa salahnya juga menyediakan fitur ini, siapa tau visitor lupa atau tidak tahu kalau di Chrome ada Dark Mode, tinggal di aktifkan saja, sudah Night Mode semua. Kalau Sobat sendiri belum tahu, silakan sobat liat cara mengaktifkan Dark Mode pada Chrome
Kalau anda ingin memanjakan visitor sehingga dirinya merasa nyaman dalam berselancar di blog anda, tidak salah anda memasang fitur Dark Mode di blog anda.
Bay the way, sekarang ini YouTube pun sudah menambahkan fitur Dark Mode, semua karena memahami dan memberikan kenyamanan bagi netizen tatkala menonton video online disaat waktu tidur.
Cara Memasang Dark Mode atau Mode Malam (gelap) di blog
Pertama, Masuk Ke Blogspot > Dashbord
Kedua, Menuju TEMA dan klik EDIT HTML
Ketiga, Cari Kode ]]></b:skin> biar lebih cepat gunakan CTRL+F
Keempat, Letakkan Kode CSS berikut ini Tepat di atas Kode ]]></b:skin>
Kelima, Setelah Selesai, sekarang masukkan Kode HTML di bawah ini tepat di atas </header> (untuk masalah lokasi bisa di bawahnya atau di atasnya, terserah pengalokasian yang teman suka, karena sama saja)
Keenam, jika sudah, sekarang letakkanJavaScriptdi bawah ini di atas </body>
<script type='text/javascript'> //<![CDATA[ /* Dark Mode */ $(document).ready(function(){$("body").toggleClass(localStorage.toggled),$("#modedark").on("click",function(){"Night"!=localStorage.toggled?($("body").toggleClass("Night",!0),localStorage.toggled="Night",$(".section-center").css("display","block")):($("body").toggleClass("Night",!1),localStorage.toggled="",$(".section-center").css("display",""))}),$("body").hasClass("Night")?$("#modedark").prop("checked",!0):$("#modedark").prop("checked",!1)}); //]]> </script>
Script JavaScript di atas sudah diupdate, artinya apabila seorang visitor menyalakan Mode Malam, dan berpindah page lain dengan membuka Tab baru, maka otomatis Dark Mode tetap AKTIF tanpa harus mengaktifkannya terbelih dahulu
Jika Template anda belum Memasang JQuery, Silahkan Letakkan JQuery ini di atas </head>
Kalau anda ingin memberikan pengalaman yang seru bagi pengunjung, anda bisa memberikan Efek Bintang Pada Mode Malam atau Dark Mode, Sehingga Pengunjung atau Visitor yang membaca artikel anda sedang menikmati bacaannya dengan disertai kerlap kerlip bintang yang di bumbui hujan meteor.
Mungkin sekian dulu artikel dari Cara Membuat Dark Mode atau Mode Malam (gelap) di blog, semoga bermanfaat dan Terima kasih
Jika ada yang belum dimengerti, silahkan ditanyakan di kolom komentar
1 Comment