ThaiSEOBoard.com

พัฒนาเว็บไซต์ => Free Site => ข้อความที่เริ่มโดย: khatha0808 ที่ 29 ธันวาคม 2013, 11:48:50



หัวข้อ: วิธีทำ Popup ให้กด "Like" Fanpage สำหรับ Blogger
เริ่มหัวข้อโดย: khatha0808 ที่ 29 ธันวาคม 2013, 11:48:50
วันนี้ผมจะมาแนะนำวิธีทำ Poppup ให้กับ Blogger ของเราน่ะครับ วิธีนี้สามารถเพิ่ม Like ให้กับเพจเราได้ดีเลยทีเดียว (ทดลองทำมาแล้วประมาณเดือนนึง)

เรามาดูวิธีการทำกันครับ

ขั้นแรกเลย Add Widget ตัวนี้เข้าไปใน Blogger ของเรา ในส่วนของ Layout>HTML/Javascript น่ะครับ
โค๊ด:
<script src='http://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js' type='text/javascript'></script>
<style>
#fanback {
display:none;
background:rgba(0,0,0,0.8);
width:100%;
height:100%;
position:fixed;
top:0;
left:0;
z-index:99999;
}
#fan-exit {
width:100%;
height:100%;
}
#fanbox {
background:white;
width:420px;
height:270px;
position:absolute;
top:58%;
left:63%;
margin:-220px 0 0 -375px;
-webkit-box-shadow: inset 0 0 50px 0 #939393;
-moz-box-shadow: inset 0 0 50px 0 #939393;
box-shadow: inset 0 0 50px 0 #939393;
-webkit-border-radius: 5px;
-moz-border-radius: 5px;
border-radius: 5px;
margin: -220px 0 0 -375px;
}
#fanclose {
float:right;
cursor:pointer;
background:url(http://3.bp.blogspot.com/-NRmqfyLwBHY/T4nwHOrPSzI/AAAAAAAAAdQ/8b9O7O1q3c8/s1600/fanclose.png) repeat;
height:15px;
padding:20px;
position:relative;
padding-right:40px;
margin-top:-20px;
margin-right:-22px;
}
.remove-borda {
height:1px;
width:366px;
margin:0 auto;
background:#F3F3F3;
margin-top:16px;
position:relative;
margin-left:20px;
}
#linkit,#linkit a.visited,#linkit a,#linkit a:hover {
color:#80808B;
font-size:10px;
margin: 0 auto 5px auto;
float:center;
}
</style>


<script type='text/javascript'>
//<![CDATA[
jQuery.cookie = function (key, value, options) {

// key and at least value given, set cookie...
if (arguments.length > 1 && String(value) !== "[object Object]") {
options = jQuery.extend({}, options);

if (value === null || value === undefined) {
options.expires = -1;
}

if (typeof options.expires === 'number') {
var days = options.expires, t = options.expires = new Date();
t.setDate(t.getDate()   days);
}

value = String(value);

return (document.cookie = [
encodeURIComponent(key), '=',
options.raw ? value : encodeURIComponent(value),
options.expires ? '; expires='   options.expires.toUTCString() : '', // use expires attribute, max-age is not supported by IE
options.path ? '; path='   options.path : '',
options.domain ? '; domain='   options.domain : '',
options.secure ? '; secure' : ''
].join(''));
}

// key and possibly options given, get cookie...
options = value || {};
var result, decode = options.raw ? function (s) { return s; } : decodeURIComponent;
return (result = new RegExp('(?:^|; )'   encodeURIComponent(key)   '=([^;]*)').exec(document.cookie)) ? decode(result[1]) : null;
};
//]]>
</script>
<script type='text/javascript'>
jQuery(document).ready(function($){
if($.cookie('popup_user_login') != 'yes'){
$('#fanback').delay(20000).fadeIn('medium');
$('#fanclose, #fan-exit').click(function(){
$('#fanback').stop().fadeOut('medium');
});
}
$.cookie('popup_user_login', 'yes', { path: '/', expires: 7 });
});
</script>

