Cara Biar Kolom Komentar Blog Bisa Disisipi Gambar

Cara Agar Bisa Memasukkan Gambar Di Komentar Blog - Pada umumnya kotak komentar yang tersedia di template default tidak memiliki elemen khusus untuk bisa disisipi gambar atau image. Kotak komentar yang sering kita lihat pada blog blog orang lain paling hanya bisa disisipi oleh smiley atau sejenis emoticon sebagai bagian dari gambaran ungkapan si pemberi komentar.

Nah, kali ini akan saya bahas mengenai caranya kotak komentar supaya bisa disisipi gambar gambar tertentu supaya lebih cantik dilihat. Contoh demonya bisa dilihat di kolom komentar saya di bawah

1. Login ke akun Blogger
2. Pilih Template > Edit HTML
3. Cari kode </body> kemudian letakkan script dibawah ini tepat diatasnya:


<script type='text/javascript'>
//<![CDATA[
function repText(id) {
var a = document.getElementById(id),
 b = a.innerHTML,
 b = b.replace(/<i rel="image">(.[^\>]*)<\/i>/ig, "<img class='cm-image' src='$1' alt='loading...' \/>");
 b = b.replace(/\[img\](.[^\]]*)\[\/img\]/ig, "<img class='cm-image' src='$1' alt='loading...' \/>");

 document.getElementById(id).innerHTML = b;
 b = b.replace(/<i rel="code">(.*?)<\/i>/ig, "<code>$1<\/code>");
 b = b.replace(/<i rel="pre">(.*?)<\/i>/ig, "<pre>$1<\/pre>");
 b = b.replace(/<b rel="quote">(.*?)<\/b>/ig, "<blockquote>$1<\/blockquote>");
 b = b.replace(/&amp;feature=[0-9a-zA-Z-_]*/ig, "");
 b = b.replace(/\/s(640|1600)/g, "/s400");
 } repText('comment-holder'); 
c = document.getElementById('comment-holder');
if (c) {
 b = c.getElementsByTagName("p");
 for (i = 0; i < b.length; i++) {
  if (b.item(i).getAttribute('CLASS') == 'comment-content') {
   ki_comm = b.item(i).innerHTML.replace(/\[code\](.[^\]]*)\[\/code\]/ig, "<code>$1<\/code>");
   ki_comm = ki_comm.replace(/\[pre\](.[^\]]*)\[\/pre\]/ig, "<pre>$1<\/pre>");
   ki_comm = ki_comm.replace(/\[blockquote\](.[^\]]*)\[\/blockquote\]/ig, "<blockquote>$1<\/blockquote>");
   ki_comm = ki_comm.replace(/\[quote\](.[^\]]*)\[\/quote\]/ig, "<blockquote>$1<\/blockquote>");        
   b.item(i).innerHTML = ki_comm;
  }
 }
}
//]]>
</script> 

4. Simpan Template.
5. Nah untuk memasukan file gambar di kolom komentarnya, anda cukup meletakkan kode dibawah ini

<i rel="image">URL Gambar Anda</i>

atau


[img]URL Gambar Anda[/img]



6. Tulisan berwarna Merah adalah kode URL gambar yang Anda inginkan.
7. Lalu lihat hasilnya, Gambar anda akan tampil ketika komentar anda sudah diluncurkan.

Selamat Mencoba! Tolong di share juga ya :)

Google Facebook Twitter More

• Pinterest
• Digg
• Linkedin
• Stumbleupon
• Delicious
• Tumblr
• BufferApp
• Pocket
• Evernote

Artikel Terkait

• Membuat Gallery Foto di Postingan Blog Cara mengupload foto yang kita pakai di postingan blogger biasanya tidak begitu memuaskan karena gambar yang kita uplo
• Cara Mengetahui Alamat URL Feed Blog Mungkin diantara sebagian Blogger belum ada yang mengetahui caranya melihat alamat URL feed blog sendiri. Padahal sang
• Cara Setting Jadwal Postingan Otomatis di Blog Update postingan secara rutin dan berkala adalah kewajiban seorang blogger untuk mendatangkan traffik pengunjung. Namu
• Cara Menambah 3 Kolom di Bawah Header Sebelumnya saya pernah memuat artikel tentang Cara Menambah 1 Kolom di Bawah Header dan Cara Menambah 2 Kolom di Bawah
• Cara Menambah 2 Kolom di Sidebar Blog Fungsi elemen yang banyak di sebuah blog adalah agar kita bisa menempatkan beberapa buah widget sesuai dengan tampilan
• Cara Merubah Blog Nofollow Menjadi Dofollow Mungkin diantara para blogger ada sebagian yang berniat merubah metode blognya dari Nofollow menjadi Dofollow. Namun s

Cara Biar Kolom Komentar Blog Bisa Disisipi Gambar

4/ 5

Oleh Bonita Benz