.....

Bloggerkini

Blogger Tutorials and Tips. Together We Learn !

Facebook Like Box On Start Page

Tutorial How to make Facebook Like Box Appear On Start Page Your Website
Cara Nak buat Facebook Like Box Keluar Masa Website di Lawati 


This tutorial is about to make your own facebook page like box appear on your website start. This tutorial and code is provided and copyrighted by KakiHeboh[dot]com. Please respect the copyrights and do not remove the credits.
Before we proceed, do you have your facebook fan page already? If not grab one Here. And also get your facebook page url Here.




Now let’s proceed with the tutorial (for blogspot user only!):
1. Go to Design > Edit HTML
2. Download Full Template for backup.
3. Click on Expand Widget Templates.
4. Copy code below.


<!-- KakiNetwork.Com Likebox Pro FBFan Code Start -->
<script type='text/javascript'>
//<![CDATA[
KNFBFansPRO='Bloggerkini'
//]]>
</script>
<style>#fblikepop{background-color:#fff;display:none;position:fixed;top:200px;_position:absolute; /* hack for IE 6*/width:450px;border:10px solid #6F6F6F;z-index:200;-moz-border-radius: 9px;-webkit-border-radius: 9px;margin:0pt;padding:0pt;color:#333333;text-align:left;font-family:arial,sans-serif;font-size:13px;}#fblikepop body{background:#fff none repeat scroll 0%;line-height:1;margin:0pt;height:100%;}.fbflush{cursor: pointer;font-size:11px !important;color:#FFF !important;text-decoration:none !important;border:0 !important;}#fblikebg{display:none;position:fixed;_position:absolute; /* hack for IE 6*/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:#6D84B4 none repeat scroll 0 0;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:30px;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>
<script type='text/javascript' src='http://yourjavascript.com/19111310151/jquery.js'></script>
<script type='text/javascript' src='http://connect.facebook.net/en_US/all.js#xfbml=1'></script>
<script type='text/javascript' src='http://yourjavascript.com/563413226/[KN]likeboxfbfanpro_english.js'></script>
<script language='javascript'>
//<![CDATA[
$(document).ready(function(){
$().KNFBFansPRO({
timeout: 14,
wait: 0,
url: 'http://www.facebook.com/Bloggerkini',
closeable: true });
});
//]]>
</script>
<div id='fbtpdiv'></div>
<!-- KakiNetwork.Com Likebox Pro FBFan Code End -->


5. Press Ctrl+F and type <body>. Paste the code after it.


6. Change the code just what you want it works.
6.1 - Change the NAME : Bloggerkini --> your facebook page name
6.2 - Change WAIT TIME (in second) : 14 --> what time you want
6.3 - Change URL : Bloggerkini --> your facebook page url. Grab Here.


6.4 - Change APPEAR AFTER TIME (in minute) : 0 --> recommended setting is 15, means, when people open your site it will appear at first time and will appear again after 15 minutes. *Do not set it 0, because it will be appear every second your visitor viewing your site page.
6.5 - Change CLOSE BUTTON : true for with close button, false for without close button.

7. Click Preview button first, if you like it then click Save Template. You done!


**If this code did not work, we recommend you to change your blog template because this code will work correctly with an older template design or a simple blog template. Ours other site also got same problem, then we change our template and it works without any problem after that.


Important : This code was copyrighted by KakiHeboh.com (respect copyrights)


Like this tutorial?
.
Please Share This ! :)





Asbestos
I'm Asbestos the main author of Bloggerkini.com. I wrote more about blogging tips and tutorial. Also share with the reader how to make money online. I blog since 2005 and this is my brand new blog. Like Us on Facebook, Follow on Twitter, be a Member on Blogger and Join Us on Google Plus+

12 comments:

Unknown said...

got confusion? leave your text here.. we will help you.

HANI HUNNY said...

wow it really works! thanks!!

Unknown said...

@hani, yes.. cool..

Unknown said...

bos..mmg setiap kali kt tekan tajuk post akan keluar benda ni eh?

Unknown said...

@hudzrul, tak lah.. cuma first visit je keluar.. yang penting kena set kan "wait" tu jadi kan 15 utk 15minit, 30 utk 30minit.. kalau "wait" setting tu set 0, maka tiap2 kali tekan tajuk mmg akan keluar lah.. faham ke??

Unknown said...

da jadi.. tenkiu.. jom laa tgk blog saya lak.. http://brherbaresources.blogspot.com/ ps2 like page skali.. heheh tengs :)

Dr.R.P.Sharma said...

Thank you.I successfully implemented it on my blog www.teluguthesis.com

Unknown said...

body car xjmp cmne?

Unknown said...

body cari xjmp cmne?

Unknown said...

kenapa close button tak muncul pun?

Rozila said...

tak jadilah..boleh bantu tak

Unknown said...

finally!! thank you!!
http://pdajawe.blogspot.com/


Subscribe via Email

Please verify your email by clicking the link from Google Feedburner in your inbox. Yes, we respect your privacy. You can unsubscribe anytime.


PopAds.net - The Best Popunder Adnetwork

Followers

Subscribe via email

Enter your email address:

Delivered by FeedBurner


Track



Sponsor

Tweet Page

Blog Archive

Need Support

If you like our blog, then kindly spread our voice using the badge below:

Bloggerkini Tips

OR

Pick a Cool Banner.

Popular Posts

Recent Tutorial

Recent Posts

Advertisement