<div id='fanback'>
<div id='fan-exit'>
</div>
<div id='fanbox'>
<div id='fanclose'>
</div>
<div class='remove-borda'>
</div>
<iframe allowtransparency='true' frameborder='0' scrolling='no' src='//www.facebook.com/plugins/likebox.php?

href=http://www.facebook.com/theblogwidgets&width=402&height=255&colorscheme=light&show_faces=true&show_border=false&stream=false&header=false'

style='border: none; overflow: hidden; margin-top: -19px; width: 402px; height: 230px;'></iframe>
</div>
</div>

วิธีปรับแต่ง
1. เปลี่ยนหน้า fanpage เป็นของเราโดย search หา http://www.facebook.com/theblogwidgets แล้วแทนที่ด้วย url ของเพจเรา
2. ปรับค่า Delay ที่จะให้ popup แสดง เวลาคนเข้ามาที่ Blog เรา ปกติแล้วจะเซทเวลาไว้ที่ 20 วินาที หลังจากคนเข้ามาที่ blog เรา 20 วิ แล้ว popup จะเด้งขึ้นมาให้คนกด Like ถ้าเราต้องการเปลี่ยนค่านี้ ให้ search หา .delay(20000) จากนั้น เปลี่ยนค่าได้ตามใจชอบ โดยแทนค่าดังนี้ 1 วินาที = 1,000 ครับ

เพียงแค่นี้ก็เป็นอันเสร็จเรียบร้อย ลองทดสอบดูได้ครับ





หัวข้อ: Re: วิธีทำ Popup ให้กด "Like" Fanpage สำหรับ Blogger
เริ่มหัวข้อโดย: e-business ที่ 29 ธันวาคม 2013, 12:13:49
+1 ให้ครับ  :wanwan020:


หัวข้อ: Re: วิธีทำ Popup ให้กด "Like" Fanpage สำหรับ Blogger
เริ่มหัวข้อโดย: beerqazasa ที่ 29 ธันวาคม 2013, 12:32:53
อยากเห็นตัวอย่างอ่ะครับ


หัวข้อ: Re: วิธีทำ Popup ให้กด "Like" Fanpage สำหรับ Blogger
เริ่มหัวข้อโดย: khatha0808 ที่ 29 ธันวาคม 2013, 13:04:48
อยากเห็นตัวอย่างอ่ะครับ


