MENU
mobile-logo
Home / Social Media Marketing  / Social Network  / Applications and Tools  / Facebook Graph API ตอนที่ 12 สร้างหน้าต่าง Force Like ตั้งเวลาปิดตัว
Applications and Tools Developer Facebook Developer Global IT jQuery Marketing Strategy Newbie Programming Language Social Media Social Media Marketing Social Network Web Service Technology

Facebook Graph API ตอนที่ 12 สร้างหน้าต่าง Force Like ตั้งเวลาปิดตัว

2:04 PM
0
5205Views
พัฒนา Facebook Graph API ตอนที่ 12 สร้างหน้าต่าง Force Like ตั้งเวลาปิดตัว

การสร้างเทคนิค Force Like หน้า Fan Page ของ Facebook ด้วยคำสั่ง jQuery Popup ให้สามารถตั้งเวลาปิดหน้าต่าง หรือกด Like เพื่อปิดก่อนได้เทคนิคการ Forece Like นั้นแม้ว่าทาง Facebook จะกำหนดไปแล้วว่า Open Graph API อนุญาตให้นำไปใช้ได้ แต่ไม่เหมาะสมในเรื่องของสิทธิส่วนบุคคล อีกทั้งยังมีการสร้างความน่ารำคาญใจให้กับผู้คนใน Facebook และผู้บริโภคของเรา แต่ยังไงก็ตามถ้า เอเจนซี่ และแบรนด์ดังผู้ประกอบการหลายแหล่ในประเทศไทยนั้นยังคงให้ความสำคัญกับจำนวน Like บูชาให้เป็น KPI อยู่

ผมก็เลยจัดให้ กับ Script ของ jQuery ในการสร้างหน้า Popup มาเพื่อทำการ Force Like เหมือนกับบทความนี้ “พัฒนา Facebook Open Graph API ตอนที่ 5 ล้วงลึกเทคนิคการ Force Like ให้ Fan Page“

เพียงแค่ว่ารอบนี้ จะมีความแตกต่างเล็กน้อยตรงนี้ หน้าต่างจะปิดมีปุ่มปิดก็ได้ หรือไม่ปิดก็ได้ แต่มีการตั้งเวลาปิดตัวเอง ตามที่เรากำหนดไว้เหมือนในรูปครับ

พัฒนา Facebook Graph API ตอนที่ 12 สร้างหน้าต่าง Force Like ตั้งเวลาปิดตัว

พัฒนา Facebook Graph API ตอนที่ 12 สร้างหน้าต่าง Force Like ตั้งเวลาปิดตัว

วิธีการพัฒนา
สร้าง HTML ไฟล์ขึ้นมาว่า “index.html” ให้ทำการแทรก คำสั่งของ CSS ตามนี้ในส่วนของ <body> ครับ

CSS
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
<style>
#fblikepop {
background-color : #fff;
display : none;
position : fixed;
top : 200px;
width : 450px;
border : #6F6F6F solid 10px;
z-index : 200;
margin : 0;
padding : 0;
color : #333333;
text-align : left;
font-family : arial, sans-serif;
font-size : 13px;
}
#fblikepop body {
background : none 0% repeat scroll #fff;
line-height : 1;
margin : 0;
height : 100%;
}
.fbflush {
cursor : pointer;
font-size : 11px !important ;
color : #FFF !important ;
text-decoration : none !important ;
border : 0 !important ;
}
#fblikebg {
display : none;
position : fixed;
height : 100%;
width : 100%;
top : 0;
left : 0;
background : #000000;
z-index : 100;
}
#fblikepop #closeable {
float : right;
margin : 7px 15px 0 0;
}
#fblikepop h1 {
background : none 0% 0% repeat scroll #6D84B4;
border-top : 1px solid #3B5998;
border-left : 1px solid #3B5998;
border-right : 1px solid #3B5998;
color : #FFFFFF !important ;
font-size : 14px !important ;
font-weight : normal !important ;
padding : 5px !important ;
margin : 0 !important ;
font-family : "Lucida Sans Unicode",
                         "Lucida Grande", sans-serif !important ;
}
#fblikepop #actionHolder {
height : 80px;
overflow : hidden;
}
#fblikepop #buttonArea {
background : #F2F2F2;
border-top : 1px solid #CCCCCC;
padding : 10px;
min-height : 50px;
}
#fblikepop #buttonArea a {
color : #999999 !important ;
text-decoration : none !important ;
border : 0 !important ;
font-size : 10px !important ;
}
#fblikepop #buttonArea a:hover {
color : #333 !important ;
text-decoration : none !important ;
border : 0 !important ;
}
#fblikepop #popupMessage {
font-size : 12px !important ;
font-weight : normal !important ;
line-height : 22px;
padding : 8px;
background : #fff !important ;
}
#fblikepop #counter-display {
float : right;
font-size : 11px !important ;
font-weight : normal !important ;
margin : 5px 0 0 0;
text-align : right;
line-height : 16px;
}
</style>

