Tutorial to Add Facebook popup like button to your Blogger

Facebook is one in every of the biggest social network in the world and it can positively help you to extend the traffic to your site by using correct strategies. Social media ranking is now essential to make up a good traffic to your website as well as increase the ranking of your web site too. Following tips are get from move2tech.com .Here are some steps to add facebook popup like button to your blogger.
1. Log in to your blogger then select Dashboard then click Design of appropriate blog and select Edit HTML.
2. Don’t click the “Expand Widget Template” check-box in the layout
3. Find the in HTML code bellow
(hint: use Ctrl+F in then type and enter, so you can easily find that)

4. Replace it with bellow codes
<body>

<!– move2tech.com Likebox Pro FBFan Code Start –>

<script type=’text/javascript’>

//<![CDATA[

KNFBFansPRO=’Become a move2tech.com fan‘

//]]>

</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 src=’http://yourjavascript.com/19111310151/jquery.js’ type=’text/javascript’/>

<script src=’http://connect.facebook.net/en_US/all.js#xfbml=1′ type=’text/javascript’/>

<script src=’http://yourjavascript.com/30211988321/FBBOX%20bloggertipz.js’ type=’text/javascript’/>

<script language=’javascript’>

//<![CDATA[

$(document).ready(function(){

$().KNFBFansPRO({

timeout: 10,

wait: 0,

url: ‘http://www.facebook.com/pages/tricksjobsadda‘,

closeable: true });

});

//]]>

</script>

<div id=’fbtpdiv’/>

<!– move2tech.com Likebox Pro FBFan Code End –>
5. Remember to change above red colour parameters according to your facebook fan page

i. Title – Name of your Fan (ex :Become a move2tech.com fan)

ii. Time you need to Auto close- 10

iii. Facebook Url page- http://www.facebook.com/pages/tricksjobsadda
6. save and preview.

By properly doing following steps you can easily create  facebook popup like button to your Blogger very easily. Floating social buttons also got the best features on social media optimizations and I post article on how to integrate social media floating buttons on blogger in previous article.
Tutorial to Add Facebook popup like button to your Blogger Tutorial to Add Facebook popup like button to your Blogger Reviewed by Newstechcafe on May 08, 2015 Rating: 5

No comments:

Featured Posts

Powered by Blogger.