Tips Trik Blogger Blogging | SEO | Aplikasi Android







Cara Memasang Widget Top Komentar Disquss

Cara Memasang Widget Top Komentar Disquss - Tips tutorial blog kali ini bagaimana cara memasang widget top komentar disquss diblog dimana sistem komentar disquss berikut merupakan sistem komentar yang sangat populer didunia. Disaat anda ingin mengetahui cara memasang widget top komentar disquss sangat tepat widget ini ditempatkan pada sidebar blog. Apapun platforms situs yang anda gunakan baik itu blogspot, wordpress, typepad, joomla, squarespace, drupal, moveable, tumblr, weebly, wix, type bisa menggunakan sistem layanan komentar disquss didunia maya untuk diinstall atau dipergunakan bagi anda dengan menerapkannya diblog.
Widget Komentar Disquss
Dengan mengetahui cara memasang top komentar disquss anda bisa melihat tampilannya terlihat mobile dan seo friendly. Dengan menampilkan widget kolom komentar disquss hasil pengembangan pihak ketiga membuat keleluasaan bagi anda untuk memanage komentar disitus anda.

Cara Memasang Widget Top Komentar Disquss Diblog

Cara Pertama
Masuk ke akun blogger kemudian pilih dashboard blog >> Tema >> Edit Html kemudian cari kode dibawah ini kemudian tempatkan diatas kode </head>.

<script src='https://ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js' type='text/javascript'/>

Kemudian SIMPAN. Disini anda beralih ke TATA LETAK lalu pilih ADD WIDGET pilih HTML/JAVASCRIPT. Masukkan kode dibawah ini ke dalam widget tersebut.


 <style scoped="scoped" type="text/css">

#topcommenters{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;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}

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="topcommenters" class="dsq-widget">

<script type='text/javascript'>

//<![CDATA[

document.write("<scr" + "ipt type=\"text/javascript\" src=\"https://SHORT NAME DISQUS ANDA.disqus.com/top_commenters_widget.js?num_items=5&hide_mods=1&hide_avatars=0&avatar_size=32\"></scr" + "ipt>");

//]]>

</script>

<script type='text/javascript'>

//<![CDATA[

$("#topcommenters a").filter(function(){return this.hostname&&this.hostname!==location.hostname}).attr('rel', 'nofollow').attr('target', '_blank');

//]]>

</script>

</div>

Anda tinggal mengganti tulisan yang diwarnai diatas dengan SHORT NAME DISQUSS ANDA. Terakhir simpan template anda.

Cara Kedua
Untuk memastikan cara memasang widget top komentar disquss tepat di blog. Anda login terlebih dahulu ke akun blogger seperti cara pertama ketuk Thema >> Edit Html kemudian tempatkan CSS dibawah ini tempatkan diatas pada kode css yang pertama yaitu </style>.


/* Recent Disqus Comments CSS */
#recent_comments{display:block;margin:0 auto;padding:0;-moz-box-sizing:border-box;-webkit-box-sizing:border-box;box-sizing:border-box;height:400px;}
#recent_comments ul.dsq-widget-list{text-align:left;max-height:400px;overflow:auto}
#recent_comments ul.dsq-widget-list::-webkit-scrollbar {height:8px;width:8px;background:#f5f5f5}
#recent_comments ul.dsq-widget-list::-webkit-scrollbar-thumb {background-color:#e2e2e2;}
#recent_comments img.dsq-widget-avatar{margin:3px 10px 7px 0;width:32px;height:32px;padding:0;float:left;clear:both;display:block}
#recent_comments p.dsq-widget-meta{clear:both;font-size:85%;margin-top:5px;font-weight:400}
#recent_comments p.dsq-widget-meta a{display:inline-block;width:48%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;color:#aaa}
#recent_comments p.dsq-widget-meta a:hover{color:#E9A12F;text-decoration:underline}
#recent_comments li.dsq-widget-item{margin:0;padding:10px;list-style-type:none;clear:both;border-bottom:1px solid #eee;color:#999;font-weight:400;line-height:1.3em!important}
#recent_comments li.dsq-widget-item:last-child{border-bottom:none}
#recent_comments a.dsq-widget-user {display:table;color:#010101;font-weight:700;}
#recent_comments a.dsq-widget-user:hover{color:#E9A12F;}
#recent_comments span.dsq-widget-comment{display:block;clear:both;margin-top:5px;}
#recent_comments .dsq-widget-comment p{display:inline-block;font-size:92%;margin:0;font-weight:400;color:#444;max-width:100%;}
#recent_comments .dsq-widget-item pre{position:relative;background:#ffe4ad;padding-top:0;border-radius:4px;transition:all .3s}
#recent_comments .dsq-widget-item pre:hover {background:#ffe4ad;}
#recent_comments .dsq-widget-item pre code{color:#908575;font-size:82%}
#recent_comments .dsq-widget-item pre:before{content:&#39;&#39;;position:absolute;padding:initial;font-size:initial;text-indent:initial;color:initial;top:0;right:0;width:1.2em;height:1.2em;background-color:#ebd099}
#recent_comments .dsq-widget-item pre:after{content:&#39;&#39;;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}

Simpan Template

Kemudian lanjutkan ke menu dashboard blog, klik menu TATA LETAK >> ADD WIDGET >> HTML/JAVASCRIPT. Salin kode dibawah ini dan sematkan pada widget html tersebut.


<div id="recent_comments" class="dsq-widget">
<script defer="defer" type='text/javascript'>
//<![CDATA[
document.write("<scr" + "ipt type=\"text/javascript\" src=\"https://themeindie.disqus.com/recent_comments_widget.js?num_items=18&hide_mods=0&hide_avatars=1&avatar_size=32&excerpt_length=120\"></scr" + "ipt>");
//]]>
</script></div>

Anda tinggal mengganti tulisan yang diwarnai diatas dengan ID KOMENTAR DISQUSS ANDA. Terakhir simpan template anda.
Cara Mudah Menghapus Kolom Komentar Bawaan Blogger
Sekian sudah Cara Memasang Widget Top Komentar Disquss. Semoga bermanfaat.
Tag : BLOG
10 Komentar untuk "Cara Memasang Widget Top Komentar Disquss"

saya masih pake coment bawaan blogspot...

akan saya coba bila nanti saya sudah memakai komentar disqus mas.
makasih telah berbagi

Nice info joss om kalo pake disquss

mantap nih widget disquss komentar jadi lebih efisien

wah pengen pasang juga tapi masih berat blog kebanyakan widget .. next pasti pasang juga ...

Aku masih pake komen bawaan blogger sih mas... Hihi... Ini disqus kelebihannya apa sih selain banyak dipqke di seluruh dunia?

Kalo di detik sih udah ada komen disqus...

Apa sih keuntungan dari memasang sistem komentar disqus mas?
Mohon pencerahannya.

Btw makasih atas tutor yang diberikan.

Bisa membalas komentar tanpa masuk ke blog, adanya kolom komunitas sebagai akun follower bagi blogger lain yang ingin mengetahui update artikel bagi pemilik akun disquss.

klo dipake diblog saya. apakah gak terlalu berat diloading ke artikel?

PERATURAN BERKOMENTAR :

1. Dilarang Spam.
2. Dilarang Memasang Link Aktif.
3. Dilarang Menghina, Sara, Dan P*rn.
4. Dilarang Promosi.
5. Komentar Harus Relevan Dengan Artikel.
6. Terima Kasih..!!

Jika anda melanggar 5 point diatas, maka komentar anda akan kami hapus langsung tanpa pemberitahuan sebelumnya.
Terima kasih dan selamat berblogging ria.

Back To Top