Cara Mengganti Avatar Komentar Anonymous Pada Blog


December 23, 2018
Mengganti Avatar Komentar Anonymous Pada Blog

Bagaimana cara mengganti gambar profile pada saat user berkomentar sebagai guest atau anonymous, biasanya tidak ada gambar jika kalian membuat template sendiri karena memang belum diberi link, otomatis blogger tidak akan menampilkan gambar, tapi jika di inspect element, maka terdapat link gambar default.

Lantas bagaimana cara menggantinya?

Mengganti semua avatar atau gambar pada komentar

Gunakanlah kode dibawah ini agar semua gambar pada komentar berubah sesuai yang diinginkan tempelkan kode ini di atas </b:skin>


  .avatar-image-container img {
      content: url(http://1.bp.blogspot.com/_7wsQzULWIwo/SxL-DRXzmWI/AAAAAAAACY0/d1g3ymxGLEQ/s400/avatar.gif);
      width: 36px;
      height: 36px;
  }

Ganti kode berwarna merah sesui dengan gambar yang kalian inginkan dan biru adalah ukuran pada gambar.

Akan tetapi cara diatas mengganti semua gambar pada komentar, bagaimana jika ingin mengganti hanya anonymous atau guest?

Maka pakai saja javascript ini agar bisa mengganti gambar avatarnya, tempelkan di atas kode </body>


  <script type="text/javascript">
    (function() {
      var avatars = document.getElementsByClassName("avatar-image-container");
      for (i=0; i < avatars.length; i++) {
        var image = avatars[i].firstChild;
        if (image.src === 'https://img1.blogblog.com/img/blank.gif' || image.src === 'http://img1.blogblog.com/img/blank.gif') {
          image.src = 'http://1.bp.blogspot.com/_7wsQzULWIwo/SxL-DRXzmWI/AAAAAAAACY0/d1g3ymxGLEQ/s400/avatar.gif';
          image.style.height='36px';
          image.style.width='36px';
        }
      }
    })();
  </script>

Ganti kode berwarna merah dengan link gambar yang kalian inginkan, sedangkan biru adalah ukuran gambar, Saya rekomendasikan gambar kecil saja agar mempercepat loading website kalian.

referensi : https://stackoverflow.com/questions/45227409/change-anonymous-avatar-in-blogger-comments

3 comments:

  1. terima kasih atas infonya mas

    ReplyDelete
  2. Informasi yang sangat bermanfaat, dan wajib untuk di coba. Terima kasih, semoga saja tutorial di atas, bisa menambah tampilan blog yang saya kelola jadi semakin bagus. Sukses terus ....salam blogger.

    ReplyDelete
  3. Mantap bung !!
    https://kodemin.blogspot.com/

    ReplyDelete