http://developers.facebook.com/docs/reference/plugins/comments
ใครที่ต้องการสร้างระบบ comment หรือการแสดงความคิดเห็นในเว็บไซต์ของตัวเอง โดยไม่ต้องสร้างฐานข้อมูล สามารถเข้าไปใช้บริการ facebook api ที่ชื่อ comment ตามขั้นตอนต่อไปนี้
1.ล็อกอินเข้าสู่ระบบ facebook ปกติ ถ้ายังไม่ได้เป็นสมาชิก
http://www.facebook.com/login.php
ต้องทำการสมัครสมาชิก facebook ก่อนถึงจะใช้งานได้
2.เข้าไปที่หน้า http://developers.facebook.com/setup/
กรอกรายละเอียดดังนี้
site name:--- กรอกเป็นชื่อ domain ตัวอย่าง ninenik
site url:------ กรอก http://www.youdomain.com/ ตัวอย่าง http://www.ninenik.com/
ควรกรอก / หลังชื่อโดเมนปัองกันปัญหา การแจ้งเตือน Invalid url
locale:------- เลือกภาษาไทย หรือภาษาอื่นตามต้องการ
3.คลิกปุ่ม Create Application ถ้าไม่เกิดข้อผิดพลาด ระบบจะสร้าง Application ซึ่งมีรายละเอียด
ดังรูปด้านล่าง ให้ทำการบันทึก ข้อมูลไว้ใช้งาน โดยเฉพาะ app id และ app secret
4.แทนที่ แท็กเปิด <html ... ในไฟล์ที่ต้องการ แสดง comment ด้วย
แทนที่ตำแหน่งตรงแถบสีฟ้าอ่อน ตามรูปด้านล่าง
5.แทรกโค้ด comment ด้านล่างในไฟล์ตามข้อ 4. ในตำแหน่งที่ต้องการแสดง
- <fb:comments numposts="10" width="800"></fb:comments>
- <div id="fb-root"></div>
- <script>
- window.fbAsyncInit = function() {
- FB.init({appId: 'ใส่หมายเลข app id ตรงนี้', status: true, cookie: true,
- xfbml: true});
- };
- (function() {
- var e = document.createElement('script');
- e.type = 'text/javascript';
- e.src = document.location.protocol +
- '//connect.facebook.net/th_TH/all.js';
- e.async = true;
- document.getElementById('fb-root').appendChild(e);
- }());
- </script>
กำหนดความกว้าง
width="800"
- <fb:comments width="800"></fb:comments>
numposts="10"
- <fb:comments numposts="10" width="800"></fb:comments>
จำเป็นต้องกำหนด uniqe id โดยใช้ php เข้ารหัส ด้วยคำสั่ง
- <?=md5($_SERVER["SERVER_NAME"].$_SERVER["REQUEST_URI"])?>
- <fb:comments xid="<?=md5($_SERVER["SERVER_NAME"].$_SERVER["REQUEST_URI"])?>" numposts="10" width="800"></fb:comments>
นอกจากนี้ยังสามารถกำหนด meta tags ในส่วนของ <header> เพื่อให้ facebook นำค่าไปใช้งาน ตัวอย่าง
- <meta property="og:title" content="รู้จักกับ Ajax Events ใน jQuery"/>
- <meta property="og:site_name" content="ninenik.com"/>
- <meta property="og:image" content="http://www.ninenik.com/mages/logo_01_Sat.gif"/>
og:site_name ใช้กำหนด ชื่อเว็บไซต์
og:image ใฃ้กำหนดรูปภาพ ปกติ facebook จะดึงจากรูปใน tag img ที่แสดงหน้านั้น
og:title ถ้าใช้ php สามารถดึงจากฐานข้อมูล หรือตัวแปรมาแสดง ตัวอย่าง
- <meta property="og:title" content="<?=$yourtitle?>"/>
สามารถดูตัวอย่างได้ที่ http://santafear.orgfree.com/v4/comment.php