Cara Membuat Tombol Mode Gelap di Blogger Agar Pengunjung tetap Nyaman

Hallo Sobat Blogger! Ada beberapa Pengunjung yang menyukai Tampilan Gelap disuatu Blog dan ada juga yang menyukai Tampilan Cerah. Fungsi dari tombol Mode Gelap di Blogger ini memudahkan pengunjung untuk mengganti tampilan menjadi seperti Malam Hari. Karena ketika ada yang berkunjung di malam hari, sedangkan cahaya terbesar dari smartphone milik pengunjung dan ditambah lagi dengan tampilan Blog berwarna terang seperti Putih. Sehingga pengunjung akan merasa tidak nyaman meskipun tidak semua pengunjung begitu.

Untuk Mengatasi selera berbeda-beda dari pengunjung, maka sobat bisa membuat tombol Mode Gelap di Blogger agar pengunjung tetap nyaman ketika membaca postingan dari Blog sobat. Fitur ini bisa disebut juga dengan Fitur Night Mode atau Dark Mode. Ketika pengunjung ingin membaca dengan tampilan Gelap, maka pengunjung bisa mengaktifkan Mode Gelap untuk merubah tampilan menjadi gelap dalam sekejap mata.

Cara Membuat Fitur Mode Gelap di Blog

Fitur Mode Gelap atau Dark Mode ini akan belum menggunakan Cookie agar fitur ini akan tidak aktif ketika pengunjung merefresh dan membaca halaman lain dalam satu Blog, tutorial membuat dark mode ini sudah banyak bersebaran di mesin pencarian, termasuk dari Blog Arlina dan Igniel.

Langkah-langkah Menambahkan script Mode Gelap di Blog

1. Sebelum mengikuti tutorial membuat tombol dark mode, sebaiknya melakukan Back Up Template untuk menghindari kesalahan atau error.
2. Login akun Blogger
3. Perhatikan Table Codepeng dibawah ini. Terdapat 4 Menu yaitu HTML - CSS - JS - Result. Cobalah klik satu per satu Menu tersebut.

See the Pen DarkModeBlog by William Rinaldo (@masrinaldo) on CodePen.

4. Copy semua script di Menu CSS pada table diatas dan Paste CSS tersebut sebelum ]]><b:/skin> untuk menambahkan Gaya atau Style pada fitur Mode Gelap di Blogger dan bagian.

Apabila masih ada bagian yang belum berubah tampilannya menjadi Gelap atau tidak termasuk Mode Gelap. Sesuaikan barisan terakhir di script CSS yang sudah di copy pastekan di bagian berikut:

• Tambah Hapus ID Class Disini : Tambahkan ID atau Class bagian yang belum berubah ketika Mode Gelap di Blog aktif (Sobat harus mengetahui ID Class yang ingin ditambahkan).
• Tambah CSS warna : Tambahkan CSS Untuk merubah warna background dan huruf untuk Mode Dark Blogger.

5. Copy semua script di Menu JS pada table diatas dan Paste JS tersebut diatas  </body> untuk menambahkan fungsi Klik.
6. Copy semua script di Menu HTML pada di table diatas dan Paste HTML tersebut sesuai keinginan sobat. Untuk saran bisa menampilkan tombol mode gelap dibagian Navigasi Header.
7. Klik Simpan Tema

 Perlu diingatkan kembali kalau tutorial dark mode ini tidak menggunakan Cookies atau Localstroge, ketika pengunjung membuka atau memuat ulang halaman. Maka pengunjung harus mengaktifkan dark mode.

Demikian artikel mengenai "Cara Membuat Tombol Mode Gelap di Blogger Agar Pengunjung tetap Nyaman" dari Mas Rinaldo.