Iklan Responsive

Cara Modifikasi Header Theme Contempo Blogspot

Sejak 12 OKTOBER 2019, TUTORIAL bertranspormasi menggunakan theme terbaru berdasarkan Blogspot. Saya menentukan menggunakan theme contempo karena tampilannya yang sederhana. Nyaris seluruh hal yang aku idamkan terpenuhi oleh theme baru ini.

Sayangnya, pengaturan bawaan contempo menyisahkan sedikit pekerjaan tempat tinggal . Utamanya di bagian header atau ketua. Ada latar yang tak mau hilang meski telah dihapus. Logo yang dimasukkan pun meski mini hasilnya akan tetap besar . Dan yang paling mengganggu merupakan sticky header.

Mungkin sebagian orang nir akan bermasalah dengan sticky header itu. Tapi kemunculannya pada versi mobile sekali waktu memakan separuh layar gadget serta menutup sebagian artikel. Saya sangat memperhatikan kenyamanan pengunjung, sehingga itu relatif annoying. Hingga akhirnya aku hilangkan.

Ada 3 hal dasar yang aku lakukan untuk memodifikasi bagian header theme contempo. Semuanya melalui proses yg sederhana. Hanya menggunakan menambahkan kode 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 bagian background tetap tidak akan sama dengan latar belakang blog secara keseluruhan. Sehingga nampak ganjil .

Bagi aku hal itu sedikit mengurangi estetika tampilan, lantaran masih ada tiga warna mayoritas dalam blog. Meski tidak ada anggaran bakunya, namun saya selalu mengusahakan, minimal hanya 2 rona lebih banyak didominasi. Sehingga saya putuskan buat menghilangkannya.
Caranya cukup sederhana. Silahkan masuk ke bagian 'Tema/Theme' lalu pilih 'Sesuaikan'. Masuk ke tab 'Lanjutkan' kemudian geser kursor ke pengaturan paling akhir 'Tambahkan CSS'. Selanjutnya paste kode 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 rona. Jika menginginkan mengganti rona dasarnya, pergi ke bagian 'Latar' kemudian pilih sinkron kehendak. TUTORIAL menentukan tetap menggunakan warga grey, lantaran menonjolkan kesan sederhana.

Cara Menghilangkan Sticky Header
Sticky header merupakan bagian ketua yg selalu melekat di layar paling atas dalam blog. Meski page digeser ke bagian bawah. Sebenarnya ada banyak fungsi dari sticky header ini. Selain buat memudahkan pengunjung pulang ke halaman home, juga sanggup menampilkan tombol pencarian.
Karena aku mengaktifkan pengaturan Auto Ad menurut Google Adsense, sebagai akibatnya iklan tak jarang muncul pada bagian sticky ini. Walau yang akhirnya ada hanya secuil, namun bagian kepala yg mengganggu itu akan permanen memotong separuh bagian blog.

Karena berdasarkan aku ini mengurangi ketenangan pembaca, aku putuskanlah buat dihilangkan. Buat kalian yg nir merasa begitu, sebaiknya dipertahankan saja. Kalau hitung-hitungannya iklan serta penghasilan, memang akan sangat menguntungkan. Namun pengunjung akan berpikir 2 kali buat kembali dengan banyak gangguan itu.

Untuk menghilangkan sticky header tadi, caranya nyaris sama menggunakan menghilangkan background header. Tetap pada bagian 'Tambahkan CSS'. Kode CSSnya seperti berikut. Sisa copy dan paste kemudian tekan tombol 'Terapkan ke Blog'.
.centered-top-container.sticky
    display: none !Important;
}

Cara Memasukkan serta Mengatur Ukuran Logo
Logo bagi sebuah blog sudah misalnya identitas yang tidak boleh disepelekan. Orang-orang akan gampang mengingat blog kita hanya menggunakan melihat logonya. Jadi sangat krusial. Sayangnya, meski theme contempo mendukung buat pemasangan logo, tapi tampilannya nir pribadi menyesuaikan badan blog.

Kita tetap wajib mengaturnya menggunakan manual. Untuk memasang logo, terlebih dahulu menguploadnya di bilah 'Gadget'. Lalu ke bagian 'Header' dan lakukan configurasi. Upload logo yg hendak di pasang. Tidak lupa tetap mencentang bagian 'Tampilan Header Halaman' dan pilih 'Tempatkan Keterangan Setelah Gambar'. Setelah itu simpan.

Maka logonya akan ada pada ketua blog kita. Biasanya ukurannya akan besar serta nir enak dicermati. Langkah selanjutnya, pulang ke halaman 'Tambahkan CSS'. Lalu masukkan kode berikut.
.centered-top-container img, .centered-top-placeholder img
  max-width: 380px;
  margin: 0 auto;
  display: block;
}

Untuk membarui berukuran sinkron yang dikehendaki, silahkan mengganti nomor pada bagian max-width: 380px;. Cari ukuran yang sinkron. Lalu pilih 'Terapkan ke Blog' bila telah yakin. Kalau memilih memasukkan gambar seukuran body, kode di atas jua bisa digunakan buat mengatur komposisinya.

Hasil pengaturan header theme contempo ini akan menciptakan tampilan blog kian sederhana. Lantaran aku memang berharapnya demikian, maka saya mengaturnya begitu. Kalian bisa melakukan eksperimen sendiri sinkron kehendak hati.

Theme baru menurut blogspot memang mempunyai poly kemudahan dibanding theme lama . Nyaris semua pengaturan buat modifikasi sanggup dilakukan melalui channel CSS. Sehingga yang tidak tahu struktur HTML tidak perlu takut melakukan kesalahan.

Semoga bermanfaat dan apabila terdapat pertanyaan lain, silahkan menulisnya pada kolom komentar. Saya akan berusaha sebisa mungkin membantu menyebutkan. Khususnya buat theme contempo. Pengaturan untuk theme lain bisa jadi nir akan sama menggunakan cara pada atas.
Salam kreatif!!

Iklan Atas Artikel

Iklan Tengah Artikel 1

Iklan Tengah Artikel 2

Iklan Bawah Artikel