Cara Mengubah Posts Populer pada Blog agar Valid HTML5


Posts populer adalah suatu fitur pada blogger yang saya ketahui, untuk melihat apa yang sedang populer, terlaris, atau artikel yang banyak dicari serta dikunjungi pada blog anda. Dengan memasangkan Posts Populer yang valid HTML5 yang pasti berguna untuk mempercepat loading pada blog anda, dan memudahkan pengunjung apa yang terpopuler atau sering dikunjungi pada artikel blog anda, oleh setiap pengunjung blog. Juga berguna untuk meningkatkan kualitas SEO pada blog, meskipun pada dasarnya dampaknya sedikit, akan tetapi lama-lama akan menjadi bukit sobat.

Cara Buat Populer Posts Valid HTML5

Sebenarnya, SEO pada blog itu tergantung pada kata kunci artikel dan kata kunci yang sudah anda buat pada metag, itu harus selalu terhubung kata-katanya. Apa lagi sekarang abang google sudah mengganti cara penelusuran pada alogaritma mesin telusurnya. Saya sarankan anda harus menaruh deskripsi pada setiap postingan artikel anda dengan desripsi yang teksnya menyangkut dengan keyword blog anda.

So, sekarang anda sudah tahu bukan, bahwa kualitas SEO yang paling bagus atau baik itu bagaimana?. Sekarang saya akan memberikan cara membuat posts populer pada blog anda valid HTML5.

Dan dibawah ini adalah cara-caranya, silahkan anda baca lebih lanjut.


Cara Membuat Posts Populer Valid HTML5

  • Masuk ke bagian Tempelate blog, lalu Back Up dulu untuk mencegah terjadi kesalahan.
  • Lalu cari kode widget pada HTML blog anda seperti kode dibawah ini.
<b:widget id='PopularPosts1' locked='false' title='Popular News' type='PopularPosts'>
<b:includable id="main">
<b:if cond="data:title"><h3>
<data:title></data:title></h3>
</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;">
<a expr:href="data:post.href" href="https://draft.blogger.com/blogger.g?blogID=2115662217276705048&amp;pli=1"><data:post .title=""></data:post></a>
<b:else>
<div class="item-title">
<a expr:href="data:post.href" href="https://draft.blogger.com/blogger.g?blogID=2115662217276705048&amp;pli=1"><data:post .title=""></data:post></a></div>
<div class="item-snippet">
<data:post .snippet=""></data:post></div>
</b:else></b:if>
<b:else>
<b:if cond="data:showSnippets == &quot;false&quot;">
<div class="item-thumbnail-only">
<b:if cond="data:post.thumbnail">
</b:if>
<br />
<div class="item-thumbnail">
<a expr:href="data:post.href" href="https://draft.blogger.com/blogger.g?blogID=2115662217276705048&amp;pli=1" target="_blank">
<img alt="" border="0" expr:height="data:thumbnailSize" expr:src="data:post.thumbnail" expr:width="data:thumbnailSize" />
</a>
</div>
<div class="item-title">
<a expr:href="data:post.href" href="https://draft.blogger.com/blogger.g?blogID=2115662217276705048&amp;pli=1"><data:post .title=""></data:post></a></div>
</div>
<div style="clear: both;">
<b:else>
</b:else>
<br />
<div class="item-content">
<b:if cond="data:post.thumbnail">
</b:if>
<br />
<div class="item-thumbnail">
<a expr:href="data:post.href" href="https://draft.blogger.com/blogger.g?blogID=2115662217276705048&amp;pli=1" target="_blank">
<img alt="" border="0" expr:height="data:thumbnailSize" expr:src="data:post.thumbnail" expr:width="data:thumbnailSize" />
</a>
</div>
<div class="item-title">
<a expr:href="data:post.href" href="https://draft.blogger.com/blogger.g?blogID=2115662217276705048&amp;pli=1"><data:post .title=""></data:post></a></div>
<div class="item-snippet">
<data:post .snippet=""></data:post></div>
</div>
<div style="clear: both;">
</div>
</div>
</b:if>
</b:else></b:if>
</li>
</b:loop>
</ul>
<b:include name="quickedit">
</b:include></div>
</b:includable>
</b:widget>
  • Bila sudah ketemu, silahkan hapus kode widget Posts Populer yang ada pada HTML blog anda, dengan kode widget Posts Populer dibawah 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' 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:title='data:post.title' expr:width='data:thumbnailSize'/>
                  </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:title='data:post.title' expr:width='data:thumbnailSize'/>
                  </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>
  • Bila sudah anda ganti, silahkan tekan Save atau simpan.
Selesai sudah masalah anda mengenai Cara Mengubah Posts Populer pada Blog agar Valid HTML5. Sekarang mungkin anda tinggal mengubah CCS Posts Populernya dibawah ini. Yaitu caranya tinggal anda ganti kode CCS Populer pada Blog anda sebelumnya dengan kode CCS dibawah ini.
.popular-posts ul {
    margin: 0 0;
    padding: 5px;
}
.popular-posts li {
    list-style: none;
    border: 1px solid transparent;
    margin-bottom: 5px;
    border-bottom: 1px dotted #5A5A5A;
}
.popular-posts li:hover {
    background: #131313;
    border: 1px solid #131313;
    border-radius: 2px;
}
.popular-posts .item-title {
    font: 12px arial, sans-serif, time new roman;
}
.popular-posts .item-snippet {
    font: 11px arial,sans-serif,time new roman;
}

Bila Posts Populer pada blog anda ingin ada tumbnail gambarnya, silahkan saja edite sesuai dengan keinginan anda (bila yang sudah tahu caranya). Dan bila anda yang belum tahu caranya, silahkan saja bertanya pada kotak komentar dibawah ini.


No comments:

Sebelum menuliskan komentar, Anda harus baca syarat dibawah ini :
1. Tidak diperbolehkan menaruh link aktif,
2. Tidak boleh ada unsur huru hara dan pornograpi,
3. Jika membuat spam, komentar Anda akan dihapus, dan
4. Silahkan bertanya dan berbagi pikiran dengan kalimat yang baik dan membangun.

AK NEW SITE. Powered by Blogger.