Kamis, 24 Januari 2013

Rubah Background Blogger Header Menurut Label

Background Header
Blog merupakan sarana Kita untuk menuangkan berbagai hal yang ingin kita bagi dengan orang lain ,Mungkin kita pemilik blog atau para pembaca blog kita akan merasa nyaman dan berlama-lama di blog kita jika blog yang kita miliki nyaman untuk dilihat dan enak dibaca isi blognya.Selain isi blog yang baik tampilan templete blog kita juga merupakan salah satu unsur penarik para pembaca untuk membaca dan tinggal di blog kita lebih lama.Nah sesuai dengan judul postingan kali ini yaitu Rubah Background Blogger Header Menurut Label merupakan salah satu cara merubah tampilan templete kita agar lebig menarik.Trik ini akan merubah Background Blogger header anda sesuai dengan katagori/label blog anda.

Perhatikan Blog ini Posisi home dan artikel dengan label SEO background header blog ini berwarna merah tua (lihat gambar di bawah).


BP Background Header

Sedangkan pada posisi artikel yang berlabelkan selain SEO akan berwarna biru (lihat gambar di bawah).


BP Background Header

Setelah memperhatikan contoh dari blog saya tersebut anda mungkin akan tertarik untuk membuatnya,Jika tidak tertarik anda tidak perlu membuatnya karena trik ini hanya diperuntukan untuk orang - orang yang tertarik saja hehehe.....

Bagi anda yang ingin Rubah Background Blogger Header Menurut label, ikuti langkah-langkah dibawah ini:

1. Anda Diharuskan sudah membuat label tentunya bagi yang belum baca di sini.

2. Pergi ke blogger dasbor >>> Pilih opsi lainya >>> Templete >>>Back Up Dulu templete anda.

3. Selanjutnya Klik Edit HTML dan Centang kotak kecil Expand Widget Templates.

4. Cari kode di bawah ini gunakan Ctrl + F untuk memudahkan pencarian.


<div class='post-header'> atau <data:post.body/> 

5. Copy kode di bawah ini dan pastekan di bawah kode <div class='post-header'> atau <data:post.body/>


<b:loop values='data:post.labels' var='label'>
<b:if cond='data:label.name == &quot;nama kategori&quot;'>
<style type='text/css'>

#header-wrapper{background:#06C url(http://newtemplete-project.googlecode.com/files/headerbg-bp-new-label-bl-tu.jpg) top repeat-x; margin:0 auto !important; font:normal 13px/20px Arial,sans-serif; ; color:#FFF;  overflow:hidden; width:100%; padding:0; height:300px}

</style>
</b:if>
</b:loop>

Keterangan :

* Kode yang berwarna biru nama kategori ganti dengan nama label atau nama kategori anda.

* Kode yang berwarna hijau #header-wrapper ganti dengan kode header css anda.

6. Simpan templete anda.

Selesai dan selamat mencoba.......

5 komentar:

  1. keren bang tutornya
    di bookmark dulu yah :)
    btw follow disini, folback yah :)

    BalasHapus
  2. .: nice share Mas Broo, ga' berlaku buat header yg berisi gambar donk...^_^

    BalasHapus
    Balasan
    1. Tentu saja Trik Ini Bisa untuk background dengan gambar ataupun hanya warna ....

      Hapus
  3. artikelnya keren bos. apa lg tulisan "bambang" di kotak admin-nya. ajarin duuunk

    BalasHapus
  4. Boleh Untuk Tulisan admin Pada Threded comment anda bisa membacanya di http://bambangpage.blogspot.com/2012/09/cara-membedakan-author-comment-dan.html ok.....

    BalasHapus