(http://2.bp.blogspot.com/-Fdvg-RALYNI/UpA3tZ-KYSI/AAAAAAAAFYk/G31FtxznMlc/s1600/facebook+popup+widget.png)

ประมาณนี้ครับ


หัวข้อ: Re: วิธีทำ Popup ให้กด "Like" Fanpage สำหรับ Blogger
เริ่มหัวข้อโดย: Ceo_Md ที่ 29 ธันวาคม 2013, 14:38:36
ขอบคุณครับ +1 ให้ครับ


หัวข้อ: Re: วิธีทำ Popup ให้กด "Like" Fanpage สำหรับ Blogger
เริ่มหัวข้อโดย: seo-1th ที่ 29 ธันวาคม 2013, 15:42:43
ผมกำลังหาเลย ขอบคุณคับ


หัวข้อ: Re: วิธีทำ Popup ให้กด "Like" Fanpage สำหรับ Blogger
เริ่มหัวข้อโดย: oDarkIceo ที่ 29 ธันวาคม 2013, 17:41:18
วันนี้ผมจะมาแนะนำวิธีทำ Poppup ให้กับ Blogger ของเราน่ะครับ วิธีนี้สามารถเพิ่ม Like ให้กับเพจเราได้ดีเลยทีเดียว (ทดลองทำมาแล้วประมาณเดือนนึง)

เรามาดูวิธีการทำกันครับ

ขั้นแรกเลย Add Widget ตัวนี้เข้าไปใน Blogger ของเรา ในส่วนของ Layout>HTML/Javascript น่ะครับ
โค๊ด:
<script src='[url]http://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js'[/url] type='text/javascript'></script>
<style>
#fanback {
display:none;
background:rgba(0,0,0,0.8);
width:100%;
height:100%;
position:fixed;
top:0;
left:0;
z-index:99999;
}
#fan-exit {
width:100%;
height:100%;
}
#fanbox {
background:white;
width:420px;
height:270px;
position:absolute;
top:58%;
left:63%;
margin:-220px 0 0 -375px;
-webkit-box-shadow: inset 0 0 50px 0 #939393;
-moz-box-shadow: inset 0 0 50px 0 #939393;
box-shadow: inset 0 0 50px 0 #939393;
-webkit-border-radius: 5px;
-moz-border-radius: 5px;
border-radius: 5px;
margin: -220px 0 0 -375px;
}
#fanclose {
float:right;
cursor:pointer;
background:url([url]http://3.bp.blogspot.com/-NRmqfyLwBHY/T4nwHOrPSzI/AAAAAAAAAdQ/8b9O7O1q3c8/s1600/fanclose.png[/url]) repeat;
height:15px;
padding:20px;
position:relative;
padding-right:40px;
margin-top:-20px;
margin-right:-22px;
}
.remove-borda {
height:1px;
width:366px;
margin:0 auto;
background:#F3F3F3;
margin-top:16px;
position:relative;
margin-left:20px;
}
#linkit,#linkit a.visited,#linkit a,#linkit a:hover {
color:#80808B;
font-size:10px;
margin: 0 auto 5px auto;
float:center;
}
</style>


<script type='text/javascript'>
//<![CDATA[
jQuery.cookie = function (key, value, options) {

// key and at least value given, set cookie...
if (arguments.length > 1 && String(value) !== "[object Object]") {
options = jQuery.extend({}, options);

if (value === null || value === undefined) {
options.expires = -1;
}

if (typeof options.expires === 'number') {
var days = options.expires, t = options.expires = new Date();
t.setDate(t.getDate()   days);
}

value = String(value);

return (document.cookie = [
encodeURIComponent(key), '=',
options.raw ? value : encodeURIComponent(value),
options.expires ? '; expires='   options.expires.toUTCString() : '', // use expires attribute, max-age is not supported by IE
options.path ? '; path='   options.path : '',
options.domain ? '; domain='   options.domain : '',
options.secure ? '; secure' : ''
].join(''));
}

// key and possibly options given, get cookie...
options = value || {};
var result, decode = options.raw ? function (s) { return s; } : decodeURIComponent;
return (result = new RegExp('(?:^|; )'   encodeURIComponent(key)   '=([^;]*)').exec(document.cookie)) ? decode(result[1]) : null;
};
//]]>
</script>
<script type='text/javascript'>
jQuery(document).ready(function($){
if($.cookie('popup_user_login') != 'yes'){
$('#fanback').delay(20000).fadeIn('medium');
$('#fanclose, #fan-exit').click(function(){
$('#fanback').stop().fadeOut('medium');
});
}
$.cookie('popup_user_login', 'yes', { path: '/', expires: 7 });
});
</script>

<div id='fanback'>
<div id='fan-exit'>
</div>
<div id='fanbox'>
<div id='fanclose'>
</div>
<div class='remove-borda'>
</div>
<iframe allowtransparency='true' frameborder='0' scrolling='no' src='//www.facebook.com/plugins/likebox.php?

href=http://www.facebook.com/theblogwidgets&width=402&height=255&colorscheme=light&show_faces=true&show_border=false&stream=false&header=false'

style='border: none; overflow: hidden; margin-top: -19px; width: 402px; height: 230px;'></iframe>
</div>
</div>

