Mengganti header template blogger dengan cara menghapus header bawaannya

Pernahkah Anda mengalami hal begini: Ketika diperiksa, entah salah apa heading h1 hilang sehingga struktur template tidak baik di mata mesin online? Atau begini: Header bawaan blog tampak monoton dan membosankan. Jadi dengan trik yang saya kemukakan berkat rajin bikin template he he he...Anda akan menarik manfaat:

cara mengganti header bawaan template blog
  1. Merubah gaya header
  2. Membuang atau menghapus sama sekali widget header bawaan blogger sampai ke akar akarnya.
  3. Dengan mudah memindah mindah posisi header baru ini ke kiri, ke kanan dan atau gaya header halaman website masa kini: Judul di tengah (text.align.center).
  4. Memperbaiki dan mengatasi tag h1 yang hilang.

Loh kan yang bawaan juga bisa di modifikasi kok. Anda jangan mengira sebundel pengaturan CSS dapat mengatur atur semua varian template blogger, perhatikan apa yang sering di posting oleh para blogger untuk meletakan Judul blog menjadi di tengah. Sarannya kebanyakan meletakan CSS berikut ke dalam template di astas ]]></b:skin.
/* Header
----------------------------------------------- */
.header-outer {
background: $(header.background.color) $(header.background.gradient) repeat-x scroll top left;
_background-image: none;
color: $(header.text.color);
text-align:center;
}
Perhatikan baik baik itu bukan kode CSS sapu jagat, bukankah itu lebih kepada template dengan versi layout ke 2? 

Yakni dapat di terapkan ke beberapa template yang dibuat berdasarkan varian varian tema blogger dengan layout kedua.

Bagaimana dengan template template varian terbaru dengan layout versi ke 3? Class dan ID HTML-nya tidak sama, tag conditonalnya beda. Terutama banyak sekali perbedaan dalam pendeklarasian kode kode pembuatannya.

Untuk itu saya menghapus widget header bawaan blogger dan mengabaikan pengaturan CSSnya. Saya membuat pengaturan CSS baru sebagai berikut:

<style> header {
position: relative;
height: 27px;
background-image: linear-gradient(#FFCC99, #fff);
}

.kepala{text-align: center;float: center;}
</style>

Ya CSS style yang di letakan tepat di atas tag </head>

Lalu membuat ID pada pengaturan HTML  sebagai berikut:

<div class='kepala'><h1><a expr:href='data:blog.homepageUrl' expr:title='data:blog.title'><font face='Arial' color='#f0f0f0'><data:blog.title/></font></a></h1></div>

Saya meletakan kode tersebut tepat di atas kode </header> setelah widget header bawaan saya hapus.

Hasilnya? Heading yang tadinya pada saat menggunakan heading bawaan nilainya adalah 3,5 sekarang telah sempurna menjadi 10.

Saya tidak mengatakan trik ini bisa diterapkan pada semua jenis varian varian template, terutama buatan pihak ketiga, yang saya maksudkan adalah sebagian pengaturan CSSnya. Akan tetapi bagian HTML-nya dapat di pastikan akan bekerja dengan baik...

Bagi yang biasa bermain dengan kode kode HTML silahkan melakukan eksprimen sendiri. Mudah kok. Saya bahkan melakukannya hanya dari perangkat mobile (hape atau ponsel) saja.

Demikianlah cara memperbaiki heading tag h1 yang hilang dengan cara mengganti header bawaan blogger itu dengan header buatan kita sendiri.

Ikuti terus trik, tips, teknik hack dan kabar terupdate dari blog ini! Share:

Posting Komentar

Silahkan berkomentar sesuai dengan topik kita ya...

Lebih baru Lebih lama

Formulir Kontak