Cara Membuat Recent Comment Disqus Ringan di Blogger Cara Membuat Recent Comment Disqus Ringan di Blogger
Disqus yaitu sistem komentar yang sangat terkenal dikalangan para blogger ketika ini, Selain itu disqus juga dianggap sangat kondusif alasannya yaitu memakai sistem komunikasi 1 arah , Disqus juga sangat gampang untuk dikonfigurasikan dan sistem komentar disqus juga sanggup di integerasikan dengan banyak sekali platform serta CMS ibarat Blogger, wordpress, Drupal, Joomla dan masih banyak lagi.

Baca juga : Cara Membuat Most Comment Widget Untuk Blogger

Hari ini aku mau membuatkan tips Bagaimana cara menciptakan recent comment disqus yang ringan untuk blogger ada dua pilihan widget recent comment yang sanggup kau cobain nantinya ikuti terus ya artikel hari ini.

#1. Cara memasang widget recent comment disqus ringan tanpa foto.

Script recent komentar ini dibentuk oleh arlina design sudah pernah juga aku terapkan pada blog aku akibatnya cukup memuaskan alasannya yaitu tidak mengganggu loading dari blog kita. Cara memasangnya diblog sebagai berikut.

  1. Silahkan login ke blogger kau masing masing.
  2. Pilih hidangan layout atau tata letak.
  3. Klik Add a Gadget.
  4. Pastekan script dibawah ini pada pilihan HTML/Javascript.
<style scoped="scoped" type="text/css">
#RecentComments{display:block;width:100%;margin:0 auto;padding:0;-moz-box-sizing:border-box;-webkit-box-sizing:border-box;box-sizing:border-box;height:400px;}
#RecentComments ul.dsq-widget-list{text-align:left;max-height:400px;overflow:auto;}
#RecentComments img.dsq-widget-avatar{margin:3px 10px 7px 0;width:32px;height:32px;padding:0;float:left;border-radius:3px;clear:both;display:block}
#RecentComments p.dsq-widget-meta{clear:both;font-size:80%;margin-top:5px;font-weight:400}
#RecentComments p.dsq-widget-meta a{display:inline-block;width:48%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;color:#444}
#RecentComments p.dsq-widget-meta a:hover{color:#ff675c}
#RecentComments li.dsq-widget-item{margin:0;padding:6px 0 4px;list-style-type:none;clear:both;border-bottom:1px solid #eee;color:#736fb8;font-weight:600}
#RecentComments li.dsq-widget-item:last-child{border-bottom:none}
#RecentComments a.dsq-widget-user {display:table;color:#736fb8;font-weight:600;}
#RecentComments a.dsq-widget-user:hover{color:#999;}
#RecentComments span.dsq-widget-comment{display:block;clear:both;margin-top:5px;}
#RecentComments .dsq-widget-comment p{display:inline-block;font-size:88%;margin:0;font-weight:400;color:#444}
#RecentComments .dsq-widget-item pre{position:relative;background-color:#f3ffca;padding-top:0;box-shadow:0 1px 0 rgba(0,0,0,.1);border-radius:0;opacity:.9;transition:all .3s;}
#RecentComments .dsq-widget-item pre:hover {opacity:1}
#RecentComments .dsq-widget-item pre code {color:#444;font-size:82%;}
#RecentComments .dsq-widget-item pre:before{content:'';position:absolute;padding:initial;font-size:initial;text-indent:initial;left:initial;color:initial;top:0;right:0;width:1.2em;height:1.2em;background-color:#d8e3b0}
#RecentComments .dsq-widget-item pre:after{content:'';font-size:initial;padding:0;position:absolute;width:0;height:0;border-style:solid;border-width:0 1.2em 1.2em 0;border-color:transparent #fff transparent transparent}
</style>
<div id="RecentComments" class="dsq-widget">
<script defer="defer" type='text/javascript'>
//<![CDATA[
document.write("<scr" + "ipt type=\"text/javascript\" src=\"https://rubahdenganIDdisqusKamu.disqus.com/recent_comments_widget.js?num_items=18&hide_mods=0&hide_avatars=1&avatar_size=32&excerpt_length=120\"></scr" + "ipt>");
//]]>
</script>
<script type='text/javascript'>
//<![CDATA[
$("#RecentComments a").filter(function(){return this.hostname&&this.hostname!==location.hostname}).attr('rel', 'nofollow').attr('target', '_blank');
//]]>
</script>
</div>

Simpan dan silahkan lihat hasilnya.


#2. Cara memasang widget recent comment disqus ringan dengan foto.

Kalau di widget yang kedua ini nanti di recent comment nya akan tampil foto dari yang berkomentar dipostingan yang ada diblog kita, Saya sendiri menentukan recent komentar yang ini, Kamu sanggup melihat di blog ini. Cara memasangnya silahkan lihat dibawah ini.
  1. Silahkan login ke blogger kau masing masing.
  2. Pilih hidangan layout atau tata letak.
  3. Klik Add a Gadget.
  4. Pastekan script dibawah ini pada pilihan HTML/Javascript.
<style scoped="scoped" type="text/css">
#RecentComments{display:block;width:100%;margin:0 auto;padding:0 10px;border:1px solid #ddd;-moz-box-sizing:border-box;-webkit-box-sizing:border-box;box-sizing:border-box;height:300px;overflow:auto}
.dsq-widget ul.dsq-widget-list{padding:0;margin:0;text-align:left}
img.dsq-widget-avatar{margin:3px 10px 7px 0!important;width:58px!important;height:58px!important;padding:0!important;float:left;border-radius:3px!important}
p.dsq-widget-meta{clear:both;font-size:80%;margin-top:5px!important}
p.dsq-widget-meta a{display:inline-block;width:48%;overflow:hidden;text-overflow:ellipsis;-webkit-text-overflow:ellipsis;white-space:nowrap}
li.dsq-widget-item{margin:0!important;padding:6px 0 4px!important;list-style-type:none;clear:both;border-bottom:1px solid #ddd}
li.dsq-widget-item:last-child{border-bottom:none}
a.dsq-widget-user{font-weight:700;display:block!important;margin-bottom:5px}
</style>
<div id="RecentComments" class="dsq-widget">
<script type='text/javascript'>
//<![CDATA[
document.write("<scr" + "ipt type=\"text/javascript\" src=\"https://perampokgoogle.disqus.com/recent_comments_widget.js?num_items=20&hide_mods=1&hide_avatars=0&avatar_size=32&excerpt_length=80\"></scr" + "ipt>");
//]]>
</script>
<script type='text/javascript'>
//<![CDATA[
$("#RecentComments a").filter(function(){return this.hostname&&this.hostname!==location.hostname}).attr('rel', 'nofollow').attr('target', '_blank');
//]]>
</script>
</div>

Simpan settingan dan lihat hasilnya.

Oke segitu dulu ya gosip mengenai bagaimana cara memasang recent comment disqus di blogger Semoga bermanfaat dan sanggup dimengerti Terimakasih.