Blogger Jateng
Home / blogger

Cara Biar Kolom Komentar Blog Bisa Disisipi Gambar

Editor Kuamangmedia.com 1 comment
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.

cara menyisipkan gambar di kolom komentar blog, agar komentar bisa dimasukkan foto atau image, cara memasukkan url gambar di komentar blogger

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 ini :


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

    4. <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
    6. <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 :)

1 comment for "Cara Biar Kolom Komentar Blog Bisa Disisipi Gambar"

  1. Gao Yuayuan14 September, 2021 00:42

    Saya may tes komentar dengan gambar dibawah ini.

    [img]https://thumb.viva.co.id/media/frontend/thumbs3/2020/11/05/5fa3aa3e23eea-ilustrasi-wanita-rambut-berwarna-cat-rambut_665_374.jpg[/img]

    ReplyDelete

Tips memasukan gambar pada kolom komentar dengan cara menambahkan kode dibawah ini.

[img] URL Gambar Anda [/img]