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.

Nah 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.
  • 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 sudahlah 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;
}
Tampilan Posts Populer dengan CCS di atas seperti pada gambar dibawah ini sobat.

Cara Buat Populer Posts Valid HTML5

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.
Perhatian Copas !!! "Mohon bagi anda para sahabat blog, jangan sekali-kali copy paste dengan tanpa mencantumkan link sumber kami dan menulis tanpa anda tulis dalam narasi atau kalimat anda sendiri saya akan mengapus url anda sesuai kebijakan privasi google DMCA/DMCA.com. Atas perhatiannya, saya ucapkan terimakasih."
Next
Previous

No comments

aturan berkomentar pada blog ini !.
1. berkomentarlah dengan baik, sesuai konten yang dibahas dan berkualitas.
2. kalimat yang tidak berkenan saya akan hapus.
3. jika menaruh "LINK HIDUP" akan dimasukan ke folder spam.
4. dilarang mempromosikan produk melalui komentar.

Emoticon