ataupun dengan Rdfa namun kali ini yang akan saya bahas dalam artikel ini adalah kode dari microformats yang sudah saya uji coba dan valid html5 yaitu:
- Hreview Aggregate yang berfungsi untuk membuat jumlah rating dan user count atau review dapat terbaca dan muncul di mesin penelusuran google
- Hrecipe yang mana fungsi sebenarnya adalah untuk menyampaikan bahwa blog atau postingan tersebut secara khusus membahas tentang cara memasak atau membuat menu atau resep dari sebuah masakan atau makanan tertentu, kelebihan utama dari menggunakan kode ini adalah dapat menampilkan gambar atau foto yang dapat muncul di hasil mesin pencarian google.
Jadi untuk memunculkan rating dan gambar atau foto postingan secara bersamaan di hasil pencarian Google search engine maka kode microformats hrecipe dan hreview aggregate harus digabungkan atau dikombinasikan menjadi satu, berikut ini adalah kode yang sudah dikombinasikan
...
<b:if cond='data:blog.pageType == "item"'>
<strong class='fn'>
- <section class='hrecipe'>
<a expr:href='data:post.url' expr:title='data:post.title'><data:post.title/></a></strong>
<div class='post-header' style='color: #fff;'>
<span class='post-author vcard'>
<b:if cond='data:top.showAuthor'>
<data:top.authorLabel/>
<span class='author fn'><data:post.author/></span>
</b:if> at
</span>
<span class='post-timestamp updated'>
<b:if cond='data:top.showTimestamp'>
<b:if cond='data:post.url'>
<span expr:title='data:post.timestampISO8601'><data:post.timestamp/></span>
</b:if></b:if></span><br/>
<img class='photo' expr:alt='data:post.title' expr:src='data:post.thumbnailUrl' expr:title='data:post.title' style='padding:10px; float:left;'/>
<span class='summary' style='color: #8A8888;'><data:blog.metaDescription/></span></div>
<p class='duration' ><span class='value-title' title='PT0H25M'>25</span></p>
<span class='item'>
- <div class='hreview-aggregate'>
<span class='url fn'>
<a class='taggedlink url' expr:href='data:post.url' expr:title='data:post.title' rel='tag'><data:post.title/></a></span><br/></span><span class='reviewer hcard'><data:post.author/></span>
<abbr class='updated dtreviewed' expr:title='data:post.timestampISO8601'><data:post.dateHeader/></abbr>
<span class='rating'>5</span>
<span class='votes'>2013</span>
</span>
</span>
</div>
</section>
</b:if>
setelah selesai Klik preview dan jika tidak terjadi error langsung saja klik save dan simpan template anda
untuk menguji pemasangan kode sudah tepat atau belum, copy salah satu url postingan blog anda dan paste di kolom Google structure data testing tool di link berikut: Rich snippet kode tersebut diatas sudah teruji dan valid html5 bisa anda lihat diblog experimen taufan yang juga menggunakan kode ini.