NgeShare - Cara Menampilkan dan Menyembunyikan Widget atau Elemen di Blog

by - 2/09/2019


Buat kamu yang lagi main blog, terutama yang memakai platform dari blogger, apakah kamu pernah memiliki keinginan untuk menyembunyikan dan menampilkan widget atau elemen di blogmu. Ya, menampilkan dan menyembunyikan, seperti misalnya membuat sebuah widget atau elemen di blogmu tidak terlihat di homepage blog dan hanya dapat terlihat di postpage saja. Jika kamu memiliki keinginan seperti itu, berikut ini saya akan membagikan tutorial untuk melakukan hal tersebut dengan menggunakan beberapa kode yang dapat kamu pasang di template blogmu.

1. Kode untuk menampilkan widget atau elemen hanya di homepage.
<b:if cond='data:blog.url == data:blog.homepageUrl'>
<!-- ISI dari widget atau elemen -->
</b:if>

Contoh penggunaannya:
<b:widget id='HTML1' locked='false' title='Nama title' type='HTML'>
<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:include name='quickedit'/>
</b:if>
</b:includable>
</b:widget>

Atau
<b:if cond='data:blog.url == data:blog.homepageUrl'>
<style type='text/css'>
/* -- Ini adalah CSS style -- */</style>

<script type='text/javascript' >
//Ini adalah kode JavaScript
</script>
</b:if>

Keterangan:
- Kode yang ditandai dengan warna merah merupakan batas dari penggunaan kode tersebut.
- Kode yang ditandai dengan warna biru merupakan kode untuk menampilkan atau menyembunyikan widget/ elemen.

2. Kode untuk menampilkan widget atau elemen hanya di postpage (postingan blog)
<b:if cond='data:blog.pageType == "item"'>
<!-- ISI dari widget atau elemen -->
</b:if>

3. Kode untuk menyembunyikan widget atau elemen di postpage.
<b:if cond='data:blog.pageType != "item"'>
<!-- ISI dari widget atau elemen -->
</b:if>

4. Kode untuk menampilkan widget atau elemen di halaman tertentu.
<b:if cond='data:blog.url == "URL Halaman"'>
<!-- ISI dari widget atau elemen -->
</b:if>

Keterangan:
- Gantilah kode yang ditandai warna biru dengan url atau link yang kamu inginkan.

Contoh penggunaannya:
<b:if cond='data:blog.url == "https://suryapersonal.blogspot.com/"'>
<!-- ISI dari widget atau elemen -->
</b:if>

5. Kode untuk menyembunyikan widget atau elemen di halaman tertentu.
<b:if cond='data:blog.url != "URL Halaman"'>
<!-- ISI dari widget atau elemen -->
</b:if>

Keterangan:
- Gantilah kode yang ditandai warna biru dengan url atau link yang kamu inginkan.

6. Kode untuk menampilkan widget atau elemen hanya di halaman arsip.
<b:if cond='data:blog.pageType == "archive"'>
<!-- ISI dari widget atau elemen -->
</b:if>

7. Kode untuk menyembunyikan widget atau elemen di halaman arsip.
<b:if cond='data:blog.pageType != "archive"'>
<!-- ISI dari widget atau elemen -->
</b:if>

8. Kode untuk menampilkan widget atau elemen hanya di halaman statis.
<b:if cond='data:blog.pageType == "static_page"'>
<!-- ISI dari widget atau elemen -->
</b:if>

9. Kode untuk menyembunyikan widget atau elemen di halaman statis.
<b:if cond='data:blog.pageType != "static_page"'>
<!-- ISI dari widget atau elemen -->
</b:if>

10. Kode untuk menyembunyikan widget atau elemen di tampilan mobile.
<b:if cond='data:blog.isMobileRequest == "false"'>
<!-- ISI dari widget atau elemen -->
</b:if>

Oke, sekiranya itu tutorial yang bisa saya bagikan mengenai cara menampilkan dan menyembunyikan widget atau elemen di blog. Seperti biasa, kalau ada pertanyaan atau saran yang ingin kamu sampaikan terkait tutorial ini, bisa kamu sampaikan dengan cara menuliskannya di kolom komentar disqus yang terletak di bawah artikel ini. Semoga bermanfaat, ya! 😁

Sawer


Anda suka dengan tulisan-tulisan di blog ini? Jika iya, maka Anda bisa ikut berdonasi untuk membantu pengembangan blog ini agar tetap hidup dan update. Silakan klik tombol sawer di bawah ini sesuai nilai donasi Anda. Terima kasih.

0 comments