Baca Dulu :
- TAG KONDISIONAL LENGKAP DAN CARA MENGGUNAKANNYA
- MEMBUAT HALAMAN HOME, POSTING , STATIS BERBEDA DENGAN TAG KONDISIONAL
Menyembunyikan dan Menampilkan Widget Hanya Dengan Tag Kondisional |
Nah Jika sobat sudah mulai paham dengan Tag Kondisional mari kita sama sama bahas tentang tag ini dengan judul Menyembunyikan dan Menampilkan Widget Hanya Dengan Tag Kondisional.
Sebagai Demo Coba bisa dilihat pada Gambar :
Widget Ruang Ngopi Yang hanya tampil di Homepage dan Halaman Index |
Widget Yang Hanya tampil di Halaman Posting |
Penerapan Tag Kondisional Pada Blogger
1. Cari Nama/ Judul Widget Sobat atau sebagai Contoh saya gunakan Widget dengan judul 'Ruang Ngopi' pada blog ini
2. Lalu Cari Nama Judul Widgetnya pada HTML Editor di Blogger
3. Jika Sudah Ketemu Lalu Perhatikan Kode berikut :
<b:widget id='HTML4' locked='false' title='Ruang Ngopi' type='HTML'>
<b:includable id='main'>
<b:if cond='data:blog.pageType == "index"'> <!-- only display title if it's non-empty -->
<b:if cond='data:title != ""'>
<h2 class='title'><data:title/></h2>
</b:if>
<div class='widget-content'>
<data:content/>
</div>
</b:if></b:includable>
</b:widget>
4. Yang Harus anda Tambahkan Hanya Tag Kondisional Yang sudah Saya beri warna Merah Pada Kode diatas
Info :
Kenapa Pake tag Kondisional Halaman Index ? Karena (Menurut Saya Agar pada Halaman Search Label di Homepage Widget tetap ada Contohnya Halaman Ini :
http://www.labeltutorial.com/search?updated-max=2013-12-26T01%3A19%3A00%2B07%3A00&max-results=7
Atau ini
http://www.labeltutorial.com/search
Kenapa Pake tag Kondisional Halaman Index ? Karena (Menurut Saya Agar pada Halaman Search Label di Homepage Widget tetap ada Contohnya Halaman Ini :
http://www.labeltutorial.com/search?updated-max=2013-12-26T01%3A19%3A00%2B07%3A00&max-results=7
Atau ini
http://www.labeltutorial.com/search
Cara Menampilkan Widget Dengan tag Kondisional Lainnya :
Widget hanya Tampil di Halaman Posting
<b:widget id='HTML4' locked='false' title='Ruang Ngopi' type='HTML'>
<b:includable id='main'>
<b:if cond='data:blog.pageType == "item"'> <!-- only display title if it's non-empty -->
<b:if cond='data:title != ""'>
<h2 class='title'><data:title/></h2>
</b:if>
<div class='widget-content'>
<data:content/>
</div>
</b:if></b:includable>
</b:widget>
Widget hanya Tampil Dihalaman Statis
<b:widget id='HTML4' locked='false' title='Ruang Ngopi' type='HTML'>
<b:includable id='main'>
<b:if cond='data:blog.pageType == "static_page"'> <!-- only display title if it's non-empty -->
<b:if cond='data:title != ""'>
<h2 class='title'><data:title/></h2>
</b:if>
<div class='widget-content'>
<data:content/>
</div>
</b:if></b:includable>
</b:widget>
Widget Hanya Tampil Dihalaman Terntentu
<b:widget id='HTML4' locked='false' title='Ruang Ngopi' type='HTML'>
<b:includable id='main'>
<b:if cond='data:blog.url == "URL HALAMAN"'> <!-- only display title if it's non-empty -->
<b:if cond='data:title != ""'>
<h2 class='title'><data:title/></h2>
</b:if>
<div class='widget-content'>
<data:content/>
</div>
</b:if></b:includable>
</b:widget>
Cara Menampilkan Hanya Satu Widget saja yang tampil di Homepage
Walaupun Gak ada yang nanya gapapa Sekalian saya jelasin kalo untuk hanya menampilkan satu widget saja pada homepage
1. Sobat harus tau ID Pada Widget yang ingin tidak di tampilkan
Caranya Pergi Ke Tata Letak lalu Klik Edit Pada Widget yang ingin di liat IDnya lihat pada URLnya di Jendela Widgetnya ,Diketahui Class ID widgetnya HTML4 Lihat gambar :
2. Nah jika sudah tau ID pada Widgetnya sekarang kita pakai CSSnya untuk Diterapkan pakai Tag Kondisional , Simpan Kode ini untuk tidak menampilkan Widget pada Homepage di Bawah Kode </b:skin> atau </style>
<style>
<b:if cond='data:blog.pageType == "index"'>
#HTML2 ,#HTML3 ,#HTML5 {display: none;}
</b:if>
</style>
Info :
Kode Diatas Artinya Widget yang Id Classnya #HTML2 ,#HTML3 ,#HTML5 tidak ditampilkan di Homepage
Kode Diatas Artinya Widget yang Id Classnya #HTML2 ,#HTML3 ,#HTML5 tidak ditampilkan di Homepage
Widget Tetap Terbaca di Browser dan Membuat Homepage Berat
Walaupun gak ada lagi yang nanya ini tapi gapapa lagi karna mungkin nanti akan ada yang bertanya tentang ini. Memang meskipun Widget tidak tampil di Homepage widget tersebut tetapi tetap terbaca oleh browser , nah cara mengatasi widgetnya supaya agar tidak terbaca oleh browser gimana caranya ??
Saya Ambil contoh widget yang memberatkan blog adalah widget dengan ID class HTML5, tambahkan tag Kondisional Pengingkaran widget ini (Warna Merah), kode nya seperti ini :
<b:widget id='HTML5' locked='false' title='' type='HTML'>
<b:includable id='main'>
<b:if cond='data:blog.url != data:blog.homepageUrl'><b:if cond='data:blog.pageType != "index"'><b:if cond='data:blog.pageType != "static_page"'> <!-- only display title if it's non-empty -->
<b:if cond='data:title != ""'>
<h2 class='title'>
<data:title/>
</h2>
</b:if>
<div class='widget-content'>
<data:content/>
</div>
</b:if></b:if></b:if> </b:includable>
</b:widget>
Info :
Arti Kode diatas adalah Widget dengan ID class HTML5 tidak akan tampil dan tidak akan terbaca oleh browser pada halaman Homepage ,Index dan Halaman Statis
Arti Kode diatas adalah Widget dengan ID class HTML5 tidak akan tampil dan tidak akan terbaca oleh browser pada halaman Homepage ,Index dan Halaman Statis
Nah Itu dia Pembahasan Lebih Lanjut Fungsi dan Kegunakan serta Penerapan tag Kondisional pada Blogger , Masih Binggung ? Kalo Masih Bingung Bisa Sobat Tanyakan Keluh dan Kesahnya di Form Komentar dibawah . terima kasih Salam Labeltutoria.com
Author : +Asep Septian