Shizenku Blog

Informasi unik, populer dan menarik lainnya

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.
Comment-form bawaan blogger
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.


Cara membuat comment-form menjadi valid HTML5
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 b...

19 komentar : Cara membuat comment-form menjadi valid HTML5

Diposting oleh 
 · mengatakan...

Komentar ini telah dihapus oleh administrator blog.

Diposting oleh 
 · Admin mengatakan...

@Siti Sukanah : iya mbak, . silahkan kalo mau ngetes komen. . he he

Diposting oleh 
 · mengatakan...

thanks for sharing mas, amat mebantu

Diposting oleh 
 · Admin mengatakan...

@Adib Site : Ok gan, sama-sama he he. makasih atas kunjungannya :D

Diposting oleh 
 · mengatakan...

Mas kok saya engga ada kode seperti itu yah? pusing banget.
mohon pencarahanya teman :)

Diposting oleh 
 · Admin mengatakan...

@Muhammad Luthfi : gx ada kodenya di langkah nomer brapa gan ,. ?

Diposting oleh 
 · mengatakan...

Saya sudah mencobanya tapi jadi ilang komentarnya mas

Diposting oleh 
 · Admin mengatakan...

@Muhammad Luthfi : ilang atau error gan, kalo error biasanya ada keterangannya bahwa error tersebut di sebabkan oleh kesalahan kode apa.
Tips : jangan lupa mengganti kode merah ( 2338053908648469715 ) di atas dengan kode Blogger ID blog sobat. . :D

Diposting oleh 
 · mengatakan...

Kode yang harus dicari, dua-duanya ada pada blog saya.
Kode yang harus di ganti, juga ada dua.
Bagaimana nih gan solusinya ?
Oh ya, blog saya satu-untuk-semuanya.blogspot.com.

Diposting oleh 
 · Admin mengatakan...

gini lho om, di blog itu kita bisa pake comment dan threaded-comment...
setelah blog-nya om ane cek, sepertinya menggunakan comment..
jadi pada langkah nomer 4 diatas kan ada 2 pilihan : om cari kode awal..
kode yg ini lho : <b:includable id='comment-form' var='post'>

kode yg ada di langkah nomer 5 memang ada 2 yang satu ada di comment yg satunya lagi ada di threaded-comment..
om cari yg ada di comment... :D

Diposting oleh 
 · mengatakan...

Masih tetap utak atik template biar form komentar nya bisa valid html5 :)
btw, baru sempat berkunjung lagi di blog ini dan juga baru sempat ucapkan Selamat Idul Fitri buat mas Budiyanto Simo. Mohon maaf lahir dan batin mas ya... :D

Diposting oleh 
 · Admin mengatakan...

Mohon maaf lahir dan batin juga ya om... :)

Diposting oleh 
 · mengatakan...

Komentar ini telah dihapus oleh administrator blog.

Diposting oleh 
 · Admin mengatakan...

sama sama gan... :)

Diposting oleh 
 · mengatakan...

Komentar ini telah dihapus oleh administrator blog.

Diposting oleh 
 · Admin mengatakan...

jangan bercanda gan.. putralief-cyber itu bukan platform blogspot. domainnya aja yg blogspot.. :cd:

Diposting oleh 
 · mengatakan...

Nampak saya harus coba tips artikel neh gan buay blog saya www.seratblog.ga

Diposting oleh 
 · Admin mengatakan...

silahkan dicoba gan.. semoga berhasil yak .. ^__^ :D

Diposting oleh 
 · mengatakan...

Komentar ini telah dihapus oleh pengarang.

Posting Komentar : Cara membuat comment-form menjadi valid HTML5

Baca dulu Peraturan Berkomentar di Blog Ini ! Supaya komentar anda tak sia-sia. Admin sangat senang jika tidak ada komentar yang mengandung spam :)

.::Peraturan Berkomentar::.

• Gunakan bahasa dan kata-kata yang sopan dan tidak menyinggung semua pihak manapun, baik ketika dilihat anak kecil maupun orang dewasa.
• Usahakan untuk tidak menggunakan kata-kata yang menyinggung RAS, SARA, dan berbau P*RNO.
• Dilarang menaruh link Aktif di dalam kotak komentar.
• Berkomentar Out Of Topic atau Oot saya perbolehkan apabila komentar tersebut berupa pertanyaan penting, asalkan tidak berlebihan dan tidak berbau SPAM!

Komentar akan dibalas paling lambat 3 hari kemudian. Terimakasih atas perhatiannya.
Widgets
Lisensi Creative Commons
Copyright © 2012 . Simo Responsive Template Design oleh . Publisher oleh Shizenku Blog.
Powered by Blogger and AMP ⚡ HTML