PASANG IKLAN D BLOG

EKO Mr. GALAU 2012

mari kita belajar bersama mempercantik blog HTML ekonovabudisaputro.blogspot.com
JANGANLAH TAKUT AKAN JATUH CINTA KARENA SEMUA ORANG PASTI PERNAH MERASAKAN SAKIT HATI.
HTML mr. galau.com

Pasang Iklan di Sebelah Kotak Komentar

1 Apr 2012

Ditulis Oleh: eko Mr. GALAU 4.5 di Minggu, April 01, 2012

بِسْــــــــــــــــمِ اﷲِالرَّحْمَنِ اارَّحِيم

Artikel Pasang Iklan di Sebelah Kotak Komentar ini saya tulis atas request sahabat Muro'i El-Barezy  pada artikel Cara Menyisipkan Iklan pada Postingan. Beliau sudah beberapa kali mencobanya, namun belum berhasil jua.

Beberapa kali saya coba selalu gagal dan gagal lagi, sehingga saya hold dulu saja. Kali ini saya mencoba lagi meracik script html seperti yang diharapkan sobat Muro'i  dan Alhamdulillah berhasil setelah saya test di blog khusus buat trial script.




Sebelum coding, kita tinjau dulu logikanya yaitu dimana kita ingin menampilkan iklan di sebelah kotak komentar, kita harus membuat tabel yang terdiri dari satu baris dan dua kolom. Skemanya kira-kira seperti gambar berikut.

OK langsung saja pada tutorialnya kalau sudah mengerti logiknya.

1. Login ke dasbor.
2. Pilih Template ==> Edit HTML =>beri tanda centang Expand Template Widget
3. Cari blok code berikut ini dengan kunci pencarian "comment-post-message" tanpa tanda kutip.
   
   
   <b:if cond='data:mobile'> <h4 id='comment-post-message'> <a expr:id='data:widget.instanceId + &quot;_comment-editor-toggle-link&quot;' href='javascript:void(0)'><data:postCommentMsg/></a></h4> <p><data:blogCommentMessage/></p> <data:blogTeamBlogMessage/> <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%'/> <b:else/> <h4 id='comment-post-message'><data:postCommentMsg/></h4> <p><data:blogCommentMessage/></p> <data:blogTeamBlogMessage/> <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='' width='100%'/> </b:if>
4. Perhatikan pada kode tag <iframe ,,,,,  disana ada dua yang biru untuk tampilan di mobile phone dan yang merah untuk di web desktop. Kita hanya pakai yang di web saja yaitu yang merah.
5. Copy code tabel html berikut ke notepad anda
   
   
   <table border='0' width='600'><tr> <td align='center'>SISIPKAN DISINI IFRAME KOTAK KOMENTAR</td><td valign="top" align='center'>SISIPKAN  KODE IKLAN DISINI</td></tr></table>
6. Overwrite atau timpah kalimat "SISIPKAN DISINI IFRAME KOTAK KOMENTAR" dengan code iframe lihat pada point 3 di atas, sehingga code tabel menjadi seperti berikut.
   
   
   <table border='0' width='600'><tr> <td align='center'><iframe allowtransparency='true' class='blogger-iframe-colorize blogger-comment-from-post' frameborder='0' height='410' id='comment-editor' name='comment-editor' src='' width='100%'/></td><td valign="top" align='center'>SISIPKAN  KODE IKLAN DISINI</td></tr></table>
   
   
   

7. Lebar tabel pada contoh di atas 600 pixel, sesuaikan dengan lebar area postingan blog anda. 
8. Kemudian  timpah kalimat "SISIPKAN  KODE IKLAN DISINI" dengan script iklan yang anda miliki.
9. Terakhir code iframe pada template anda lihat pada point 3 yang berwarna merah timpah dengan code tabel yang sudah lengkap yang anda coding di notepad tadi, sehingga terlihat seperti berikut ini
   
   
   <b:if cond='data:mobile'> <h4 id='comment-post-message'> <a expr:id='data:widget.instanceId + &quot;_comment-editor-toggle-link&quot;' href='javascript:void(0)'><data:postCommentMsg/></a></h4> <p><data:blogCommentMessage/></p> <data:blogTeamBlogMessage/> <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%'/> <b:else/> <h4 id='comment-post-message'><data:postCommentMsg/></h4> <p><data:blogCommentMessage/></p> <data:blogTeamBlogMessage/> <a expr:href='data:post.commentFormIframeSrc' id='comment-editor-src'/> <table border='0' width='600'><tr> <td align='center'><iframe allowtransparency='true' class='blogger-iframe-colorize blogger-comment-from-post' frameborder='0' height='410' id='comment-editor' name='comment-editor' src='' width='100%'/></td><td valign="top" align='center'>SISIPKAN  KODE IKLAN DISINI</td></tr></table> </b:if>
10. Apabila iklan belum muncul, coba anda setting lebar kolom masing-masing, misal kolom kotak komentar 75% dan untuk iklan 25%. Sehingga code kolomnya menjadi  <td width='75%' align='center'>  dan <td width='25%' valign="top" align='center'>
11. Jika terjadi galat, coba script iklannya di parse dulu dengan menggunakan tool  Script Parse HTML

EKO Mr.GALAU 2012