RSS Posts 
Ở bài viết trước mình đã hướng dẫn các bạn thay thế comment của blogger bằng comment của facebook, và mình đã nhận được 1 số phản hồi như là : chèn form comment của facebook vô làm blog load ỳ ạch, hoặc nhiều khi không load được đối với nhà mạng VNPT, và 1 ý kiến phản hồi khá hay là sử dụng song song cả 2 form comment của blogger và facebook cho bài viết. Ý kiến phản hồi này đã kích thích mình, và mình đã test ngay. Và bây giờ là lúc ngồi trước máy tính để chia sẻ cho mọi người.
Ở bản cập nhật này, mặc định form comment của Blogger sẽ được hiển thị, khi muốn comment bên form của facebook, thì các bạn chỉ việc click vào thanh điều hướng chuyển form comment là được.
Demo của bạn này và demo của bản cũ sẽ vẫn được dùng chung.
Xem DEMO
Hình ảnh minh họa
Updated 10/12/2011 : về việc click vào điều hướng chuyển form sẽ nhảy đến khu vực comment, tránh trường hợp bài viết dài khỏi mất công kéo chuột xuống.
- Để update thủ thuật, bạn chỉ cần update code của bước 5 là được.
- Để update thủ thuật, bạn chỉ cần update code của bước 5 là được.
Sau đây là các bước thực hiện : lưu ý là ở bản cập nhật này các bước thực hiện vẫn tương tự, chỉ có khác là không vào phần cài đặt để ẩn comment mà thôi. Vì thế nếu đã thực hiện bản cũ muốn update lên ở bản này thì các bạn cứ việc thay thế code đã thêm ở bản cũ bằng code của bản này là được.
1. Vào phần thiết kế -> chỉnh sửa code HTML -> nhấp chọn mở rộng mẫu tiện ích.
2. Chèn đoạn code bên dưới vào trước thẻ đóng </head>
<script type='text/javascript'>
//<![CDATA[
String.prototype.GetValue= function(para) {
var reg = new RegExp("(^|&)"+ para +"=([^&]*)(&|$)");
var r = this.substr(this.indexOf("\?")+1).match(reg);
if (r!=null) return unescape(r[2]); return null;
}
var purl= location.href;
var cm_form = purl.GetValue("cm_form");
var fb_href = purl.substring(0,purl.indexOf(".html")+5);
var fbcm ='<div class="fb-comments" data-href="'+fb_href+'" data-num-posts="5" data-width="660"></div>';
//]]>
</script>
- data-width là độ rộng của comment box.//<![CDATA[
String.prototype.GetValue= function(para) {
var reg = new RegExp("(^|&)"+ para +"=([^&]*)(&|$)");
var r = this.substr(this.indexOf("\?")+1).match(reg);
if (r!=null) return unescape(r[2]); return null;
}
var purl= location.href;
var cm_form = purl.GetValue("cm_form");
var fb_href = purl.substring(0,purl.indexOf(".html")+5);
var fbcm ='<div class="fb-comments" data-href="'+fb_href+'" data-num-posts="5" data-width="660"></div>';
//]]>
</script>
- data-num-posts là số comment được hiển thị (cũng chính là số bài reply trên 1 comment)
- data-href là để phân biệt từng comment box, mỗi địa chỉ data-href khác nhau sẽ cho 1 comment box khác nhau. và trong thủ thuật này data-href chính là link của mỗi bài viết.
3. Chèn đoạn code bên dưới vào sau thẻ <body>
<div id='fb-root'/>
<script>(function(d, s, id) {
var js, fjs = d.getElementsByTagName(s)[0];
if (d.getElementById(id)) {return;}
js = d.createElement(s); js.id = id;
js.src = "//connect.facebook.net/en_US/all.js#xfbml=1";
fjs.parentNode.insertBefore(js, fjs);
}(document, 'script', 'facebook-jssdk'));</script>
<script>(function(d, s, id) {
var js, fjs = d.getElementsByTagName(s)[0];
if (d.getElementById(id)) {return;}
js = d.createElement(s); js.id = id;
js.src = "//connect.facebook.net/en_US/all.js#xfbml=1";
fjs.parentNode.insertBefore(js, fjs);
}(document, 'script', 'facebook-jssdk'));</script>
4. Tìm đoạn code như bên dưới :
<b:include data='post' name='post'/>
5. Chèn ngay sau nó đoạn code bên dưới :
<b:if cond='data:blog.pageType == "item"'>
<div id='cmnav' style='text-align:center;'> <a href='?cm_form=blogger#cmnav'>Blogger Comments</a> | <a href='?cm_form=facebook#cmnav'>Facebook Comments</a> </div>
<script type='text/javascript'>
if (cm_form=="facebook#cmnav") {
document.write(fbcm);
var fbcss = document.createElement("style");
fbcss.type = "text/css";
fbcss.innerHTML = "#comments { display:none }";
document.body.appendChild(fbcss);
}
</script>
</b:if>
<div id='cmnav' style='text-align:center;'> <a href='?cm_form=blogger#cmnav'>Blogger Comments</a> | <a href='?cm_form=facebook#cmnav'>Facebook Comments</a> </div>
<script type='text/javascript'>
if (cm_form=="facebook#cmnav") {
document.write(fbcm);
var fbcss = document.createElement("style");
fbcss.type = "text/css";
fbcss.innerHTML = "#comments { display:none }";
document.body.appendChild(fbcss);
}
</script>
</b:if>
- Ở bước 5 này có 1 lưu ý nhỏ. Bạn phải xác định thẻ div chưa nội dung của phần comment của blogger là gì, đa số nó sẽ là #comments. Tùy theo template của bạn đang xài, và tùy theo người Rip template thì có thể nó sẽ khác. Việc xác định nó cũng không khó nên mình không hướng dẫn ở đây.
- 1 điều nữa là phần liên kết chuyển form comment (href='?cm_form=blogger' và href='?cm_form=facebook'). Cái giá trị cm_form=facebook thì bạn phải giữ nguyên, còn giá trị cm_form=blogger thì các bạn có thể thay đổi theo ý thích. Cái này chỉ có tác dụng load lại trang để sang chế độ comment của blogger mà thôi. Như ở đây mình khuyên cũng nên giữ nguyên để cho nó đẹp, pro 1 tý.
6. Save template.
Chúc các bạn thành công.
Thanks ý tưởng của Quang Minh today
e hỏi câu ngoài lề chút, cái pagenavi của blog e chỉ hiện trong bài viết, muốn hiện ở trang chủ thì làm thế nào :D
template đẹp đó bạn.
Cái pagenavi của bạn bị ẩn là người thiết kế template đã ẩn nó đi ở trang chủ.
Bạn vào trong code template sẽ tìm thấy dòng code như thế này.
<b:if cond='....
<style>#blog-pager {display:none; }</style>
</b:if>
chỉ việc xóa nó đi là xong.
hehe dc rùi a ạ, thanks a nhiều lắm ^^
cái comment hay ^^
Để màu nền cho cmt FB sao nhỉ, cái nền của em trong suốt khó nhìn :(
ui, cái blog của em khi chuyển sang dạng comment facebook thì nó vẫn hiện comment blogger: http://2.bp.blogspot.com/-0voKikk7Sh8/TuGYjFumRoI/AAAAAAAAC4E/MV6Q4IXlU_U/s1600/loi-comment.png
Bác Dũng thiết kế template đê,hay giới thiệu thêm mấy cái nào ngon ngon cho bọn em sài(mấy cái pác giới thiệu hồi trước em coi rồi đấy nhá)
Facebook đã bị chặn trở lại,nản thật
Xem giúp mình với,nó không hiện khung comment bằng fb
Chỉ thêm mình cách đổi vị trí của 2 cái với (cho cái com = fb sang bên trái,comm = blogger sang phải) với nhá
Thủ thuật tuyệt quá anh Dũng ạ! Em thấy nhiều trang sử dụng WP có sử dụng cái này rồi! Blogspot thì đây là lần đầu tiên! Chỉ copy và paste là xong rồi!
@ Đặng Nguyễn Trường Giang: bạn xác định đúng thẻ div chứa nội dung của phần comment của blogger là được, mình cũng gặp phải lỗi này khi làm.
@ Ngonluanho.net: bạn đổi vị trí trong code này thử xem sao? Blogger Comments | Facebook Comments
hạn chế là vấn đề load lại trang chúng ta không nói, nhưng đối với bài dài thì phải kéo thanh cuộn xuống một lần nữa để viết cm khi chuyển qua lai hai hệ thống cm thì hơi khó chịu. Anh em có thể dùng link cố dịnh nó cho tiện hơn.
cm_form=facebook anh em có thể đổi thành cm_form=facebook#commentsbox
và if (cm_form=="facebook") sửa thành if (cm_form=="facebook#commentsbox") nhu vay se tiện hơn.
#commentsbox thì ban linh động thay bằng thẻ nào đó phù hop voi blog cua ban!
Bạn Linh Dung nói đúng rồi đó.
@Trường Giang : như trong bài viết mình có nói là phải xác định rõ thẻ div chứa phần comment là gì. rồi thay vào code để phần comment của blogspot mới ẩn đi được. Nếu ko tìm được, bạn đưa link blog của bạn đây mình tìm cho.
@Ngonluanho.net : muốn đổi vị trí nó bạn đổi trong đoạn code này
<center> <a href='?cm_form=blogger'>Blogger Comments</a> | <a href='?cm_form=facebook'>Facebook Comments</a> </center>
Theo như ý bạn thì code nó sẽ như thế này :
<center> <a href='?cm_form=facebook'>Facebook Comments</a> | <a href='?cm_form=blogger'>Blogger Comments</a> </center>
Nếu em mún , 1 bên là comment cho blogger , 1 bên là share bài viết , mình biến đổi cái comment facebook thành share mạng xã hội được đó a , sau đó thiết kế tab ,bấm qua bấm lại được , em sẽ cho a ý tưởng ở Y!H anh sẽ đọc tin nhắn lưu trữ và a sẽ hiểu , bởi vì trang này tế nhị quá
@Yolks : ah, vậy hả. tức là cái chia sẻ mạng xã hội hôm qua em cho anh xem đó hả
Dũng ui,cái comment bằng facebook của mình nó không hiện lên.Chỉ có của blogger thui hiện lên thui à,mỗi lần click vào thì nó lại lên đầu trang.Chỉ dùm mình cách sửa với nhé
uh nhỉ, nó không hiển thị, có khi nào nó xung đột với cái tag chia sẻ của facebook ko nhỉ. bạn thử gỡ nó ra xem
Thủ thuật hay ;)
nhưng FD, làm sao biết được khi nào có người comment trong "FB Comment"? Bạn có code để hiển thị phần comment mới nhất trong "FB Comment" không, nếu có thì share cho mọi người luôn nhé. Thanks FD nhiều!
Em muốn chèn vô chỗ đóng khung này thì làm sao vậy a, giúp e với
[img]http://1.bp.blogspot.com/-C2PZd0qezWU/TuIvbhij4JI/AAAAAAAAAlg/ujza4fsX-qU/s1600/fb.png[/img]
Có cách nào để nó hiển thị sẵn khung comment bằng facebook không Fan Dũng ui,thay vì hiển thị sẵn khung commentcho blogger như bây giờ
Cái này hay quá anh Dũng ơi, em dùng rồi rất ok. Nhưng có một hạn chế nhỏ là nó phải load lại trang, hơi bất tiện chút :-/ anh có biện pháp nào khắc phục hạn chế này k anh Dũng ;))
hoặc giả khi chuyển qua fb cmt nó load lại trang nhưng jump tới box fb cmt luôn không phải cuộn xuống lần nữa thì hay quá, blog em toàn bài dài lê thê :( nếu phải cuộn xuống thì oải quá :((
thanks anh !
@D4U : việc click load lại trang là để tránh những lúc không vô được facebook bạn à.
- Còn việc click chuyển form comment sẽ nhảy tới phần comment thì mình đã update ở trên rồi, bạn có thể xem lại rồi up lại code.
Chủ nhà đâu rùi? cho mình hỏi: làm sao biết được khi nào có người comment trong "FB Comment"? Bạn có code để hiển thị phần comment mới nhất trong "FB Comment" không, nếu có thì share cho mọi người luôn nhé. Thanks
@BOY7X : cái này hơi khó đó bạn, muốn hiển thị nó thường ta dùng feed để lấy, nhưng không biết có comment của facebook này có feed ko. Với lại các comment này dữ liệu nó phân biệt với nhau bằng link của trang mà nó được chèn vào, nên cũng rất khó để lấy được các comment mới nhất trong tất cả các bài viết của blog.
Anh Fan Dung ơi,facebook thì hay rùi,nhưng để quản lí các comment đấy khỏi bị spam lung tung thì làm sao đây,hichic=((
Cảm ơn FD nhiều nhưng nếu FD phát triển được hàng "độc" này thì tuyệt vời! Mình không phải dân IT nhưng cũng ham Blogger, bạn có thể thêm code để mỗi khi có "FB comment" thì sẽ tự động gửi vào mail chẳng hạn..? Mình đã áp dụng thủ thuật này cho blog. Tks so much... ;))
anh ơi em là không được anh à, không tìm được thẻ này. anh giúp em với. thanks anh trước
minh lam nhu vay ma ko dc .giup minh voi
Đã làm được. Thanks bạn với ý tưởng hay này.
Mong nhận được sự giúp đỡ và góp ý của các bạn về trang THEGIOIBECON.tk của mình nhé.
Chào thân ái.
Bài viết hay quá anh ak. Em làm được rồi, thấy mấy blog làm được thế nên em thử tìm nhưng tìm mãi không ra. May quá hôm nay đang tìm tiijeenj ích Like FB thì ra trang của anh. Thích thật !:))
Anh chia sẻ nhiều bài hữu ích hơn nữa anh nhé. Chúc anh luôn có một sức khẻo dồi dào để cống hiến cho nền blogger Việt !
This my site: http://wWw.GiaiTriOnline.info
Hay quá bạn ơi! Blogger mà tích hợp Facebook Comments thì như hổ mọc thêm cánh! :D
Thật tuyệt vời. Cảm ơn bạn. Đay là blog của mình, mình mới thêm facebook comments.
Expinf.Com
bạn ơi, mình làm đúng rồi sao nó vẫn không hiện bạn nhỉ?
Chào Anh!
lâu qua ko chơi blog hôm nay mới ghé lại thăm a vs xem mấy cái thủ thuật mới ^^
cái này thì hay thiệt đó nhưng anh có cách nào cho nó hiện sẵn khung CM của FB trc ko? H có dùng rồi nhưng khung CM blog nó hiện ra trc.Khi nào nhấn vào chữ nhận xét bằng facebook nó mới hiện ra khung CM của facc.
» Nội dung phải liên quan tới chủ đề bài viết.
»
[quote=AUTHOR name=fdquote]NỘI DUNG[/quote]
» Có thể sử dụng các thẻ <b>,<i>,<a>.
BlOg FD chính thức đóng comment của khách ẩn danh.
BlOg FD.