Memperbarui Wajah Website Personal Saya
Kebetulan malam dini hari di bulan Ramadhan ini saya punya waktu luang (alias lagi susah tidur) jadi saya coba untuk melakukan perubahan tampilan blog ini yang baru saja saya lakukan dan menulis sedikit mengenai hal itu. Sebenarnya saya sudah lama ingin melakukan perubahan tampilan blog ini, tapi baru sekarang bisa saya lakukan karena beberapa alasan, salah satunya adalah karena saya ingin mencari tema yang benar-benar cocok dengan selera saya dan juga sesuai dengan kebutuhan saya untuk menampilkan konten di blog ini.
Latar Belakang
Blog ini sebelumnya menggunakan tema hugo-theme-mini dari Hang Jiang, tema yang simpel dan minimalis dan sudah menemani saya selama beberapa waktu. Tema sebelumnya tidak memiliki masalah yang besar, namun saya mulai merasa ingin tampilan yang jauh lebih simpel, lebih personal, dan mendukung dark mode secara proper.
Setelah jalan-jalan mencari referensi, saya menemukan blog milik Rokcso yang tampilannya cocok dengan selera saya. Kebetulan dia juga membuat tema Hugo bernama hugo-bearneo dan mempublikasikannya secara open source. Jadilah saya migrasi ke tema itu dengan sedikit penambahan lagi di visualnya.
Sedikit latar belakang tema ini: hugo-bearneo sendiri merupakan pengembangan dari Hugo Bear Blog. Karena penulis asli Hugo Bear Blog memilih untuk menjaga konsistensi dengan konsep originalnya Bear Blog, rokcso memilih membuat versi terpisah yang lebih ekstensibel dan kaya fitur yang kemudian menjadi hugo-bearneo.
Apa Saja yang Berubah?
Halaman Beranda yang Lebih Terstruktur
Beranda sekarang punya tiga bagian:
- Recent Posts — beberapa terbaru
- Pinned Posts — tulisan yang saya pin (jika ada)
- mungkin nanti akan ada bagian tambahan yang lain
Menurut saya lebih rapi dan lebih cocok untuk tampilan homepage yang lebih personal.
Gambar Native
Dulu saya pakai sintaks shortcode buatan sendiri render-image untuk menampilkan gambar. Sekarang sudah saya migrasikan menggunakan sintaks gambar bawaan Markdown saja, yang berarti tema ini sudah cukup bagus untuk menangani gambar tanpa perlu konfigurasi tambahan.
Penambahan Pill Switcher
Ini fitur yang saya paling suka. Ide pill switcher ini saya dapat dari blog milik Christopher Himes yang punya desain switcher yang elegan. Sekarang jika kalian menggunakan tampilan desktop maka di pojok kanan sebelah menu navigasi ada tiga lingkaran kecil: gelap, terang, dan biru. Coba klik opsi-opsinya untuk mengubah skema warna.
Secara bawaan akan mengikuti preferensi dari sistem (dark/light mode di OS). Kalau kamu pilih salah satu secara manual, pilihannya disimpan dan dipakai lagi saat kamu kembali. Lalu jika coba klik lagi lingkaran yang sudah dipilih maka pilihan manual dihapus dan balik otomatis ke sistem.
Di tampilan mobile, pill-nya juga tampil dengan baik dimana akan terpisah di bawah menu navigasi supaya tidak sesak dan aneh untuk dilihat.
Berkaitan dengan Konten
Perubahan tampilan ini tidak mengubah arah konten blog. Saya tetap akan coba perlahan mulai konsisten menulis lagi hal-hal yang saya alami, pelajari, atau sekadar ingin bagikan mengenai kehidupan dan apapun yang sedang ada di kepala saya. Kalau ada tampilan yang terasa aneh atau ada yang tidak berfungsi dengan baik di browser atau perangkat kamu, jangan ragu untuk kasih tahu.
Dengan wajah baru ini saya akan coba mengikuti challenge 100 Days To Offload yang diinisiasi oleh Kev Quirk. Jika ada artikel saya menggunakan tag #100DaysToOffload saya akan menambahkan keterangan sudah sampai hari ke berapa artikel yang saya buat itu. Semoga bisa konsisten sampai 100 hari ke depan. Terima kasih sudah mampir! 👋
Ini adalah hari ke 1 dari 100 hari menulis.