Membuat Widget Popular Posts SEO Friendly plus Default Thumbnail Image

Baca Juga

Cara Memasang Widget Popular Posts SEO Friendly plus Default Thumbnail Image untuk Blog.

MELENGKAPI posting sebelumnya, Menambahkan Default Image Thumbnail di Popular Posts Blog, berikut ini kode lengkap popular post seo friendly plus thumbnail image default. Anda tinggal replace kode popular post yang sudah ada.

Widget popular post (tulisan terpopuler) merupakan salah satu menu widget wajib pasang di blog. Widget ini menampilkan daftar posting yang paling banyak dibaca atau dikunjungi.

Namun, jika Anda menampilkan popular plus lengkap, yakni judul, gambar, plus ringkasan (snippet), kadang menimbulkan masalah dalam hal seo blog. Skor SEO di CHKME biasanya berkurang jika blog Anda menggunakan popular post judul, gambar (thumbnail image), dan ringkasan.

Yang mengurangi skor seo ita adalah deskripsi thumbnail image yang secara default tidak dilengkapi meta deskripsi (image description/alternative text).

Maka, berikut ini kode popular post seo friendly sebagai solusi atas widget popular post yang tidak seo friendly.

KODENYA

   <b:widget id='PopularPosts1' locked='true' 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 expr:alt='data:post.title' expr:height='data:thumbnailSize' expr:src='data:post.thumbnail' expr:width='data:thumbnailSize'/>
                  </a>
                </div>
<b:else/>
     <div class='item-thumbnail'>
      <a expr:href='data:post.href' target='_blank'>
       <img expr:alt='data:post.title' expr:height='data:thumbnailSize' expr:width='data:thumbnailSize' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjvskdWfmv10A7tqPNTdskXf33qIYUB_gtoWRW7vElrsyCrQaEoeARBqQ9M_inhrqYd1JrbXNBU6mlfQXkEzX_Zef_8Ga1G_WvJDWATshsON-jlcuZAb_jwIO3vlUaeun2TD2B-xvQ74vqP/s72-Ic42/no-image-available-default-72.png' width='72'/>
      </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 expr:alt='data:post.title' expr:height='data:thumbnailSize' expr:src='data:post.thumbnail' expr:width='data:thumbnailSize'/>
                  </a>
                </div>
    <b:else/>
     <div class='item-thumbnail'>
      <a expr:href='data:post.href' target='_blank'>
       <img expr:alt='data:post.title' expr:height='data:thumbnailSize' expr:width='data:thumbnailSize' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjvskdWfmv10A7tqPNTdskXf33qIYUB_gtoWRW7vElrsyCrQaEoeARBqQ9M_inhrqYd1JrbXNBU6mlfQXkEzX_Zef_8Ga1G_WvJDWATshsON-jlcuZAb_jwIO3vlUaeun2TD2B-xvQ74vqP/s72-Ic42/no-image-available-default-72.png' width='72'/>
      </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>
  </div>
</b:includable>
   </b:widget>

CARA PASANG
1. Template > Edit HTML
2. Cari kode yang diawali <b:widget id='PopularPosts1' hingga kode penutup  </b:widget>
3. Hapus kode tersebut dan replace (ganti) dengan kode di atas.
4. Save template!

Untuk mengatur kembali jumlah popular post yang ditampilkan, klik Layout > Edit Widget Popular Post. Good luck! (http://www.contohblog.com).*