Disqus Son Yorumlar Widget Oluşturma

5/17/2016
Disqus Son Yorumlar Widget Oluşturma

Disqus Son Yorumlar Widget Oluşturma - Bir çok özelliğe sahip Disqus yorum sistemi şimdi de blogger sitelerinde ve web sitelerinde kullanılmak üzere en son yorumlar widget'i ile blogunuza fonksiyolnel bir eklenti daha kazandırmış oluyor.

Bu eklenti ve özellikleri sayesinde blogunuzun Disqus yorum sistemine ziyaretçileriniz tarafından yapılan yorumları vitrine taşıyor.

Disqus En Son Yorumlar Widget'i Blogger Sitesine Nasıl Eklenir?


1. Blogger sitenize giriş yapın ve eklemek istediğiniz blogun kumanda panelinden Yerleşim > Gadget Ekle > HTML/JavaScript Ekle tıklıyorsunuz ve aşağıdaki kodları HTML/JavaScript içerisine ekleyin kaydedin.

<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:#333}
#RecentComments p.dsq-widget-meta a:hover{color:#333}
#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:#333;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:#333}
#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:#333;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:#ddd}
#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://bloggerekibi.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>

2. HTML kod içerisinde bulunan renkli alanı kendi blogger sitenize göre düzenleyin.

Bknz: Blog Otomatik Facebook Beğen Eklentisi

Disqus Son Yorumlar Widget Oluşturma hakkında daha fazla bilgi için iletişim sayfasından yada yorum bölümünden bize ulaşabilirsiniz.

Kategori İçerikleri



Blogger
Disqus
Yorum Ekle

Hiç yorum yok