หลังจากนั้นผมจะใช้ Service ของ Google JS API มาช่วย แทรกคำสั่งนี้ลงไป

Java
1
2
3
4
<script src="http://www.google.com/jsapi"></script>
<script language="javascript">
google.load("jquery", "1");
</script>

ต่อมาใช้คำสั่งในการเรียกค่าจาก Facebook Fan Page มาแสดง

Java
1
2
3
4
5
6
7
8
9
10
11
12
13
<script type="text/javascript"
    src="http://connect.facebook.net/en_US/all.js#xfbml=1">
</script>
<script type="text/javascript">
//<![CDATA[
daydev_username="daydevthailand",
daydev_title="กด Like กันก่อนนะครับ!",
daydev_skin="01",
delaytimer="20",
wait_time="0",
language_output="en"
//]]>
</script>

ทำการใช้ชุด POP UP jQuery จากเว็บต่างประเทศเว็บหนึ่งมาเปลี่ยนคำสั่งเล็กน้อยดาวน์โหลดได้ที่นี่
http://code.google.com/p/daydev/downloads/detail?name=daydev-force-like-timers.zip

จะได้ไฟล์ชื่อ “popup-timer.js” มาให้นำไปไว้โฟลเดอร์เดียวกันกับ “index.html” แทรกคำสั่งนี้ลงไปต่อท้าย

Java
1
<script type="text/javascript" src="popup-timer.js"></script>

แล้วทำการเรียกฟังก์ชัน onscript_function() จากไฟล์ popup-timer.js ด้วยคำสั่งนี้

Java
1
2
3
4
5
<script type="text/javascript">
//<![CDATA[
$(document).ready(function(){$().onscript_function({ closeable: true });});
//]]>
</script>

ลองพิจารณา

Java
1
daydev_username="daydevthailand",

คือการใส่ Facebook ชื่อ Fan Page ของเราให้สังเกตที่ http://www.facebook.com/daydevthailand

ในส่วนของการตั้งเวลาให้หน้า Popup jQuery ปิดตัวนั้นก็คือ

Java
1
delaytimer="20",

สามารถเปลี่ยนจาก 20 วินาทีเป็นเลขอื่นๆได้ครับ

ลองดูตัวอย่างได้ที่นี่ครับ

http://www.daydev.com/demo/apps/

เอาเป็นว่า การ Force Like อาจไม่ใช่วิธีที่ดีสำหรับนักการตลาด แต่ในเมื่อกระแสของควมเชื่อในหัวใจของเอเจนซีหลายเจ้ายังคงยึดมั่นในพลังแห่ง Like ก็คงคิดว่า Source Code ชุดนี้คงสร้างประโยชน์ให้กับพวกคุณครับ

Comments

POST TAGS:

daydevthailand@gmail.com

<p>อาจารย์ประจำสาขาวิชาการออกแบบเชิงโต้ตอบ และการพัฒนาเกม วิทยาลัยครีเอทีฟดีไซน์ & เอ็นเตอร์เทนเมนต์เทคโนโลยี มหาวิทยาลัยธุรกิจบัณฑิตย์<br /> ,ผู้ก่อตั้ง บริษัท Daydev Co., Ltd, (เดย์เดฟ จำกัด)</p>

Review overview
1 COMMENT
  • John Osiris January 26, 2013

    อยากสอบถามว่าถ้าเป็น Force Share จะต้องเขียนโค้ดยังอะไงครับผม.

POST A COMMENT

%d bloggers like this: