Sejak 12 Maret 2018, BLOGOOBLOK bertranspormasi memakai theme terbaru dari Blogspot. Saya menentukan memakai theme contempo alasannya yakni tampilannya yang sederhana. Nyaris semua hal yang saya idamkan terpenuhi oleh theme gres ini.
Baca: Cerita Saya Mencoba Tampilan Contempo Blogspot
Sayangnya, pengaturan bawaan contempo menyisahkan sedikit pekerjaan rumah. Utamanya di bab header atau kepala. Ada latar yang tak mau hilang meski sudah dihapus. Logo yang dimasukkan pun meski kecil hasilnya akan tetap besar. Dan yang paling mengganggu yakni sticky header.
Mungkin sebagian orang tidak akan bermasalah dengan sticky header itu. Tapi kemunculannya di versi mobile sesekali memakan separuh layar gadget dan menutup sebagian artikel. Saya sangat memperhatikan kenyamanan pengunjung, sehingga itu cukup annoying. Hingga risikonya saya hilangkan.
Ada tiga hal dasar yang saya lakukan untuk memodifikasi bab header theme contempo. Semuanya melalui proses yang sederhana. Hanya dengan menambahkan arahan CSS. Berikut penjelasannya satu-persatu.
Cara Menghilangkan Gambar Background Header
Bawaan theme contempo akan menampilkan gambar background berupa pemandangan. Pun bila dihilangkan melalui pengaturan, warna bab background tetap tidak akan sama dengan latar belakang blog secara keseluruhan. Sehingga nampak ganjil.
Bagi saya hal itu sedikit mengurangi estetika tampilan, alasannya yakni terdapat tiga warna lebih banyak didominasi dalam blog. Meski tidak ada hukum bakunya, namun saya selalu mengusahakan, minimal hanya dua warna dominan. Sehingga saya putuskan untuk menghilangkannya.
Caranya cukup sederhana. Silahkan masuk ke bab 'Tema/Theme' kemudian pilih 'Sesuaikan'. Masuk ke tab 'Lanjutkan' kemudian geser kursor ke pengaturan paling selesai 'Tambahkan CSS'. Selanjutnya paste arahan di bawah ini di kotak yang disediakan. Setelahnya tinggal tekan 'Tepatkan ke Blog'.
.bg-photo-overlay { display:none; }
Tampilan background blog Anda akan sepenuhnya satu warna. Jika menginginkan mengganti warna dasarnya, pergi ke bab 'Latar' kemudian pilih sesuai kehendak. BLOGOOBLOK menentukan tetap memakai warga grey, alasannya yakni menonjolkan kesan sederhana.
Cara Menghilangkan Sticky Header
Sticky header yakni bab kepala yang selalu melekat di layar paling atas pada blog. Meski halaman digeser ke bab bawah. Sebenarnya ada banyak fungsi dari sticky header ini. Selain untuk memudahkan pengunjung kembali ke halaman home, juga sanggup menampilkan tombol pencarian.
Karena saya mengaktifkan pengaturan Auto Ad dari Google Adsense, sehingga iklan seringkali muncul di bab sticky ini. Walau yang risikonya muncul hanya secuil, namun bab kepala yang mengganggu itu akan tetap memotong separuh bab blog.
Karena berdasarkan saya ini mengurangi kenyamanan pembaca, saya putuskanlah untuk dihilangkan. Buat kalian yang tidak merasa begitu, sebaiknya dipertahankan saja. Kalau hitung-hitungannya iklan dan penghasilan, memang akan sangat menguntungkan. Namun pengunjung akan berpikir dua kali untuk kembali dengan banyak gangguan itu.
Untuk menghilangkan sticky header tersebut, caranya nyaris sama dengan menghilangkan background header. Tetap di bab 'Tambahkan CSS'. Kode CSSnya menyerupai berikut. Sisa copy dan paste kemudian tekan tombol 'Terapkan ke Blog'.
.centered-top-container.sticky {
display: none !important;
}
display: none !important;
}
Cara Memasukkan dan Mengatur Ukuran Logo
Logo bagi sebuah blog sudah menyerupai identitas yang tak boleh disepelekan. Orang-orang akan gampang mengingat blog kita hanya dengan melihat logonya. Kaprikornus sangat penting. Sayangnya, meski theme contempo mendukung untuk pemasangan logo, tapi tampilannya tidak pribadi menyesuaikan tubuh blog.
Kita tetap harus mengaturnya dengan manual. Untuk memasang logo, terlebih dahulu menguploadnya di bilah 'Gadget'. Lalu ke bab 'Header' dan lakukan configurasi. Upload logo yang hendak di pasang. Tidak lupa tetap mencentang bab 'Tampilan Header Halaman' dan pilih 'Tempatkan Keterangan Setelah Gambar'. Setelah itu simpan.
Maka logonya akan muncul di kepala blog kita. Biasanya ukurannya akan besar dan tidak yummy dipandang. Langkah selanjutnya, kembali ke halaman 'Tambahkan CSS'. Lalu masukkan arahan berikut.
.centered-top-container img, .centered-top-placeholder img {
max-width: 380px;
margin: 0 auto;
display: block;
}
max-width: 380px;
margin: 0 auto;
display: block;
}
Untuk mengubah ukuran sesuai yang dikehendaki, silahkan mengubah angka pada bab max-width: 380px;. Cari ukuran yang sesuai. Lalu pilih 'Terapkan ke Blog' bila sudah yakin. Kalau menentukan memasukkan gambar seukuran body, arahan di atas juga sanggup dipakai untuk mengatur komposisinya.
Hasil pengaturan header theme contempo ini akan menciptakan tampilan blog kian sederhana. Karena saya memang berharapnya demikian, maka saya mengaturnya begitu. Kalian sanggup melaksanakan eksperimen sendiri sesuai kehendak hati.
Baca Juga: Blogspot Ganti Template Kaprikornus Tema dan 4 Desain Baru
Theme gres dari blogspot memang mempunyai banyak akomodasi dibanding theme lama. Nyaris semua pengaturan untuk modifikasi sanggup dilakukan melalui channel CSS. Sehingga yang tidak memahami struktur HTML tidak perlu takut melaksanakan kesalahan.
Semoga bermanfaat dan bila ada pertanyaan lain, silahkan menulisnya dalam kolom komentar. Saya akan berusaha sebisa mungkin membantu menjelaskan. Khususnya untuk theme contempo. Pengaturan untuk theme lain sanggup jadi tidak akan sama dengan cara di atas.
Salam kreasi!
