Mong chia sẽ:: Brivium - AIO Social Comments 2.4.2

Như tiêu đề mình tìm chỉ có Brivium - AIO Social Comments 1.0.3 thôi....
DEMO: như comment ở dưới trang này

Nên ngồi view source làm cái tương tự như sau:

B1:vào template: message
Tìm :

Thêm đoạn này ở dưới:

Mã:

<xen:if is="{$post.position} == 0 AND !{$message.conversation_id}">
    
    
        <div class="commentTabs comment">
    
            <input id="tabFacebook" type="radio" name="radio-set" class="tabSelectorFacebook" checked="checked">
            <label for="tabFacebook" class="tabLabelFacebook">Facebook</label>
    
    
            <input id="tabGoogle" type="radio" name="radio-set" class="tabSelectorGoogle">
            <label for="tabGoogle" class="tabLabelGoogle">Google +</label>
    
    
            <input id="tabDisqus" type="radio" name="radio-set" class="tabSelectorDisqus">
            <label for="tabDisqus" class="tabLabelDisqus">Disqus</label>
    
        <div class="clear-shadow"></div>
     
        <div class="contentTab">
        
                <div class="tabFacebook">
                         <div id="{$messageId}" class="message {xen:if $message.isDeleted, 'deleted'} {xen:if '{$message.is_admin} OR {$message.is_moderator}', 'staff'} {xen:if $message.isIgnored, ignored}" data-author="{$message.username}">
                                            <div class="comment_fbdiv" ></div>
                                            <div id="fb-root"></div>
                                            <div class="fb-comments" data-href="http://khatvongsong.vn/{xen:link threads, $thread}" data-num-posts="10" data-width="100%"></div>
                                         </div>
                 </div>
        
        
                <div class="tabGoogle">
                         <script src="https://apis.google.com/js/plusone.js"></script>
                                         <div class="g-comments" data-href="http://khatvongsong.vn/{xen:link threads, $thread}" data-num-posts="10" data-width="100%" data-first_party_property="BLOGGER" data-view_type="FILTERED_POSTMOD"></div>
                  </div>
        
        
                <div class="tabDisqus">
                    <div id="disqus_thread"></div>
                 
                </div>
        
        </div>
    </div>


        </xen:if>

B2: vào template EXTRA.css
Thêm css này vào:

Mã:

/*Responsive FB*/
#fbcomments, .fb-comments, .fb-comments iframe[style], .fb-comments span {
width: 100% !important;
}
/* --- BRAIOSC_style.css --- */
        div[id^='___comments_'], div[id^='___comments_'] iframe {
            width: 100% !important;
        }

.commentTabs{
    max-width:100%;
    margin:0 auto;
    position:relative;
    clear: both;
    padding-top:0px;
}
.commentTabs h3 {
    font-size:15px;
    background: #C0392B;
    color: #fff;padding: 0 20px;
    margin: 0 -24px;
}
.commentTabs input{
    position:absolute;
    top:0;
    left:0;
    display:none;
}
.commentTabs label{
    display:block;
    float:left;
    position:relative;
    padding:10px 20px;
    line-height:1.5em;
    min-width:55px;
    text-align:center;
    color: #222;
    font-size:13px;
    font-weight:bold;
    letter-spacing:1px;
    cursor:pointer;
}
.commentTabs label:after{
    content:"";
    display:block;
    position:absolute;
    width:100%;
    height:5px;
    background:#fff;
    left:0;
    bottom:-5px;
}
.clear-shadow{
    clear:both;
}
.contentTab{
    position:relative;
    width:100%;
    border-top: 1px solid #DDD;
    padding-top: 10px;
    margin-top:-1px;
}
.contentTab>div{
    overflow:hidden;
    top:0;
    left:0px;
    opacity:0;
    display:none;
    transition:opacity .4s;
    -moz-transition:opacity .4s;
    -webkit-transition:opacity .4s;
    -ms-transition:opacity .4s;
    -o-transition:opacity .4s;
}

.commentTabs input:checked + label{background: url(https://fbstatic-a.akamaihd.net/rsrc.php/v2/yf/r/PfBgtiydy5U.gif) no-repeat bottom center;z-index:1}
.commentTabs input.tabSelectorFacebook:checked ~ .contentTab .tabFacebook,
.commentTabs input.tabSelectorGoogle:checked ~ .contentTab .tabGoogle,
.commentTabs input.tabSelectorDisqus:checked ~ .contentTab .tabDisqus{
opacity:1;display:block;
}

/* --- BRATR_rating.css --- */

Lưu ý: nhớ đổi tên domain: khatvongsong.vn thành tên miền bạn

Chú ý: Muốn quản lý bình luận facebook bạn cần thêm ID người quản lý vào thì mới quản lý được nhé!
nếu bạn không có app facebook thì vào :

Template: PAGE_CONTAINER

thêm code sau trên </head>

<<Nếu có rồi thì khỏi chèn

Bạn có thể vào địa chỉ sau để quản lý bình luận facebook :
www.developers.facebook.com/tools/comments

 

tks bạn nhưng google vs disqus k hiển thị

 

OHM::: phần discu thiếu file js

 

LÀM LẠI BƯỚC B1 nhé:

B1:vào template: message
Tìm :

Thêm đoạn này ở dưới:

Mã:

<xen:if is="{$post.position} == 0 AND !{$message.conversation_id}">
  
  
        <div class="commentTabs comment">
  
            <input id="tabFacebook" type="radio" name="radio-set" class="tabSelectorFacebook" checked="checked">
            <label for="tabFacebook" class="tabLabelFacebook">Facebook</label>
  
  
            <input id="tabGoogle" type="radio" name="radio-set" class="tabSelectorGoogle">
            <label for="tabGoogle" class="tabLabelGoogle">Google +</label>
  
  
            <input id="tabDisqus" type="radio" name="radio-set" class="tabSelectorDisqus">
            <label for="tabDisqus" class="tabLabelDisqus">Disqus</label>
  
        <div class="clear-shadow"></div>
   
        <div class="contentTab">
      
                <div class="tabFacebook">
                            
<div class="fb-comments"
data-href="{$contentLink}"
data-width="{$facebook.width}"
data-numposts="{$facebook.num_posts}"
data-colorscheme="{$facebook.scheme}">
</div>
                 </div>
      
      
                <div class="tabGoogle">
                       
<script src="https://apis.google.com/js/plusone.js"></script>
<div class="g-comments"
data-href="{$contentLink}"
data-first_party_property="BLOGGER"
data-view_type="FILTERED_POSTMOD">
</div>
                  </div>
      
      
                <div class="tabDisqus">
                  
<div id="disqus_thread"></div>
<script type="text/javascript">
var disqus_shortname = '{$disqus.short_name}'; // required: replace example with your forum shortname
(function() {
var dsq = document.createElement('script'); dsq.type = 'text/javascript'; dsq.async = true;
dsq.src = '//' + disqus_shortname + '.disqus.com/embed.js';
(document.getElementsByTagName('head')[0] || document.getElementsByTagName('body')[0]).appendChild(dsq);
})();
</script>
<noscript>Please enable JavaScript to view the <a href="http://disqus.com/?ref_noscript">comments powered by Disqus.</a></noscript>
<a href="http://disqus.com" class="dsq-brlink">comments powered by <span class="logo-disqus">Disqus</span></a>
               
                </div>
      
        </div>
    </div>


        </xen:if>

 

Không có demo nhì

 

Demo:
nghethuatxam.com
Của mình thì sử dụng addons phiên bản 2.4.2 chứ không dùng code