Pengaturan widget dengan menampilkan pada halaman tertentu blog konsepnya sama dengan Cara Menyembunyikan Sidebar pada Halaman Blogspot karena sama-sama diperlukan sebuah pemahaman mengenai deklarator kode css.
Konsep penerapan seperti ini sebenarnya tidaklah terlalu rumit karena cukup dengan memahami beberapa tags pada xml/html template. Misalnya conditional tags b:if, dimana tag ini merupakan sebuah bagian pada xml/html template blog yang berfungsi untuk menampilkan atau menyembunyikan element pada halaman tertentu. Untuk menerapkannya, berikut caranya.
1. Mencari ID widget yang akan ditampilkan
Mencari ID widget tidaklah sulit, anda bisa mengakses "quickedit" (gambar obeng dan kunci pada sudut kanan bawah widget) atau dengan cara masuk ke dasboard, pilih tata letak dan mengklik edit pada sudut kanan bawah widget, kemudian akan muncul popup window. Perhatikan pada URL pada addressbar, nah ID widget berada tepat di ujung url. Contohnya seperti gambar di bawah.
Perhatikan id widget pada gambar di atas (HTML4), nah id tersebut harus anda simpan di notepad atau dimana saja yang penting anda bisa ingat.
2. Memberikan tags conditional pada widget atau sidebar yang akan ditampilkan
Perhatikan langkah-langkah di bawah dalam pemberian contional tags pada widget yang akan ditampilkan pada halaman tertentu pada blog.
- Login Blogger
- Pilih Template » Edit HTML dan centang "Expand Template Widget"
- Langkah selanjutnya, cari ID wiget yang anda simpan tadi di notepad dengan cara menekan CTRL + F untuk mempermudah pencarian. Berikut contohnya :
- Selanjutnya tambahkan conditional tag pembuka (<b:if cond='.......'>) sesudah tag <b:includable id='main'> dan tag penutup (</b:if>) sebelum tag </b:includable> kedalamnya. Berikut cara lengkpanya :
<b:widget id='HTML4' locked='false' title='' type='HTML'>2. Menampilkan widget hanya pada halaman postingan
<b:includable id='main'>
<b:if cond='data:blog.url == data:blog.homepageUrl'>
<!-- 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>
<b:widget id='HTML4' locked='false' title='' type='HTML'>3. Menampilkan widget pada halaman statis (contact us, daftar isi, forum, dsb)
<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>
<b:widget id='HTML4' locked='false' title='' type='HTML'>4. Menampilkan widget pada halaman arcive /arsip
<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>
<b:widget id='HTML4' locked='false' title='' type='HTML'>5. Menampilkan widget hanya pada halaman tertentu
<b:includable id='main'>
<b:if cond='data:blog.pageType == "archive"'>
<!-- 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>
<b:widget id='HTML4' locked='false' title='' type='HTML'>
<b:includable id='main'>
<b:if cond='data:blog.url == "Masukkan URL halaman anda disini"'>
<!-- 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>
- Terakhir, simpan template dan lihat hasilnya.
makasih gan tutornya, saya coba dulu hhe
ReplyDelete