เชื่อมต่อเว็บไซต์ของเราเข้ากับ Facebook ด้วย Open Graph Protocol และ Social Plugin
เดิมบล็อกตอนนี้มีชื่อว่า
“Facebook อนุญาตให้เปลี่ยน Open Graph objects types (og:type) ได้แล้ว” แต่ขอเปลี่ยนชื่อใหม่นะคะ จะได้ง่ายต่อการกลับมาค้นหาอีกครั้ง ^^
ก่อนจะพูดถึง op:type คงต้องเกริ่นถึง Open Graph protocol กันเสียก่อน :D
Open Graph protocol เป็นตัวที่จะช่วยเชื่อมต่อระหว่างผลิตภัณฑ์ของเรากับ Facebook สมมติว่าเราทำเว็บไซต์เกี่ยวกับดารา, ค่ายเพลง, ภาพยนตร์ หรืออะไรต่อมิอะไรก็ตาม ถ้าเราได้ลง Open Graph protocol และลง Social Plugin ต่างๆ (เช่นปุ่ม Like) ปุ๊บ เมื่อมีคนกด Like เว็บของเรา มันก็จะไปขึ้นในหน้า Feed ของคนๆ นั้นโดยทันที
ตัวอย่างเช่นในภาพ เมื่อมีคนกด Like ภาพยนตร์เรื่อง The Rock นอกจากจะไปอยู่ใน Feed ของคนๆ นั้นแล้ว ยังไปอยู่ในหน้า Info ส่วน Like and Interest ด้วย :D ถ้ามีคนกดมาดูประวัติหมอนี่ปุ๊บก็จะอ๋อออ ชอบ The Rock นี่เอ๊ง รสนิยมเข้ากับเราเรยย์ แบบนี้คุยกันได้ XD (ฮา)
(อนึ่ง เว็บที่ผูกกับ Open Graph Protocol เมื่ออยู่ใน Facebook จะเป็น Page ในรูปแบบหนึ่ง ที่สามารถกดเข้าไปดูได้ว่า มีใครร่วมกด Like หรือพูดถึงอะไรยังไงกันบ้าง เช่นแบบนี้
โดย Page นี้จะมี Admin เห็นเพียงคนเดียวเท่านั้น จะสามารถเช็ก Insight ได้ว่ามีใครมากด Like เราบ้าง)
ในส่วนของการเพิ่ม Open Graph protocol ก็ไม่ยาก เพียงแค่เราใส่โค้ดพวกนี้ลงใน head ของเรา
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
|
<html xmlns="http://www.w3.org/1999/xhtml"
xmlns:og="http://opengraphprotocol.org/schema/"
xmlns:fb="http://www.facebook.com/2008/fbml">
<head>
<title>The Rock (1996)</title>
<meta property="og:title" content="The Rock"/>
<meta property="og:type" content="movie"/>
<meta property="og:url" content="http://www.imdb.com/title/tt0117500/"/>
<meta property="og:image" content="http://ia.media-imdb.com/rock.jpg"/>
<meta property="og:site_name" content="IMDb"/>
<meta property="fb:admins" content="USER_ID"/>
<meta property="og:description"
content="A group of U.S. Marines, under command of
a renegade general, take over Alcatraz and
threaten San Francisco Bay with biological
weapons."/>
...
</head>
...
</html>
|
โดยที่
- og:title คือชื่อเว็บที่เราจะให้แสดง
- og:type คือประเภท (ในภาพข้างล่างจะเป็น Movie ดูประเภททั้งหมดที่ Facebook อนุญาตให้ใช้ได้ที่นี่)
- og:url คือ url ของเว็บไซต์เรา
- og:image คือภาพตัวอย่าง (ดูจากรูปข้างล่างได้)
- og:site_name คือชื่อเว็บของเรา
- fb:admins จะตั้งให้ใครเป็น admin ให้ใส่ user id ของคนๆ นั้นลงไป
- og:description เป็นคำอธิบายเว็บสั้นๆ 1-2 บรรทัด
-
|
หน้าแรก
