Cara Gampang Merubah Ukuran Header Blogspot
Saturday, 28 May 2016
Edit
Kali ini kita akan belajar mempercantik tampilan blog. Soal cantik ini penilaiannya relatif dari masing-masing pengguna. Tapi pada dasarnya, blog yang cantik itu yakni yang tidak mempersulit pengunjungnya.
Setiap pengunjung (visitor) kadang memberi waktu yang lama dalam satu blog, kadang pula muncul tenggelam. Ada banyak faktor yang mempengaruhi, salah satunya peletakan atau tampilan yang kurang menarik.
Nah... pada kesempatan ini kita akan belajar merubah ukuran header blogspot. Kadang ada orang yang ingin melebarkan header blognya, kadang pula ada yang ingin memperkecil. Setiap orang punya selera berbeda dalam mendesain blognya.
Untuk merubah header blog, banyak blogger yang mengalami kesulitan. Karena untuk merubah ukuran header memang membutuhkan kemampuan otak atik kode HTML. Tapi itu dulu, sekarang blogspot telah memberi kita kemudahan.
Kita bisa merubah header blog tanpa harus mati-matian belajar CSS atau HTML. Caranya gampang, ikuti langkah berikut ini. Oh iya, metode ini khusus bagi blogger yang menggunakan template standar dari blogspot. Seperti blog ini menggunakan template sederhana. Metode ini pun telah berhasil saya terapkan di blog ini.
- Pertama-tama seperti biasa login ke akun blogspot Anda dan masuk ke dasbor. Selanjutnya pilih 'Template' dan klik 'Sesuaikan'
- Anda akan dibawa kehalaman pengaturan antar muka. Di langkah ini usahakan rubah dulu warna header Anda agar bisa membedakan hasil perubahan. Namun jika warna header Anda sudah berbeda, hiraukan langkah ini. Bagi yang warna headernya sama dengan warna body, cara merubahnya seperti ini. Masuk ke tab 'Tindak Lanjut' lalu pilih 'Latar' dan pilih 'Latar Header' (lihat gambar). Anda bisa merubahnya sesuka hati.
- Setelah warna header berubah (Bisa dilihat dikolom bawah pratinjau tampilan). Langkah sepanjutnya, tarik kursor Anda hingga kebawah lalu pilih 'Tambahkan CSS' (lihat gambar).
- Anda akan diberi kolom isian. Selanjutnya tinggal copy paste script dibawah ini.
.header-outer{
left:-40px;
width:1000px;
height:40px;
bottom:10px;
}
left:-40px;
width:1000px;
height:40px;
bottom:10px;
}
Penjelasan Script :
- left:-40px; merupakan kode untuk mengatur kerapatan sisi kanan header dengan tampilan layar, silahkan angkanya dirubah-rubah sesuai keinginan Anda dengan mencocokan perubahan preview yang tampak pada halaman desain blogger hingga sudah merasa cocok.
- width:1000px; merupakan kode untuk menyesuaikan panjang header di sisi kanan, silahkan di sesuaikan angkanya menurut selera Anda.
- height:40px; merupakan kode untuk merubah ukuran tinggi header, seperti biasa silahkan di sesuaikan dengan selera Anda.
- bottom:10px; merupakan kode jarak dari bagian bawah, jadi jika angka ini dirubah/diperbesar maka akan ada jarak antara header dengan widget yang ada pada bagian bawah header.