Membuat Widget Popular Post Jadi SEO Friendly

Baca Juga

WIDGET Popular Posts, posting terpopuler, atau artikel/entri terpopuler merupakan "menu wajib" yang harus ada di sidebar blog. Hampir semua template, termasuk template bawaan blogger, sudah memasangnya sehingga widget ini otomatis akan muncul di sidebar.

Popular posts berfungsi sebagai Navigasi sekaligus Internal Link yang memudahkan pengunjung mengeksplorasi konten blog.

Google juga menyarankan di blog kita ada navigasi/internal link untuk memudahkan indexing mesin pencari sekaligus memudahkan pembaca dan bisa meningkatkan PageViews.

Karena biasnaya widget popular post sudah otomatis ada di sidebar, maka kita tingga mengkonfigurasinya dengan klik "edit" dan pilih:

1. Jumlah link posting yang akan ditampilkan, antara 1-10 judul tulisan.
2. Ditampilkan judul saja, judul plus thumbnail image, atau judul, thumbnail, dan snippets (kutipan isi tulisan).
3. Sebaiknya, biar loading blog cepat, tampilkan judul saja.

SUDAHK SEO FRIENDLY?
Masalahnya, sudahkah widget populer post ini SEO Friendly dan Valid HTML?

Ternyata, banyak kode widget Popular Posts yang tidak SEO Friendly sehingga mengurangi skor seo blog, terutama jika popular posts ditampilkan lengkap: judul, thumbnail image, dan snippets atau summary.

Cara Membuat Widget Popular Post Jadi SEO Friendly

Berikut ini cara membuat Cara Membuat Widget Popular Post Jadi SEO Friendly.

1. Template > Edit HTML
2. Cari (Ctrl+F) kode Popular Post1 yang diawali dengan kode <b:widget id='PopularPosts1' ... dst. hingga kode penutup </b:widget> berikut ini:

<b:widget id='PopularPosts1' locked='false' title='Popular Posts' type='PopularPosts'>
<b:includable id='main'>
<b:if cond='data:title'><h2><data:title/></h2></b:if>
<div class='widget-content popular-posts'>
<ul>
<b:loop values='data:posts' var='post'>
<li>
<b:if cond='data:showThumbnails == &quot;false&quot;'>
<b:if cond='data:showSnippets == &quot;false&quot;'>
<!-- (1) No snippet/thumbnail -->
<a expr:href='data:post.href'><data:post.title/></a>
<b:else/>
<!-- (2) Show only snippets -->
<div class='item-title'><a expr:href='data:post.href'><data:post.title/></a></div>
<div class='item-snippet'><data:post.snippet/></div>
</b:if>
<b:else/>
<b:if cond='data:showSnippets == &quot;false&quot;'>
<!-- (3) Show only thumbnails -->
<div class='item-thumbnail-only'>
<b:if cond='data:post.thumbnail'>
<div class='item-thumbnail'>
<a expr:href='data:post.href' target='_blank'>
<img alt='' border='0' expr:height='data:thumbnailSize' expr:src='data:post.thumbnail' expr:width='data:thumbnailSize'/>
</a>
</div>
</b:if>
<div class='item-title'><a expr:href='data:post.href'><data:post.title/></a></div>
</div>
<div style='clear: both;'/>
<b:else/>
<!-- (4) Show snippets and thumbnails -->
<div class='item-content'>
<b:if cond='data:post.thumbnail'>
<div class='item-thumbnail'>
<a expr:href='data:post.href' target='_blank'>
<img alt='' border='0' expr:height='data:thumbnailSize' expr:src='data:post.thumbnail' expr:width='data:thumbnailSize'/>
</a>
</div>
</b:if>
<div class='item-title'><a expr:href='data:post.href'><data:post.title/></a></div>
<div class='item-snippet'><data:post.snippet/></div>
</div>
<div style='clear: both;'/>
</b:if>
</b:if>
</li>
</b:loop>
</ul>
<b:include name='quickedit'/>
</div>
</b:includable>
</b:widget>

Keterangan:

• Kode <h2> yang berwarna biru adalah Heading Tags untuk judul widget Popular Post. Bisa jadi di template Anda bukan h2, tapi h3 atau h4. Ingat-ingat saja, nanti sesuaikan dengan kode pengganti yang di bawah ini.
• Kode yang di-highlight warna merah adalah "sumber masalah" yang menjadikan widget Popular Posts tidak seo friendly dan tidak valid HTML. Makanya, harus diubah atau diganti.

3. Setelah SEMUA kode tersebut dihapus, COPAS kode berikut ini di tempat yang sama:

<b:widget id='PopularPosts1' locked='false' title='Popular Posts' type='PopularPosts'>
<b:includable id='main'>
<b:if cond='data:title'><h2><data:title/></h2></b:if>
<div class='widget-content popular-posts'>
<ul>
<b:loop values='data:posts' var='post'>
<li>
<b:if cond='data:showThumbnails == &quot;false&quot;'>
<b:if cond='data:showSnippets == &quot;false&quot;'>
<!-- (1) No snippet/thumbnail -->
<a expr:href='data:post.href' expr:title='data:post.title'><data:post.title/></a>
<b:else/>
<!-- (2) Show only snippets -->
<div class='item-title'><a expr:href='data:post.href' expr:title='data:post.title'><data:post.title/></a></div>
<div class='item-snippet'><data:post.snippet/></div>
</b:if>
<b:else/>
<b:if cond='data:showSnippets == &quot;false&quot;'>
<!-- (3) Show only thumbnails -->
<div class='item-thumbnail-only'>
<b:if cond='data:post.thumbnail'>
<div class='item-thumbnail'>
<a expr:href='data:post.href' target='_blank'>
<img expr:alt='data:post.title' expr:height='data:thumbnailSize' expr:src='data:post.thumbnail' expr:width='data:thumbnailSize' expr:title='data:post.title'/>
</a>
</div>
</b:if>
<div class='item-title'><a expr:href='data:post.href' expr:title='data:post.title'><data:post.title/></a></div>
</div>
<div style='clear: both;'/>
<b:else/>
<!-- (4) Show snippets and thumbnails -->
<div class='item-content'>
<b:if cond='data:post.thumbnail'>
<div class='item-thumbnail'>
<a expr:href='data:post.href' target='_blank'>
<img expr:alt='data:post.title' expr:height='data:thumbnailSize' expr:src='data:post.thumbnail' expr:width='data:thumbnailSize' expr:title='data:post.title'/>
</a>
</div>
</b:if>
<div class='item-title'><a expr:href='data:post.href' expr:title='data:post.title'><data:post.title/></a></div>
<div class='item-snippet'><data:post.snippet/></div>
</div>
<div style='clear: both;'/>
</b:if>
</b:if>
</li>
</b:loop>
</ul>
</div>
</b:includable>
</b:widget>

4. Save Template!

Demikian Cara Membuat Widget Popular Posts Jadi SEO Friendly dan Valid HTML yang akan kian memudahkan dan mempercepat mesin pencari mengindeks blog Anda. Good Luck!