Selamat malam, pada kesempatan kali ini saya ingin berbagi pengalaman saya tentang cara mengatur tampilan header blog agar tampil lebih menarik.
Dalam blog saya ini, header dari blog ini semuanya adalah murni file .JPEG yang saya desain menggunakan adobe photoshop, termasuk tulisan judul dan deskripsi blog. Namun pada saat pertama saya upload ke widget blog, ternyata muncul masalah yaitu tulisan judul dan deskripsi blog bawaan dari widget administrasi blog ternyata masih tetap muncul di atas header .JPEG yang telah saya buat tadi.
Nah solusi untuk mengatasi masalah tersebut adalah dengan cara "Menyembunyikan Judul dan Deskripsi Blog" agar tidak terlihat di atas header file .JPEG yang telah kita buat tadi.
Caranya adalah sebagai berikut:
1. Login ke blogger
2. Klik tema
3. Klik edit HTML
4. Untuk menyembunyikan Judul Blog, carilah kode berikut:
#header h1 {Atau kalau bingung kamu bisa klik ctrl+f di keyboard, muncul kotak search, ketikkan "#header" di dalamya tanpa tanda petik, tekan enter
margin:5px 5px 0;
padding:15px 20px .25em;
line-height:1.2em;
text-transform:uppercase;
letter-spacing:.2em;
font: normal normal 200% Georgia, Serif;
}
5. Kalau sudah ketemu tambahkan kode display:none; di bawah kode font: normal normal 200% Georgia, Serif; atau lebih jelasnya lihat kode dibawah ini:
#header h1 {6. Selanjutnya untuk menyembunyikan Deskripsi Blog, carilah kode berikut:
margin:5px 5px 0;
padding:15px 20px .25em;
line-height:1.2em;
text-transform:uppercase;
letter-spacing:.2em;
font: normal normal 200% Georgia, Serif;
display:none;
}
#header .description {7. Selanjutnya tambahkan kode display:none; di bawah kode color: #999999; atau agar lebih jelas lihat kode dibawah ini.
margin:0 5px 5px;
padding:0 20px 15px;
max-width:700px;
text-transform:uppercase;
letter-spacing:.2em;
line-height: 1.4em;
font: normal normal 78% 'Trebuchet MS', Trebuchet, Arial, Verdana, Sans-serif;
color: #999999;
}
#header .description {8. Jika sudah selesai kemudian Simpan Template
margin:0 5px 5px;
padding:0 20px 15px;
max-width:700px;
text-transform:uppercase;
letter-spacing:.2em;
line-height: 1.4em;
font: normal normal 78% 'Trebuchet MS', Trebuchet, Arial, Verdana, Sans-serif;
color: #999999;
display:none;
}
Baca juga: Tahapan Membuat Blog Untuk Pemula, Pasti Langsung Bisa
Nah, sekarang kamu telah berhasil menyembunyikan judul dan deskripsi blog.
Tags:
blogger