วิธีปรับแต่ง
1. เปลี่ยนหน้า fanpage เป็นของเราโดย search หา [url]http://www.facebook.com/theblogwidgets[/url] แล้วแทนที่ด้วย url ของเพจเรา
2. ปรับค่า Delay ที่จะให้ popup แสดง เวลาคนเข้ามาที่ Blog เรา ปกติแล้วจะเซทเวลาไว้ที่ 20 วินาที หลังจากคนเข้ามาที่ blog เรา 20 วิ แล้ว popup จะเด้งขึ้นมาให้คนกด Like ถ้าเราต้องการเปลี่ยนค่านี้ ให้ search หา .delay(20000) จากนั้น เปลี่ยนค่าได้ตามใจชอบ โดยแทนค่าดังนี้ 1 วินาที = 1,000 ครับ

เพียงแค่นี้ก็เป็นอันเสร็จเรียบร้อย ลองทดสอบดูได้ครับ

ถ้าใครคิดว่ากระทู้มีประโยชน์ ไม่ขอไรมากครับ รบกวนช่วยกด Like รูปให้หน่อยครับ ส่งรูปร่วมสนุกชิงรางวัล ipad ให้ลูกครับ

เข้าไปที่ link นี้ [url]https://www.facebook.com/Tung.Itthipol/posts/628352407225868?comment_id=5601936&notif_t=like[/url]

จากนั้นช่วยคลิ๊ก like รูปของ "พี่ออกัส น้องออดี้" ประมาณ comment ที่ 7 อ่ะคร๊าาฟฟ

ขอบคุณมาก มากคร๊าฟ

ขอโทษที่อาจจะยุ่งยากนิดนุง

และจะเป็นพระคุณมาก ถ้าหากช่วยแชร์ให้เพื่อนๆ ในกลุ่มไลน์ เฟส โซเชี่ยลต่างๆ ช่วยกด Like กันคนละที สองที อิอิ

 :wanwan017: :wanwan017: :wanwan017:






ลองเอา code ไปนี้ไปเพิ่มใน Layout>HTML/Javascript
แล้วไม่เกิดผล ? หรือผมทำอะไรผิดหว่า


หัวข้อ: Re: วิธีทำ Popup ให้กด "Like" Fanpage สำหรับ Blogger
เริ่มหัวข้อโดย: natapan9823 ที่ 29 ธันวาคม 2013, 19:37:51
เป็นประโยชน์มาครับ


หัวข้อ: Re: วิธีทำ Popup ให้กด "Like" Fanpage สำหรับ Blogger
เริ่มหัวข้อโดย: NenaDesign ที่ 29 ธันวาคม 2013, 19:41:08
พอกด Like แล้ว เข้ามาใหม่ ยัง Popup อยู่ไหมคะ


หัวข้อ: Re: วิธีทำ Popup ให้กด "Like" Fanpage สำหรับ Blogger
เริ่มหัวข้อโดย: iPhonZii ที่ 29 ธันวาคม 2013, 21:39:47
เก็บไว้ก่อน


หัวข้อ: Re: วิธีทำ Popup ให้กด "Like" Fanpage สำหรับ Blogger
เริ่มหัวข้อโดย: kbvTH ที่ 29 ธันวาคม 2013, 22:36:36
เป็นประโยชน์มาก ขอบคุณครับ :wanwan017:


หัวข้อ: Re: วิธีทำ Popup ให้กด "Like" Fanpage สำหรับ Blogger
เริ่มหัวข้อโดย: Meaw-IE ที่ 29 ธันวาคม 2013, 22:53:33
ขอบคุณครับ  :wanwan017:


หัวข้อ: Re: วิธีทำ Popup ให้กด "Like" Fanpage สำหรับ Blogger
เริ่มหัวข้อโดย: goodwide ที่ 10 กรกฎาคม 2014, 14:48:57
 :wanwan017:
