» » Cara Menampilkan Gambar pada SERP Menggunakan Recipe Snippet

Cara Menampilkan Gambar pada SERP Menggunakan Recipe Snippet

Diposting oleh Mr.X on Senin, 24 September 2012

Cara Menampilkan Gambar pada SERP Menggunakan Recipe Snippet - Kali ini saya akan memberikan tutorial bagaimana sih caranya menampilkan gambar pada hasil pencarian search engine? nah untuk menampilkannya itu cukup mudah, hanya membutuhkan sedikit penambahan microdata pada template dan postingan. oh iya, bagi yang sebelumnya sudah memasang review snippets, maka anda harus menghapus dulu kode-kode yang sudah terpasang pada template, karena kali ini kita akan menggunakan kode bara untuk mendukung tutorial ini. [ demo bisa di lihat di http://x-laptopreviews.blogspot.com/ ]



Langsung saja untuk memasang kode-kodenya silahkan ikuti langkah-langkah berikut,
Cari kode <body> dan masukkan kode <div><div itemscope='' itemtype='http://data-vocabulary.org/Recipe'> di bawah kode <body>
kemudian cari kode </body> dan masukkan kode </div></div> di atas kode </body>

Cari kode <h1 class='post-title dan letakkan kode <span itemprop='itemreviewed'><span itemprop='description'> di atas kode <h1 class='post-title
kemudian cari kode </h1> dan letakkan kode </span></span> di bawah kode </h1>
Masukkan kode itemprop='name' pada tag heading

Karena setiap template memiliki kode yang berbeda, jadi usahakan lebih teliti dalam mencari kode yang mirip dengan kode di atas. untuk mempermudah penjelasan, nanti hasil akhir kode akan seperti ini,

<span itemprop='itemreviewed'><span itemprop='description'>
      <h1 class='post-title entry-title' itemprop='name'>
     <b:if cond='data:post.link'>
       <a expr:href='data:post.link'><data:post.title/></a>
     <b:else/>
        <b:if cond='data:post.url'>
          <a expr:href='data:post.url'><data:post.title/></a>
        <b:else/>
          <data:post.title/>
        </b:if>
     </b:if>
      </h1>
</span></span>

Sekarang agar gambar bisa muncul, anda harus memasukkan tag itemprop="photo" pada pada kode html gambar ( <img ... ). kemudian anda juga harus memasukkan microdata review aggregate pada postingan. berikut adalah kodenya,

<span itemprop="review" itemscope="" itemtype="http://data-vocabulary.org/Review-aggregate">Rating Artikel : <span itemprop="rating">5</span>
Jumlah Voting : <span itemprop="count">99</span> Orang
</span>

Oke, terima kasih telah membaca artikelku yang berjudul Cara Menampilkan Gambar pada SERP Menggunakan Recipe Snippet. semoga berhasil, dan mudah2an aja blogger yang membaca postingan ini bisa menghargai kerja keras berjam-jam untuk mempelajari microdata dan membuat artikel ini :-P
Label: