Membuat Halaman Blog Dinamis, bag kedua

misntv official
Ini kasus lama yang pernah saya posting pada tahun 2007 lalu. Dan akhir-akhir ini mulai di pergunakan lagi semenjak banyak template blogcepot nyadur dari theme wordpress, terutama untuk layout berinisial “ M “.
Kalau dulu trik ini untuk menyembunyikan atau mengontrol gadget dari halaman depan dan halaman content page, maka perkembangan selanjutnya trik ini di gunakan untuk menyembunyikan atau mengontrol ukuran kolom dan sifatnya.
teorinya yang saya hapal dan pahami begini.
Pada dasarnya blogcepot itu terdiri dari beberapa halaman.
1. Halaman Depan  Atau FrontPage
2. Halaman Index Label
3. Halaman Archives Page
4. Halaman Postingan atau Item Pages ( red. readmore mengunakan hal ini ).
contoh :
A . Kolom, ukuran kolom  atau widget, di tampilkan pada  halaman depan namun disembunyikan atau ( berubah ) pada halaman Item Pages – Postingan. scriptnya mengunakan ini.
<b:if cond="data:blog.url == data:blog.homepageUrl"> di tutup dengan </b:if>

B. kolom atau elemen yang tampil pada halaman depan dan indek label, namun tidak tampil atau ( berubah ) pada halaman Item Pages – Postingan.
<b:if cond='data:blog.pageType != &quot;item&quot;'> dan di tutup dengan </b:if>

C. Pada halaman depan,  kolom atau elemen widget-nya tidak tampil namun akan tampil atau ( berubah ) pada halaman Item-Pages – Postingan.
<b:if cond='data:blog.pageType == "item"'> dan di tutup dengan </b:if>
Note :
Untuk kasus gadget atau widget dinamis pernah saya bahas pada bikin-blog-lebih-dinamis
Sekarang yang akan saya bicarakan adalah merubah ukuran kolom atau menyembunyikan kolom.
Ilustrasi halaman content.
gam-01
Ilustrasi halaman depan atau front page
gam-02
Yang perlu kita lakukan adalah menambah script untuk  ukuran kolom yang akan di tampilkan pada halaman depan , dan menyembunyikan untuk kolom Sidebar 1.
caranya.
Setelah script  ]]></b:skin> 
Tambahkan di antaranya ( kira-kira ) , script seperti ini.
<style type='text/css'>
<b:if cond='data:blog.pageType != &quot;item&quot;'>
#main-wrapper {
width:400px;
}
.post-body img{
width:….px;
}
.post-body {text-align:justify;}
.main .widget {
  border-bottom:1px dotted $bordercolor;
  margin:0 .5em 1.5em 0;
  padding:0 0 1.5em;
}
</b:if>
<b:if cond='data:blog.pageType == &quot;item&quot;'>
#Sidebar 1 { display:none;}
</b:if>
</style>
 
Tags