ตั่งนาน
ขอบคุณครับ
ได้ใช้สักที


หัวข้อ: Re: วิธีทำ Popup ให้กด "Like" Fanpage สำหรับ Blogger
เริ่มหัวข้อโดย: nut_anek ที่ 10 กรกฎาคม 2014, 15:12:51
ขอบคุณครับ


หัวข้อ: Re: วิธีทำ Popup ให้กด "Like" Fanpage สำหรับ Blogger
เริ่มหัวข้อโดย: makoto ที่ 10 กรกฎาคม 2014, 16:00:55
ผมก็ไม่ได้ :-X ไม่มีไรเกิดขึ้นเลย


หัวข้อ: Re: วิธีทำ Popup ให้กด "Like" Fanpage สำหรับ Blogger
เริ่มหัวข้อโดย: virussman ที่ 29 กรกฎาคม 2014, 10:14:39
ลองแล้วไม่ขึ้นเหมือนกันครับ หรือเป็นที่ทีมผม  :-X


หัวข้อ: Re: วิธีทำ Popup ให้กด "Like" Fanpage สำหรับ Blogger
เริ่มหัวข้อโดย: i-happy ที่ 29 กรกฎาคม 2014, 10:32:58
 :P ยากมากๆครับ เฟสปรับเปลี่ยนตลอด


หัวข้อ: Re: วิธีทำ Popup ให้กด "Like" Fanpage สำหรับ Blogger
เริ่มหัวข้อโดย: kinmglovo2u ที่ 06 สิงหาคม 2014, 22:25:21
ขอบคุณครับสำหรับข้อมูลดีๆ  :wanwan017: :wanwan017: :wanwan017:


หัวข้อ: Re: วิธีทำ Popup ให้กด "Like" Fanpage สำหรับ Blogger
เริ่มหัวข้อโดย: Yingyoy029 ที่ 06 สิงหาคม 2014, 22:36:30
Thank you ka  :wanwan019:


หัวข้อ: Re: วิธีทำ Popup ให้กด "Like" Fanpage สำหรับ Blogger
เริ่มหัวข้อโดย: aoy_atom ที่ 06 สิงหาคม 2014, 22:43:00
 :wanwan017: +1 Thank ค่ะ


หัวข้อ: Re: วิธีทำ Popup ให้กด "Like" Fanpage สำหรับ Blogger
เริ่มหัวข้อโดย: deebedding ที่ 06 สิงหาคม 2014, 22:43:48
ขอบคุณค่ะ


หัวข้อ: Re: วิธีทำ Popup ให้กด "Like" Fanpage สำหรับ Blogger
เริ่มหัวข้อโดย: virussman ที่ 07 สิงหาคม 2014, 10:11:23
ทำได้แล้วครับ ขอบคุณครับ


หัวข้อ: Re: วิธีทำ Popup ให้กด "Like" Fanpage สำหรับ Blogger
เริ่มหัวข้อโดย: virussman ที่ 07 สิงหาคม 2014, 10:38:15
จากการทดลอง มีป็อปอัพให้กดไลค์เด็งขึ้นมาครับ แต่...

จาวาสคริปตัวอื่นไม่ทำงานเลย เช่น ภาพสไลโชว์ ไม่วิ่งเลย  เป็นต้นครับ   

ขอบคุณอีกครั้งครับ


หัวข้อ: Re: วิธีทำ Popup ให้กด "Like" Fanpage สำหรับ Blogger
เริ่มหัวข้อโดย: ole16 ที่ 07 สิงหาคม 2014, 10:40:48
แบบนี้นี่เอง ทำได้แล้ว  :wanwan013:


หัวข้อ: Re: วิธีทำ Popup ให้กด "Like" Fanpage สำหรับ Blogger
เริ่มหัวข้อโดย: 3uca ที่ 07 สิงหาคม 2014, 10:45:42
ขอบคุณครับ