Cara Mudah Merubah Ukuran Header Blogspot

Cara Mudah Merubah Ukuran Header Blog.

Dikesempatan kali ini saya akan mencoba menyebarkan isu sedikit kepada anda, wacana bagaiman cara untuk merubah ukuran header sebuah Blog. Dan sekaligus saya akan mengajak anda untuk mencar ilmu mempercantik tampilan blog. Soal bagus ini penilaiannya relatif dari masing-masing pengguna. Tapi pada dasarnya, blog yang bagus itu yakni yang tidak mempersulit pengunjungnya.

Karena 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. Terkadang ada orang yang ingin melebarkan header blognya dan ada pula yang ingin memperkecilnya. Karena lain orang lain pula seleranya dalam mendesain blognya.

( Baca Juga Cara Membuat Judul Blog Berada Di Tengah )

Untuk merubah ukuran header sebuah blog, banyak para blogger yang mengalami kesulitan. Karena untuk merubah ukuran header memang membutuhkan kemampuan otak atik arahan HTML. Tapi itu dulu, sekarang blogspot telah memberi kita kemudahan. Kita bisa merubah header blog tanpa harus mati-matian mencar ilmu CSS atau HTML.

Sebelum memulai tutorial ini, coba anda rubah dulu background header blog masing-masing pada menu template >> costumize/sesuaikan >> kemudian pada halaman desain template pilih advance/tingkat lanjut >> lalu klik latar/background dan cari header background (latar header) untuk merubah warnanya supaya kita bisa melihat perubahan size yang akan kita praktekan.

Kebetulan pada percobaan ini saya menggunakan template default blogger yang "minimalist template/template sederhana", menyerupai biasa yang saya gunakan yaitu template default blogger, sedangkan pada costumize template yang anda dapat free dari situs-situs template mungkin tidak berhasil alasannya setiap template memiliki hirarki class css yang berbeda.

( Baca Juga Cara Mengatur Jarak Judul Dengan Deskripsi Blog )

A. Berikut ini yaitu caranya......

1. Langkah pertama menyerupai biasa login ke akun blogspot anda dan masuk ke dashboard. Selanjutnya pilih 'Template' dan klik 'Sesuaikan'.

2. Anda akan dibawa kehalaman pengaturan antar muka. Di langkah ini usahakan rubah dulu warna header anda supaya bisa membedakan hasil perubahan. Namun jikalau warna header anda sudah berbeda. Bagi yang warna headernya sama dengan warna body, cara merubahnya menyerupai ini. Masuk ke tab 'Tindak Lanjut' lalu pilih 'Latar' dan pilih 'Latar Header' (lihat gambar). Anda bisa merubahnya sesuka hati.

3. Setelah warna header berubah (Bisa dilihat dikolom bawah pratinjau tampilan). Langkah sepanjutnya, tarik kursor anda sampai kebawah lalu pilih 'Tambahkan CSS' (lihat gambar).

4. Anda akan diberi kolom isian. Selanjutnya tinggal copy paste script dibawah ini.
.header-outer{left:-40px;width:1000px;height:40px;bottom:10px;}

Penjelasan Script :

  • left:-40px; merupakan arahan untuk mengatur kerapatan sisi kanan header dengan tampilan layar, silahkan angkanya dirubah-rubah sesuai harapan anda dengan mencocokan perubahan preview yang tampak pada halaman desain blogger sampai sudah merasa cocok.
  • width:1000px; merupakan arahan untuk menyesuaikan panjang header di sisi kanan, silahkan di sesuaikan angkanya menurut selera anda.
  • height:40px; merupakan arahan untuk merubah ukuran tinggi header, menyerupai biasa silahkan di sesuaikan dengan selera anda.
  • bottom:10px; merupakan arahan jarak dari bab bawah, jadi jikalau angka ini dirubah/diperbesar maka akan ada jarak antara header dengan widget yang ada pada bab bawah header.
Bagaimana....??mudah bukan!

( Baca Juga Cara Membuat Header Blog Menggunakan Logo/Gambar )

B. Adapun Cara dengan mengotak-atik arahan HTML, berikut caranya :
Langsung saja, Berikut ini Cara Mengubah Ukuran Header Blog :

1. Anda login di blogger.com.
2. Kemudian pilih template --> Edit HTML.

3. Cari kode #header, gunakan Ctrl+F untuk mempermudah pencariannya.
4. Setelah ketemu biasanya akan menyerupai ini :
#header-wrapper{background:#fff; margin:0 auto; width:970px; overflow:hidden}
#header-inner{background-position:center; margin-top:25px; margin-left:auto; margin-right:auto}
#header{padding-left:10px; font-family:arial; width:900px; text-align:left; float:left; height:70px; color:#000}
#header h1{font:25px "Segoe UI",Arial; font-weight:bold; color:#000; text-align:left; margin-top:5px; padding:6px 0 8px}
#header a{text-decoration:none; color:#000; border:0}
#header .description{font-size:1em}
#header img{text-align:left}
(Perlu Diingat !! Bahwa arahan setiap template berbeda, jadi cari yang hampir sama).
5. Perhatikan warna Merah diatas. disana kita bisa liat widht:900px dan height:70px. Dari sini kita bisa tahu bahwa header blog kita berukuran 900px X 70px.

6. Nah, tinggal kita ubah saja ukurannya sesuai harapan anda.

( Baca Juga Cara Membuat/Menambahkan Icon Gambar Di Samping Tulisan Pada Navbar Blogspot )

Demikianlah artikel saya kali ini yang membahas wacana Cara Merubah Ukuran Header Blog Semoga dapat bermanfaat buat anda. Namun jikalau ada yang mengalami problem wacana ini, anda bisa menanyakan dengan berkomentar di bawah ini. Terima kasih..
Share This :

Related Post



sentiment_satisfied Emoticon