Thêm comment của G+ và Facebook vào blogger

Tạo app trên facebook và lấy Application ID

Bước 1: Tạo app trên facebook và lấy Application ID

Bước 2: Tìm thẻ <html và thay bằng đoạn bên dưới
<html xmlns:fb='http://www.facebook.com/2008/fbml'
Thêm đoạn code sau vào trước thẻ </head> trong template
<meta expr:content='data:blog.pageTitle' property='og:title'/>
<meta expr:content='data:blog.url' property='og:url'/>
<meta content='article' property='og:type'/>
<meta content='Logo.png' property='og:image'/>
<meta content='199611023443344' property='fb:app_id'/>
<script src='http://connect.facebook.net/en_US/all.js#xfbml=1'/>
<script type='text/javascript'>
function commentToggle(selectTab) {
$(".comments-tab").addClass("inactive-select-tab");
$(selectTab).removeClass("inactive-select-tab");
$(".comments-page").hide();
$(selectTab + "-page").show();
}
</script>
<script src='http://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js' type='text/javascript'/>
199611023443344 Là ID của app trên Facebook
Xóa đoạn code màu tím đi nếu trong template bạn đã có jquery
CSS
Tìm thẻ sau trong template
Code:
]]></b:skin>
Dán css bên dưới phía trên thẻ vừa tìm được
Code:
#blogger-comments-page{padding:0 5px}
#comments h4{text-indent:-999em;height:1px;background:#0186CB;margin-top:27px}
#fb-comments-page, #googplus-comments-page{display:none}
#googplus-comments-page {border-top: 1px solid #0186CB;margin-top: 27px;}
.comments-page{width:98%}
.comments-tab{float:left;padding:5px;margin-left:5px;margin-right:3px;cursor:pointer;background-color:#048F14;color:#fff}
.comments-tab-icon{height:14px;width:auto;margin-right:3px}
.comments-tab:hover{background-color:#rgb(35,117,44)}
.inactive-select-tab{background-color:#000}

Thêm các tab comment của G+ và Facebook vào blog

Bước 1: Tìm đoạn code bên dưới trong template
[QUOTE]<b:includable id='threaded_comments' var='post'>
<div class='comments' id='comments'>[/QUOTE]

Bước 2: Dán ngay dưới nó đoạn code sau
Code:
<div class='comments-tab' id='blogger-comments' onclick='javascript:commentToggle("#blogger-comments");' title='Comments from Blogger'><img class='comments-tab-icon' src='https://googledrive.com/host/0Bz_65BAr9KCZTnQwV04xMF84OWc'/><data:post.numComments/> Comments
</div>
<div class='comments-tab inactive-select-tab' id='googplus-comments' onclick='javascript:commentToggle("#googplus-comments");' title='Comments made with Google+'><img class='comments-tab-icon' src='https://googledrive.com/host/0Bz_65BAr9KCZLTI4OG82QUtkc2s'/>
G+ Comments
</div>
<div class='comments-tab inactive-select-tab' id='fb-comments' onclick='javascript:commentToggle("#fb-comments");' title='Comments made with Facebook'><img class='comments-tab-icon' src='https://googledrive.com/host/0Bz_65BAr9KCZb3VFYjlVVG9mMEk'/>
<fb:comments-count expr:href='data:post.url'/>Comments
</div>
<div class='comments-page' id='googplus-comments-page'>
<b:if cond='data:blog.pageType == "item"'>
<div id='google_comments'/>
<script>
gapi.comments.render('google_comments', {
href: window.location,
width: '680',
first_party_property: 'BLOGGER',
view_type: 'FILTERED_POSTMOD'
});
</script>
</b:if>
</div>
<div class='comments-page' id='fb-comments-page'>
<b:if cond='data:blog.pageType == "item"'>
<div class='fbcm'>
<div id='fb-root'/>
<fb:comments colorscheme='dark' expr:href='data:post.canonicalUrl' expr:title='data:post.title' expr:xid='data:post.id' width='680'/>
</div>
</b:if>
</div>
<div class='comments-page' id='blogger-comments-page'>

Bước 3: Tìm thẻ đóng </b:includable> gần nhất ở bên dưới và thêm trước nó thẻ </div> và lưu lại template