Membuat Fitur Komentar Custom di Blogger

Tools custom untuk komentar blogger | menambahkan komentar dengan gambar dan video

Hello sobat kali ini admin bakalan menjabarkan mengenai cara membuat fitur komentar custom di blogger.

Info: Jika kamu penasaran dengan pembahasan kita kali ini yuk langsung aja kita bahas bersama sama.

Fitur komentar

Apa itu fitur komentar custom? fitur komentar custom merupakan fitur komentar yang di buat khusus untuk menampilkan pesan komentar dengan petunjuk penggunaan komentar dan menampilkan apa saja yang bisa pengunjung blog lakukan dengan fitur komentar custom tersebut.

Cara pembuatan

Baiklah sobat ICloudzer sekarang saatnya admin bakalan menjabarkan mengenai cara membuat fitur komentar custom di blogger, silahkan baca dan ikuti setiap arahan yang admin jabarkan di bawah ini

1. Silahkan login ke akun blogger menggunakan akun google anda
2. Selanjutnya pergi ke menu tema atau theme dalam bahasa inggris nya
3. Kemudian silahkan kamu mencari kode seperti di bawah ini

<!--[ Comment message ]-->
<b:if cond='data:this.messages.blogComment != &quot;&quot;'>
<div class='cmMs note'>
<data:this.messages.blogComment/>
</div>
</b:if>

Info: Pada setiap struktur kode template memiliki perbedaan jika kode di atas tidak kamu temukan, sikahkan lanjut ke langkah selanjutnya

4. Jika sudah ketemu kodenya silahkan, hapus dan ubah kodenya seperti kode berikut ini

<!--[ Comment message ]-->
<div class='cmMs raHim'>
<div id='rahCmM'>
 <input checked='' class='rahCmMs1 hidden' id='offrahCmM1' name='accordion-menu' type='radio'/>
<input class='rahCmMs2 hidden' id='offrahCmM2' name='accordion-menu' type='radio'/>
 <div class='cmbutton'>
 <div class='cmbutton1'>
 <label class='cmbutton-title' for='offrahCmM1'>
 Pesan Komentar
</label>
 </div>
 <div class='cmbutton2'>
<label class='cmbutton-title' for='offrahCmM2'>
 Media +
</label>
 </div>
</div>
<div class='rahCm-mes'>
 Pergunakanlah kecerdasan anda saat berkomentar, dan tinggalkan komentar sesuai topik tulisan. Komentar dengan
 <b>
link aktif
 </b>
 tidak akan ditampilkan.
</div>
<div class='rahCm-des'>
 Masukkan
 <b>
<a href='https://imgbb.com/upload' rel='nofollow noopener noreffer' target='_blank' title='Upload Gambar di Sini'>
 URL Gambar
</a>
 </b>
 atau
 <b>
<a href='https://www.youtube.com/?feature=youtu.be' rel='nofollow noopener noreffer' target='_blank' title='Dapatkan URL Youtube di Sini'>
 URL Video YouTube
</a>
 </b>
 atau
 <b>
Potongan Kode
 </b>
 , atau
 <b>
Quote
 </b>
 , lalu klik tombol yang kamu inginkan untuk di-parse. Salin hasil parse lalu paste ke kolom komentar.
 <div id='rahParser'>
<textarea id='rahCodes' placeholder='Masukkan kode/ url_gambar/ url_video_youtube di sini untuk diparse' spellcheck='false'/>
<div class='rahalert rahalertSuccess collapse' id='rahBinfo' role='rahalert' style='display: none;'>
 <button class='rahCloser close-copy' onclick='document.getElementById(&quot;rahBinfo&quot;).style.display = &quot;none&quot;;cdClear();' type='button'>
<span aria-hidden='true'>
 &#215;
</span>
 </button>
 <span>
Code Copied!
 </span>
</div>
<span class='rahCmBgroup'>
 <button class='rahCmBpri btn-xs' id='cvrt2' onclick='imgConvert();this.disabled = true;'>
image
 </button>
 <button class='rahCmBpri btn-xs' id='cvrt4' onclick='videoConvert();this.disabled = true;'>
video
 </button>
 <button class='rahCmBpri btn-xs' id='cvrt5' onclick='preConvert();this.disabled = true;'>
pre
 </button>
 <button class='rahCmBpri btn-xs' id='cvrt1' onclick='codeConvert();this.disabled = true;'>
code
 </button>
 <button class='rahCmBpri btn-xs' id='cvrt3' onclick='quoteConvert();this.disabled = true;'>
quote
 </button>
 <br/>
 <button class='rahCmBlink btn-xs btn-info' data-clipboard-action='copy' data-clipboard-target='#rahCodes' id='rahCmBlink' style='display: none;' type='submit'>
Salin Kode!
 </button>
 <button class='btn-danger btn-xs' onclick='cdClear();'>
Bersihkan
 </button>
</span>
<span class='checkbox'>
 <input checked='' id='opt1' type='checkbox'/>
 <input checked='' id='opt2' type='checkbox'/>
 <input checked='' id='opt3' type='checkbox'/>
 <input checked='' id='opt4' type='checkbox'/>
 <input checked='' id='opt5' type='checkbox'/>
 <br/>
 <input checked='' id='opt6' type='checkbox'/>
 <span>
image
 </span>
 <input checked='' id='opt7' type='checkbox'/>
 <span>
video
 </span>
 <input checked='' id='opt8' type='checkbox'/>
 <span>
quote
 </span>
 <input checked='' id='opt10' type='checkbox'/>
 <span>
pre
 </span>
 <input checked='' id='opt11' type='checkbox'/>
 <span>
code
 </span>
</span>
<div class='clear'>
</div>
 </div>
</div>
</div>
</div>

Info: Jika kode pada langkah no.3 tidak ketemu silahkan cari kode <iframe class='blogger-iframe-colorize blogger-comment-from-post lazy' kemudian letakkan kode HTML di atas tepat di atasnya

5. Langkah selanjutnya silahkan salin dan tempelkan kode javascript di bawah ini tepat di atas kode </body>

<script>
/*<![CDATA[*/ 
var rahimgLazy = 'lazy fullN'; /* kode class lazy gambar dan anti full gambar, jika kode class yang di gunakan template mu sama gak usah di ubah */
var rahClassYt = 'videoYt'; /* Ini adalah class kode untuk menampilkan video youtube */
/*]]>*/</script>
<script src='https://cdn.jsdelivr.net/gh/rahcode-ui/icloudice@dewa/users/js/rahcmft.js'></script><script src="https://cdn.rawgit.com/zenorocha/clipboard.js/v1.5.16/dist/clipboard.min.js"></script>

Info: Kamu bisa mengedit class kode Gambar dan video pada komentar sesuai template mu masing masing.

Sumber: https://www.icloudice.com/2023/05/membuat-fitur-komentar-custom-blogger.html

Lanjut ke Link Tujuan

Anda mungkin tertarik artikel ini :

Terima kasih telah membaca artikel kami yang berjudul: Membuat Fitur Komentar Custom di Blogger, jangan lupa + IKUTI website kami dan silahkan bagikan artikel ini jika menurut Anda bermanfaat. Simak artikel kami lainnya di Google News.

Dukung kami dengan memilih salah satu metode donasi di bawah ini:

Donasi via Saweria Donasi via Trakteer Donasi via PayPal

Dana / OVO / GoPay 0858 6878 6809