Header pada blog memiliki peran yang cukup penting dalam menarik minat para pengunjung blog. Untuk header blogspot sendiri, kita tidak hanya dapat menggunakan tampilan tulisan saja, namun dapat juga menggunakan tampilan gambar yang telah kita kreasikan terlebih dahulu. Header blog dengan tampilan yang optimal juga menandakan bahwa blog tersebut dikelola dengan baik juga oleh yang empunya.
Tutorial kali ini, saya hanya ingin berbagi tutorial sederhana supaya gambar yang kita jadikan sebagai header blog tidak dapat di klik yakni dengan menyembunyikan link pada title dan deskripsi header blog kita, sehingga hanya tampilan gambar header saja yang terlihat. Untuk lebih jelasnya, sobat dapat melihat header pada blog ini.
Tutorial kali ini, saya hanya ingin berbagi tutorial sederhana supaya gambar yang kita jadikan sebagai header blog tidak dapat di klik yakni dengan menyembunyikan link pada title dan deskripsi header blog kita, sehingga hanya tampilan gambar header saja yang terlihat. Untuk lebih jelasnya, sobat dapat melihat header pada blog ini.
Untuk mencobanya, caranya cukup mudah, silahkan simak terus tips ini sampai tuntas.
- Masuk ke dashboard blog sobat
- Klik menu Template + edit html
- Cari kode #header h1 dan #header .description, untuk lebih memudahkan, tekan Ctrl+F ketikkan #header h1 dan #header .description lalu tekan Next.
- Jika sudah ketemu, tampilannya seperti ini : #header h1 {
margin:0px 0px 0px 0px;
padding:0px 0px 0px 0px;
line-height:1.2em;
text-transform:uppercase;
letter-spacing:.2em;
font: $pagetitlefont;
text-shadow: 2px 2px 2px #0e4a01;
}
- Tambahkan kode berikut tepat ke dalamnya ( #header h1 dan #header .description).visibility:hidden;
- Terakhir save template sobat.
gan caranya gimana nempatinnya? saya cari di atas ga ada yang ada cuma
ReplyDelete/* Header
----------------------------------------------- */
.header-outer {
background: $(header.background.color) $(header.background.gradient) repeat-x scroll 0 -400px;
_background-image: none;
}
.Header h1 {
font: $(header.font);
color: $(header.text.color);
text-shadow: $(header.shadow.offset.left) $(header.shadow.offset.top) $(header.shadow.spread) rgba(0, 0, 0, .2);
}
.Header h1 a {
color: $(header.text.color);
}
.Header .description {
font-size: $(description.text.size);
color: $(description.text.color);
}
.header-inner .Header .titlewrapper {
padding: 22px $(header.padding);
}
.header-inner .Header .descriptionwrapper {
padding: 0 $(header.padding);
}
aku pakek template bawaan blogger.
ngatasinnya gimana?
http://arifin-construction-bali.blogspot.com
berhasil gan trik nya :D bisa liat http://strukturglobal.blogspot.com/
ReplyDeleteane bookmarks dulu gan xD
ReplyDelete