บทความนี้ไม่ได้เกี่ยวกับ joomla แต่อย่างใด แต่อยากทำขึ้นเพื่อจะได้เป็นประโยชน์ต่อผู้ที่กำลังหาวิธีทำ comment facebook ในบล็อกครับ เพราะผมได้ลองหาวิธีทำในหลายๆเว็บไซต์แล้ว แต่ว่ายังไม่ตอบโจทย์เท่าที่ควร เพราะ Facebook กับเทมเพลตของ blogger เปลี่ยน javascript ไปในหลายๆ ส่วนทำให้โค้ทเก่าๆ จะแสดงผลไม่ได้เท่าที่ควร ก็เลยไปค้นเว็บที่เป็นภาษาอังกฤษแล้วก็แปลมา ครับ
วิธีการทำ comment facebook ใน blogger
1. ให้ไปสร้าง App id ของ Facebook ก่อนที่ https://developers.facebook.com/apps
http://4.bp.blogspot.com/-WR9xFUr3Ef4/UzUKR0f70DI/AAAAAAAAB9k/yymQT9EQzso/s1600/11117.JPG
http://2.bp.blogspot.com/-5UHqGo-41xA/UzUKUcwFBhI/AAAAAAAAB9w/zEHLSOIHCVI/s1600/1118.JPG
3. ไปที่ Blogger ของเราแล้วไปที่ แม่แบบ เลือก แก้ไข HTML
http://2.bp.blogspot.com/-LJ0ccR2QPgY/UzUK-uGzjOI/AAAAAAAAB90/00Alp5Bz3ys/s1600/1120.JPG
4. ให้ใส่โค้ท <meta content="FACEBOOK-APP-ID" property="fb:app_id" /> ต่อจาก <head> ครับ
5. เสร็จแล้วให้กด Ctrl+f แล้วค้นหาโค้ท <div class='post-footer-line post-footer-line-3'> เมื่อเจอแล้วให้ใส่โค้ทนี้ต่อท้าย
<b:if cond='data:blog.pageType == "item"'> <div id="fb-root"></div> <script>(function(d){ var js, id = 'facebook-jssdk'; if (d.getElementById(id)) {return;} js = d.createElement('script'); js.id = id; js.async = true; js.src = "//connect.facebook.net/en_US/all.js#xfbml=1"; d.getElementsByTagName('head')[0].appendChild(js); }(document));</script> <fb:comments width='450' colorscheme='light' expr:title='data:post.title' expr:href='data:post.canonicalUrl' expr:xid='data:post.id'/> </b:if>
<b:if cond='data:blog.pageType == "item"'> <div id="fb-root"></div> <script>(function(d){ var js, id = 'facebook-jssdk'; if (d.getElementById(id)) {return;} js = d.createElement('script'); js.id = id; js.async = true; js.src = "//connect.facebook.net/en_US/all.js#xfbml=1"; d.getElementsByTagName('head')[0].appendChild(js); }(document));</script> <fb:comments width='450' colorscheme='light' expr:title='data:post.title' expr:href='data:post.canonicalUrl' expr:xid='data:post.id'/> </b:if>
ตรง <fb:comments width='450' เราสามารถปรับความกว้างของกล่อง comment ได้
6. เสร็จแล้วให้หาโค้ท <html ซึ่งน่าจะอยู่ข้างบนสุด เมื่อหาเจอแล้วให้ใส่โค้ทนี้ต่อท้าย xmlns:fb="https://www.facebook.com/2008/fbml"
7. เสร็จแล้วทำการบันทึกเทมเพลต แล้วปรีวิวดูบทความสักหนึ่งบทความครับ ก็จะมีกล่อง comment facebook มาแล้ว
0 ความคิดเห็น:
แสดงความคิดเห็น