ada berbagai macam cara yang digunakan sahabat blogger dalam mengimplementasikan script Hrecipe di blognya, salah satunya yaitu memasang script tersebut pada HTML Template dan menambahkan script tambahan pada gambar setiap artikel. menurut saya, cara tersebut tergolong menyusahkan karena kita harus mengedit keseluruhan artikel di blog agar gambar-gambar tersebut terindeks oleh search engine, meletihkan bukan...
cara yang paling tepat yang saya gunakan adalah memasang script hrecipe hanya pada HTML Template dengan tambahan itemtype/itemprop sebagai tembahannya, sehingga tidak mennyulitkan kita dengan mengedit keselurhan artikel, singkat dan mudah bukan...
Baiklah kita langsung ke Cara-nya :
- Buka Template - Centang Expand Template
- Copy kode berikut ini dan letakkan diatas kode ]]></b:skin>
.hrecipe{font:1px oswald;}
- Copy kode berikut ini dan letakkan tepat dibawah kode <body>
<div><div itemscope='' itemtype='http://data-vocabulary.org/Recipe'>
<h3 class='post-title entry-title'>
- setelah ketemu silahkan ganti dengan kode dibawah ini
<span itemprop='itemreviewed'><span itemprop='description'>
<h3 class='post-title entry-title' itemprop='name'>
kemudian tutuplah kode html nya dengan </span></span>
kira-kira seperti ini :
<span itemprop='itemreviewed'><span itemprop='description'>
<h3 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>
</h3>
</span></span>
- Copy kode berikut dan letakkan tepat dibawah kode <data:post.body/>
<div class='hrecipe'>
<span class='item'>
<span class='fn'>AHMAD SUYADI BLOG</span>
</span>
<img class='photo' expr:alt='data:post.title' expr:src='data:post.thumbnailUrl'/>
By <span class='author'><b><data:blog.title/></b></span>
Published: <span class='published'><data:post.timestampISO8601/></span>
<span class='summary'><data:post.title/></span>
<span class='review hreview-aggregate'>
<span class='rating'>
<span class='average'>3</span>
<span class='count'>11</span> reviews
</span>
</span>
</div>
Catatan:
biasanya terdapat 3 buah kode <data:post.body/>, letakkanlah kode tersebut pada kode <data:post.body/> yang pertama.
- Copy kode dibawah ini dan letakkan tepat diatas kode </body>
</div></div>
Jika anda berhasil maka hasilnya akan seperti gambar di bawah ini
Untuk mengecek hasilnya silahkan klik
DISINI
**GOOD LUCK**
Sumber :edukatif.blogspot.com