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
Tidak ada komentar:
Posting Komentar