Cara membuat widget di sidebar, tidak tampil pada halaman utama

Kemaren ada teman yang bertanya cara menghilangkan salah satu widget di sidebar, agar tidak tampil pada halaman utama. Alasannya karna terlalu rame tampilan pada halaman utama. Berbeda dengan halaman posting lainnya yang begitu panjang dengan artikel-artikel sehingga tidak terlalu kelihatan
semrawut. Nah, langsung saja, sebaiknya sebelum kita mulai mengedit template baiknya di back up terlebih dahulu. Bila sudah, ikuti langkah-langkah dibawah..

1. Pastinya anda telah login di blog anda
2. Masuk pada menu Rancangan dan pilih edit HTML
3. Silahkan cari code yang persis dengan code dibawah ini

HTML3‘ locked=’false’ title=‘Paling banyak dibaca‘ type=’HTML’/>
HTML6‘ locked=’false’ title=‘Sobat pembaca‘ type=’HTML’/>
HTML12‘ locked=’false’ title=‘Komentar dari sobat‘ type=’HTML’/>

Perhatikan code yang berwarna BIRU. Bila sudah ketemu, code yang persis dengan code yang berwarna biru diatas inilah yang akan kita jadikan acuan menjadi objek yang akan ditampilkan atau disembunyikan pada halaman tertentu sesuai dengan keinginan anda.

4. Setelah itu cari code ]]></b:skin> dan copy-paste code CSS dibawah ini. Atau cari code </head> dan copy paste diatasnya.

<style type='text/css'>
<b:if cond='data:blog.pageType != &quot;item&quot;'>
#ID{display:none}
</b:if>
</style>

Untuk tulisan ID yang berwarna biru, silahkkan diganti dengan code acuan yang berwarna biru sebelumnya. Contoh : #HTML3


Nah, cukup jelas bukan?? Script code diatas berfungsi agar widget yang dimaksud tidak tampil pada halaman depan namun tampil pada halaman postingan(artikel) lainnya. Sedangkan untuk kebalikannya, yaitu tampil pada halaman artikel atau postingan, namun tidak tampil pada halaman utama code sebagai berikut..

<style type='text/css'>
<b:if cond='data:blog.pageType == &quot;item&quot;'>
#ID{display:none}
</b:if>
</style>

Untuk ID silahkan anda ganti dengan cara diatas tadi. Nah, apa beda dari script code CSS yang ini dengan sebelumnya?? Perhatikan code dibawah,

• Code Pertama : <b:if cond='data:blog.pageType != &quot;item&quot;'>

• Code Kedua   : <b:if cond='data:blog.pageType == &quot;item&quot;'>

Lihat code yang berwarna biru diatas. Untuk tampil pada halaman utama, kita menggunakan "=" sedangkan untuk tidak menampilkan pada halaman utama kita menggunakan code "!"

Bagaimana, mudah bukan?? Semoga bermanfaat dan selamat mencoba...

Artikel Terkait