Sebaran Label

Saturday, January 23, 2010

Membuat Header Berbeda Setiap Postingan

Kembali lagi ke blog trik, setelah membahas beberapa hal mengenai error shoutmix, dan static page di blogspot, juga info mengenai perpanjangan .co.cc gratis, kini saaatnya saya memberikan trik kepada Ada, bagaimana membuat header yang berbeda untuk postingan tertentu. Seperti biasa, agar lebih mudah silahkan lihat contoh dengan klik, Forum: Lesehan Wae. Perhatikan bagian artikel forum tersebut, bagian header berubah dari header bertulisakan Mas Doyok, menjadi Lesehan Wae.



Bagaimana bisa terjadi? Mudah saja, itu memang dua gambar yang berbeda. Dan saya hanya memanggil gambar bertema Lesehan Wae untuk postingan tertentu.

Untuk membuatnya Anda ikuti tutorial berikut ini,
1. Temukan CSS Header Anda
Anda harus bisa menentukan mana yang merupakan kode css untuk header Anda. Kodenya akan mirip seperti ini:
#header-wrapper{
    ..............................
..........................

............................
background: url (alamatgambaranda);
}

Namun kode di atas bukan harga mati, bisa saja Anda menggunakan template yang gambar kepala masuk dalam body seperti template saya. Intinya temukan kode untuk gambar kepala Anda.

2. Aplikasi Header Hanya Untuk Postingan TErtentu
Masukkan kode berikut ini di atas </head>

<b:if cond='data:blog.url == &quot;http://urlpostingananda.com/urlpostingananda.html&quot;'>
<style>
#header-wrapper{
    ..............................
..........................
background: url (alamatgambaranda);
}
</style>
</b:if>


Nah, isi kode berwarna merah pertama dengan alamat postingan Anda yang akan Anda rubah headernya.
Kode merah kedua adalah kode css untuk header Anda. Jadi sekarang, Anda mempunyai dua kode css header,yang pertama untuk umum dan yang baru saja Anda tambahkan hanya bekerja untuk postingan yang Anda tentukan.

Anda bisa melakukannya untuk hal-hal lain seperti sidebar dan bagian postingan Anda. Hanya butuh penyesuaian css saja. Semoga bermanfaat.

Related Posts by Categories



Widget by Hoctro | Jack Book

0 comments: