Cara membuat comment-form menjadi valid HTML5

Kali ini saya selaku admin di blog Shizenku Blogspot akan membagikan sebuah tutorial yang saya beri judul bagaimana cara agar comment-form bawaan blogger bisa menjadi valid HTML5. ketika saya sedang melakukan pengecekan di w3c ternyata bagian comment-form mempunyai 1 error yang sangat susah untuk divalidasi atau bahkan oleh sebagian orang menganggap bahwa comment-form bawaan blogger tidak mungkin bisa untuk di validasi karena sudah bawaan blogger. kebanyakan blog-blog yang valid HTML5 sekarang ini rata-rata mengganti komentarnya menggunakan komentar google plus ada juga yang membuat kotak komentarnya menjadi pop-up dan ada juga yang menggunakan threaded comment yang sudah di modifikasi. Maka dari itu supaya comment-form di blog kalian bisa menjadi valid HTML5 kalian bisa membaca tutorialnya di bawah.

Shizenku.blogspot.com

Berikut ini panduan lengkap cara membuat kotak komentar bawaan blogger menjadi valid html5 :
1. Pertama kalian harus sudah login terlebih dahulu ke blogger
2. Setelah itu pilih menu template
3. Lalu klik menu edit html
4. Kemudian cari kode di bawah ini :

<b:includable id='comment-form' var='post'>

Tetapi jika yang kalian gunakan adalah Threaded Comment, maka kalian cari kode di bawah ini :

<b:includable id='threaded-comment-form' var='post'>

5. Kalau sudah ketemu dengan kode di atas lalu kalian scroll mouse menuju ke bawah sampai kalian menemui kode berikut ini :

<a expr:href='data:post.commentFormIframeSrc' id='comment-editor-src'/>
<iframe allowtransparency='true' class='blogger-iframe-colorize blogger-comment-from-post' frameborder='0' height='410' id='comment-editor' name='comment-editor' src='' style='display: none' width='100%'/>

Kode merah di atas itulah yang menyebabkan comment-form bawaan blogger menjadi tidak valid HTML5 karena kode di atas tersebut tidak bisa kita tambahkan kode amp;
6. Agar comment-form bawaan blogger menjadi valid html5, kalian ganti kode <a expr:href='data:post.commentFormIframeSrc' id='comment-editor-src'/> di atas dengan kode warna orange di bawah ini yang sudah saya ubah menjadi dalam bentuk URL :

    <b:includable id='comment-form' var='post'>
    <div class='comment-form'>
    <a href='#comment-form'/>
    <h5 id='comment-post-message'><data:postCommentMsg/> on <data:post.title/></h5>
    <p><data:blogCommentMessage/></p>
    <data:blogTeamBlogMessage/>
<b:if cond='data:mobile'>
<b:if cond='data:blog.pageType == &quot;item&quot;'>
<a expr:href='&quot;http://www.blogger.com/comment-iframe.g?blogID=2338053908648469715&amp;amp;postID=&quot; + data:post.id + &quot;&amp;amp;m=1&quot;' id='comment-editor-src' rel='nofollow' title='kotak komentar'/> <b:else/>
<b:if cond='data:blog.pageType == &quot;static_page&quot;'>
<a expr:href='&quot;http://www.blogger.com/comment-iframe.g?blogID=2338053908648469715&amp;amp;pageID=&quot; + data:post.id + &quot;&amp;amp;m=1&quot;' id='comment-editor-src' rel='nofollow' title='kotak komentar'/> </b:if> </b:if>
<iframe class='blogger-iframe-colorize blogger-comment-from-post' height='350' id='comment-editor' name='comment-editor' style='border:none;width:100%;'/> <b:else/>
<b:if cond='data:blog.pageType == &quot;item&quot;'>
<a expr:href='&quot;http://www.blogger.com/comment-iframe.g?blogID=2338053908648469715&amp;amp;postID=&quot; + data:post.id' id='comment-editor-src' rel='nofollow' title='kotak komentar'/> <b:else/>
<b:if cond='data:blog.pageType == &quot;static_page&quot;'>
<a expr:href='&quot;http://www.blogger.com/comment-iframe.g?blogID=2338053908648469715&amp;amp;pageID=&quot; + data:post.id' id='comment-editor-src' rel='nofollow' title='kotak komentar'/> <b:else/>
<a expr:href='data:post.commentFormIframeSrc' id='comment-editor-src' rel='nofollow' title='kotak komentar'/>
</b:if> </b:if> </b:if>
<iframe class='blogger-iframe-colorize blogger-comment-from-post' height='410' id='comment-editor' name='comment-editor' style='border:none;width:100%;'/>
<data:post.friendConnectJs/>
    <data:post.cmtfpIframe/>
<script>BLOG_CMT_createIframe(&#39;<data:post.appRpcRelayPath/>&#39;,&#39;<data:post.communityId/>&#39;);</script>
  </div>
</b:includable>

Kode di atas jika dilihat memang lebih banyak dibandingkan kode bawaan blogger karena kode di atas di gunakan pada :

• Comment-form artikel dekstop version
• Comment-form halaman statis dekstop version
• Comment-form artikel mobile version
• Comment-form halaman statis mobile version

Tetapi tenang saja sahabat blogger semua karena kode di atas tidak akan memberatkan blog kalian, karena semua kodenya tidak di pakai bersamaan. hanya salah satu saja tergantung kondisi halaman yang sedang dilihat oleh pengunjung.
7. Setelah itu kalian ganti kode merah dengan kode blogID blogger. Kode blogID bisa kalian lihat pada url blogger ketika kita login. contoh :

http://www.blogger.com/blogger.g?blogID=2338053908648469715#editor/target=post;postID=2576453827194113063;onPublishedMenu=posts;onClosedMenu=posts;postNum=0;src=link

8. Lalu yang terakhir kalian hanya perlu klik simpan template.
9. Selesai

  Untuk memastikan bahwa comment-form sudah tidak error lagi maka kalian cek di w3c validator, saya jamin pasti comment-formnya valid html5. Karena kode di atas juga saya terapkan di blog ini. Semoga artikel yang berjudul Cara membuat comment-form menjadi valid HTML5 ini bermanfaat buat anda. Sampai bertemu lagi di artikel selanjutnya.