Cara Menampilkan Widget Hanya pada Hompage atau Posting

Mungkin sobat sudah pernah melihat beberapa blog yang menampilkan widget hanya pada homepage atau hanya pada posting. Misalnya ketika kita membuka homepage sebuah blog yang ditampilkan andalah widget A namun tidak ada widget B atau C. Namun ketika kita masuk ke posting blog tersebut widget yang ditampilkan adalah widget B dan C sedangkan A tidak ada.

Hal tersebut dapat kita terapkan pada blog untuk mengoptimasi tampilan blog sehingga terlihat lebih menarik. Disamping itu kita juga dapat mengoptimasi loading page dari blog tersebut. Misalnya pada bagian posting sebagian besar widget tidak ditampilkan sehingga loading pagenya lebih cepat dibandingkan home page. Jika sobat penasaran bagaimana trik tersebut diterapkan ikuti langkahnya dibawah ini:

1. Masuk ke blogger
2. Pilih Rancangan -- Edit HTML
3. Centang Expand Template Widget
4a. Untuk menampilkan elemen widget hanya pada home page saja maka sisipkan kode berikut ini pada widget blog anda:

<b:if cond="data:blog.url == data:blog.homepageUrl">
</b:if>

Hasilnya akan terlihat seperti ini:

<b:widget id="HTML44" locked="false" title="Tips SEO" 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 != """>
</b:if></b:if></b:includable></b:widget><h2 class="title"><data:title></data:title></h2>
<div class="widget-content">
<data:content/>
</div>
<b:include name="quickedit">

</b:if>

</b:includable>
</b:widget>

4b. Untuk menampilkan elemen widget hanya pada posting saja maka sisipkan kode berikut ini pada widget blog anda:

<b:if cond='data:blog.pageType == "item"'>
</b:if>

Hasilnya akan terlihat seperti ini:

<b:widget id="HTML45" locked="false" title="Trik Blogger" 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 != """>
</b:if></b:if></b:includable></b:widget><h2 class="title"><data:title></data:title></h2>
<div class="widget-content">
<data:content/>
</div>
<b:include name="quickedit">

</b:if>

</b:includable>
</b:widget>

5. Simpan template anda dan lihat hasilnya

Posted in: Widget