BLOGGER :: Menciptakan style berbeda untuk tiap halaman blogspot

Sangat memungkinkan sekali untuk menciptakan style(tampilan) yang berbeda dihalaman blog blogger dengan memanfaatkan tag kondisional yang ada.Halaman halaman tersebut meliputi:

• Halaman Posting
• Halaman Index
• Halaman search label
• Halaman statis

Pada umumnya tag kondisional ini dipakai untuk menciptakan suatu kondisi tertentu pada halaman blog ketika diakses.Trik semacam ini banyak ditemui pada template blogspot model magazine.

Kita contohkan penjelentrehannya tag kondisional ini yang dipakai pada tag title seperti ini:

<b:if cond='data:blog.pageType == &quot;item&quot;'>
<title><data:blog.pageName/> | <data:blog.title/></title>
<b:else/>
<title><data:blog.pageTitle/></title>
</b:if>
Artinya jika pada halaman item (postingan) yang tampil(dipakai) menjadi title adalah "title postingan | title blog" jika pada halaman selain halaman item,title yang tampil hanyalah title blog saja.
JIka tag kondisional tersebut ditulis demikian ,apa yang terjadi?

<b:if cond='data:blog.pageType == &quot;item&quot;'>
<title><data:blog.pageName/> | <data:blog.title/></title>
</b:if>
Jika kamu menulis tag seperti diatas maka yang terjadi adalah title hanya tampil (dipakai) hanya untuk halaman item saja.Dan yang terjadi pada halaman selain halaman item adalah tidak memakai  title. Namun demikian yang begini ini tidak dianjurkan untuk diterapkan,hanya sebagai contoh saja.

Ternyata tag tag kondisional tersebut bisa kita manfaatkan untuk membuat tampilan berbeda beda antara jenis halaman blog .Bisa juga dimanfaatkan untuk menampilkan atau menyembunyikan widget  tertentu atau elemen dihalaman tertentu pula.

Contoh penerapan tag kondisional blogger untuk membuat style berbeda di setiap postingan.

<b:skin><![CDATA[/*
body {background: white ;font: normal 12px 'Open Sans', Trebuchet MS, Sans-serif; color: #333333;}
#sidebar{width:300px;padding:0px 0px 0px 0px;float:right;display:inline; margin-top:5px;margin-right:0px;overflow: hidden}
#footer {clear: both;overflow: hidden;font-size: 12px;}
================code css berikutnya=========================
================code css berikutnya=========================
]]</b:skin>

<style>
<b:if cond='data:blog.url == data:blog.homepageUrl'>
body {background: red ;}
</b:if>
</style>
<style type='text/css'>
<b:if cond='data:blog.searchLabel'>
body {background:blue ;}
#sidebar{diplay:none}
</b:if>
</style>

</head>
Contoh diatas yang diatur misalnya hanya untuk background pada body saja,dimana warna background adalah putih pada halaman item,merah pada hompage dan biru pada label.
Kita bisa juga memasukkan selector lainnya,contoh style "selector" lainnya diatas adalah sidebar yang dimana tidak ditampilkan dihalaman label.
Kamu bisa mencoba bereksperimen untuk membuat berbeda style tiap jenis halaman  untuk elemen lainnya.

Hanya menambahkan style tambahan yang disisipkan kedalam tag kondisional dibawah ]]</b:skin>.
Tag kondisional yang berwarna merah diatas adalah tag kondisional yang berfungsi untuk menciptakan kondisi tertentu pada halaman index.Dan yang berwarna biru berfungsi untuk menciptakan kondisi tertentu pada halaman label.

Semoga bisa memahami maksud saya,dan silahkan berexperimen untuk menciptakan template yang unik milik kamu sendiri.