Optimasi SEO pada Widget Popular Posts di Blog

Informasi Teknologi

Optimasi SEO pada Widget Popular Posts di Blog

Optimasi SEO pada Widget Popular Posts di Blog

Seperti yang kita ketahui, bahwa ada banyak sekali rahasia SEO yang sama sekali belum kita ketahui keberadaannya. Seperti halnya rahasia seo saya kali ini yaitu Optimasi SEO pada Widget Popular Posts di Blog.

Trik yang akan diterapkan adalah, membuat widget ini menjadi valid HTML5 sehingga error saat pengecekan pada W3C Markup Validation Service dapat dikurangi, dan untuk memperbaiki SEO Score dilakukan pula penambahan Title Link serta Title Image pada widget ini. Dan widget popular posts yang kita gunakan, menggunakan widget standar, bawaan blogger agar lebih menjadi seo friendly.

Optimasi SEO pada Widget Popular Posts di Blog.

  1. Untuk memulainya, kita harus sudah login ke blogger
  2. Pada halaman Dashboard Blogger pilih menu Template > Edit HTML
  3. Pada halaman Editor Template Blogger klik tombol Jump to widget dan pilih widget popular posts seperti gambar di bawah ini.
  4. Optimasi SEO pada Widget Popular Posts di Blog
  5. Expand kode widget dengan menekan simbol panah warna hitam di bagian kiri halaman editor template blogger, sehingga kode akan terlihat seperti di bawah ini.
  6. <b:widget id='PopularPosts1' locked='false' title='Popular Posts' type='PopularPosts'>
        <b:includable id='main'>
      <b:if cond='data:title'><h3><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;'>
                <!-- (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 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 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>
  7. Agar kode widget ini valid HTML5 hapus kode yang ditulis dengan warna merah.
  8. Selanjutnya tambahkan kode warna biru untuk menampilkan Title Link dan Title Image, sehingga kode widget akan menjadi seperti di bawah ini.
  9.  <b:widget id='PopularPosts1' locked='false' title='Popular Posts' type='PopularPosts'>
        <b:includable id='main'>
      <b:if cond='data:title'><h3><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;'>
                <!-- (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' expr:title='data:post.title' target='_blank'>
    <img expr:alt='data:post.title' 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' 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' expr:title='data:post.title' target='_blank'>
    <img expr:alt='data:post.title' 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' 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>
  10. Simpan perubahan template Anda dengan menekan tombol Save Template.
  11. Jika tidak ingin ribet, langsung copas kode diatas dan ganti kode yang sebelumnya sudah ada.
Cukup sampai disini step by step yang sudah kita selesaikan. Ingat, bahwa Rahasia SEO tidak ada habisnya, masih banyak yang belum kita ketahui entah ada dimana. Maka dari itu jangan pernah terlewat trik blog yang terdapat di Grafitianz Blog.
Terimakasih telah membaca artikel tentang Tips SEO , Tricks Blog dengan judul Optimasi SEO pada Widget Popular Posts di Blog . Anda bisa bookmark artikel ini dengan url http://grafitianz.blogspot.com/2014/01/optimasi-seo-pada-widget-popular-posts.html dan jangan lupa untuk menyebar luaskan artikel ini ke teman-teman bloggers yang lainnya ya :)
Thursday, January 2, 2014
1 komentar

1 komentar :