Bài này mình kết hợp từ hai bài viết :
- Vietshare.VN : Tạo tab menu cơ bản sử dụng jQuery UI
- Mybloggertricks.com : Tạo comments bằng tài khoản Facebook cho blogspot
- Nhớ save template của bạn vào đề phòng thất bại :D
xmlns:fb='http://www.facebook.com/2008/fbml'Sau khi thêm xong sẽ là
<html xmlns:fb='http://www.facebook.com/2008/fbml'3.Tìm thẻ <body> và dán đoạn code phía dưới vào ngay sau nó
<div id='fb-root'/>
<script>
window.fbAsyncInit = function() {
FB.init({
appId : 'APP ID Ở BƯỚC 3 HÌNH PHÍA TRÊN',
status : true, // check login status
cookie : true, // enable cookies to allow the server to access the session
xfbml : true // parse XFBML
});
};
(function() {
var e = document.createElement('script');
e.src = document.location.protocol + '//connect.facebook.net/en_US/all.js';
e.async = true;
document.getElementById('fb-root').appendChild(e);
}());
</script>4.Tìm thẻ </head> và dán trên nó đoạn code sau
<meta expr:content='data:blog.pageTitle' property='og:title'/>
<meta expr:content='data:blog.url' property='og:url'/>
<meta content='Tên blog của bạn' property='og:site_name'/>
<meta content='Link hình logo' property='og:image'/>
<meta content='APP ID Ở BƯỚC 3 HÌNH PHÍA TRÊN' property='fb:app_id'/>
<meta content='http://www.facebook.com/huycovip' property='fb:admins'/>
<meta content='article' property='og:type'/>5.Tìm code
<p class='comment-footer'>
<b:if cond='data:post.embedCommentForm'>
<b:if cond='data:post.allowNewComments'>
<b:include data='post' name='comment-form'/>
<b:else/>
<data:post.noNewCommentsText/>
</b:if>
<b:else/>
<b:if cond='data:post.allowComments'>
<a expr:href='data:post.addCommentUrl' expr:onclick='data:post.addCommentOnclick'><data:postCommentMsg/></a>
</b:if>
</b:if>
</p>Xóa đoạn code được tô màu xanh đi
6.Đặt các javascript và css sau vào trước thẻ </head>
<style type="text/css">
.hidden {
display: none;
}
</style>
<link rel="stylesheet" type="text/css" href="http://ajax.googleapis.com/ajax/libs/jqueryui/1.7.2/themes/ui-lightness/jquery-ui.css" />
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1/jquery.min.js"></script>
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jqueryui/1/jquery-ui.min.js"></script>
<script type="text/javascript">
$(function() {
$(".tabmenu").removeClass("hidden");
$(".tabs h2").addClass("hidden");
$(".tabs").tabs();
});
</script>7.Tìm
<b:includable id='comment-form' var='post'>
...
...
...
</b:includable>Và cắt toàn bộ code bên trong thẻ này dán vào trình soạn văn bản nào đấy , ta gọi là đoạn code A. Tìm đoạn code sau:
<b:includable id='comments' var='post'>8.Dán ngay sau nó đoạn code dưới đây
<div class="tabs">
<ul class="tabmenu hidden">
<li><a href="#tab-1"><data:post.numComments/> Blogspot Comments</a></li>
<li><a href="#tab-2"><fb:comments-count expr:href='data:post.canonicalUrl'/> Facebook Comments</a></li>
</ul>
<div id="tab-1">
<h2>Tab 1</h2>
<p>Dán đoạn code A vào đây</p>
</div>
<div id="tab-2">
<h2>Tab 2</h2>
<p><b:if cond='data:blog.pageType == "item"'>
<div style='padding:0px 0px 0px 0px; margin:0px 0px 0px 0px;'><script src='http://connect.facebook.net/en_US/all.js#xfbml=1'/>
<div> <fb:comments colorscheme='light' expr:href='data:post.url' expr:title='data:post.title' expr:xid='data:post.id' width='520'/></div>
</div>
</b:if></p>
</div>
</div>9.Save template và xem kết quả
Bài này mình tự phát triển dựa trên các nguồn trên internet, bạn nào có thành ý muốn chia sẻ đến tất cả mọi người xin ghi rõ nguồn. Cảm ơn!
5 comments
Cảm ơn bạn đã ghé thăm Troll VL !
Insert Emoticons» Tạm thời ngăn không cho comment với chế độ ẩn danh vì có một số bạn không có thành ý cố tình spam. Mong các bạn thông cảm!
» Bạn nên viết bằng Tiếng Việt có dấu để mọi người dễ đọc, dễ bình luận
» Để liên hệ,góp ý và đóng góp bài viết bạn click vào đây
Sử dụng các thẻ sau cho comments
» Chèn nội dung vào blockquote <b rel="quote">Nội dung blockquote</b>
» Chèn nội dung vào note <em rel="note">Nội dung note</em>
» Chèn code vào khung pre <i rel="pre">Nội dung code</i>
» Chèn hình ảnh <i rel="image">Link hình ảnh</i>
» Chèn video từ youtube [youtube]link video[/youtube]
» Chèn link <i rel="anchor">Link</i>
Mã Hóa Code Tạo và xem trước comments Cancel Reply
&Convert
'Convert
"Convert
<Convert
>