มาติด Facebook Like ให้กับกระทู้กัน
แก้ไขล่าสุดโดย suthida เมื่อ 2010-7-4 13:43แก้ไขล่าสุดโดย earthdroid เมื่อ 2010-5-3 22:07
พอดีไปลองแงะๆดูแล้วติดได้ เลยมาแนะนำครับ ติดแล้วจะเป็นแบบนี้นะครับ
พอใครมากด Like แล้วจะไปโผล่ที่เฟซบุคของคนนั้นด้วย ช่วยโปรโมทเว็บได้มหาศาล
เอาบทความไปแปะที่ไหน ใส่เครดิตให้ด้วยนะครับ http://earthdroid.cmudd.com/
ดูตัวอย่างการใช้งานจริงได้ที่ http://www.thaiandroidphone.com/ นะครับ ^^
-----------------------------------------------------------------
แบ่งเป็นสองขั้นตอนใหญ่ๆนะครับ
1. ขั้นเตรียมการ โดยติดตั้งสคริป XFBML ก่อน
2. ติดตั้งกล่อง Like
ขั้นเตรียมการ
1. ไปที่โฟลเดอร์เทมเพลตปัจจุบัน เปิดไฟล์ header.htm ขึ้นมา (ก่อนทำแบคอัพด้วยนะ)
2. แก้โค้ด จากเดิม<html xmlns="http://www.w3.org/1999/xhtml">แก้เป็น<html xmlns="http://www.w3.org/1999/xhtml"
xmlns:og="http://opengraphprotocol.org/schema/"
xmlns:fb="http://www.facebook.com/2008/fbml">3. ไปลงทะเบียนเว็บของเราไว้กับเฟซบุค http://developers.facebook.com/setup/
4. ไปที่ http://www.facebook.com/developers/apps.php แล้วก็อป หมายเลขแอพพลิเคชั่น ออกมา (ต่อไปจะเรียกว่า App ID)
5. ไปที่ http://graph.facebook.com/ยูเซอร์เนมเฟซบุค แล้วก็อปเลข Admin ID ไว้
- เช่นของผม http://graph.facebook.com/earthchie เลข Admin ID คือ 581849270
6. เอา Meta tag นี้ไปวางต่อท้าย Meta tag เดิมๆที่มีอยู่<meta property="fb:admins" content="Admin ID"/>
<meta property="fb:app_id" content="App ID" />
<meta property="og:site_name" content="ชื่อเว็บของเรา"/>
<meta property="og:type" content="website" />อย่าลืมแก้ข้อมูลใน content="xxx" ยกเว้น website ไม่ต้องแก้
7. เอาโค้ดนี้ไปวางต่อท้ายแทก </head><body>
<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.async = true;
e.src = document.location.protocol +
'//connect.facebook.net/en_US/all.js';
document.getElementById('fb-root').appendChild(e);
}());
</script>
</body>อย่าลืมแก้ App ID ในบรรทัดนี้ด้วย
FB.init({appId: 'App ID', status: true, cookie: true,
จบขั้นเตรียมการ ต่อไปมาติดตั้งกล่อง Like
-----------------------------------------------
ขั้นที่สอง
1. ไปที่ไฟล์ viewthread_node.htm แล้วมองหาโค้ดนี้ (กด ctrl+f หาก็ได้ไวดี) - อย่าลืมแบคอัพไฟล์<td class="postcontent postbottom">2. วางโค้ดนี้ต่อท้ายไปเลย<!--{if $post['first']}-->
<fb:like layout="standard" show_faces="true" width="650" action="like" colorscheme="light"></fb:like>
<!--{/if}-->หรือสามารถไป Generate โค้ดเองก็ได้ http://developers.facebook.com/docs/reference/plugins/like
ได้โค้ดมาแล้วเอาไปใส่ระหว่างแทก<!--{if $post['first']}--> โค้ดที่ gen มา <!--{/if}-->
ของเล่นอื่นๆเฟซบุคมีอีกเพียบ ลองประยุกต์ติดดูครับ http://developers.facebook.com/plugins
3. ลองรีเฟรชดูครับ ถ้ายังไม่มาให้รอซักแป้ป มันอาจจะค้างที่แคชอยู่
ป.ล. ผมไม่ได้เล่นดิสกัสประจำ หากผิดพลาดประการใดขออภัยด้วยครับ ^^
ป.ล.2 ใครอยากให้กล่อง Like กระเถิบขึ้นมาสูงอีกนิด ไปอ่านที่นี่นะครับ http://www.discuzthai.com/redirect.php?goto=findpost&ptid=18259&pid=216635&fromuid=33413 สุดยอดมาก
ขั้นตอนละเอียดได้ใจ
เก็บๆๆ กระทู้เป็นกระทู้โปรดดีกว่า
จัดไป +2
ลองทำดูซะแล้ว
เพื่อมี เกสมาเยี่ยมเยอะๆ วาวๆ ขอบคุณครับ แต่มั้นน่าจะเป็นภาษาไทยนะ ^^ ใครติดแล้วเอาเว็บมาอวดกันบ้างนะครับ ^^ ขออนุญาตแก้ไขนิดหน่อยนะครับ เจอ error
จากเดิม ขั้นเตรียมการข้อ 6 เปลี่ยน
<meta property="og:type" content="forum" />
เป็น
<meta property="og:type" content="website" />
นะครับ ไม่งั้นจะ error ตอนกด แก้ไขอีกรอบนะครับ
ขั้นที่สอง ข้อสุดท้าย ใส่แทก
<!--{if $post['first']}--> โค้ดที่ gen มา <!--{/if}-->
แบบนี้นะครับ แก้ไขโพสต์แรกแล้ว ยังไงไปอ่านโพสต์แรกสุดจะเข้าใจง่ายกว่าครับ เอยยยยย สิ่งนี้แหละที่รอคอย อะๆๆ +1 ไปซะ งงนิดหน่อย user ดูตรงไหน Meta tag อยู่ตรงไหนอะ USER ID ดูได้จากลิงค์นี้ครับ
http://graph.facebook.com/ยูเซอร์เนมเฟซบุคของเรา
เข้าไปแล้ว ช่อง id="xxxx" นั่นแหละครับ User ID ของเรา
ส่วน Meta tag เปิดไฟล์ header.htm แล้วจะเจอโค้ดประมาณนี้เรียงกันเต็มเลยครับ<meta name="keywords" content="{$metakeywords}$seokeywords" />
<meta name="description" content="$metadescription $bbname $seodescription - Discuz! Board" />
<meta name="generator" content="Discuz! $version" />
<meta name="author" content="Discuz! Team and Comsenz UI Team" />
<meta name="copyright" content="2001-2009 Comsenz Inc." />
<meta name="MSSmartTagsPreventParsing" content="True" />
<meta http-equiv="MSThemeCompatible" content="Yes" />
<meta http-equiv="x-ua-compatible" content="ie=7" />ให้เอาโค้ด meta tag ของเฟซบุค วางต่อท้ายโค้ดพวกนี้ได้เลย ตอบกลับ 9# earthdroid
User นี้คือ e-mail เราหรอเวลาผมล๊อคอิน ใช้ e-mailล๊อคอินอะ