How To Force Your Readers To Like Fan Page

To get started with your small blog business or website the first point comes out in our mind is promotion of blog. Facebook gives opportunity to make a static brand page to promote online business, called Facebook fan page. The subscriber receives daily updates directly on their wall whenever blog's owner update status on blog.

The number of subscriber will then increase when readers on your blog click on Facebook fan page like button. Like button is a small widget placed at different position of blog, which force readers to like the page.

So the widget given below force your reader to like the page by popping out at a time when any reader visited on your blog.  

How To Add Facebook Popup Like Box

Why Use This Widget ?

• Strongly force the readers to like the page
• Can be repeatedly popup
• Will not closed unless readers perform like action

So lets add this fantastic widget on blog

How To Add Popup Like Box In Blogger Blog

1. In Blogger dashboard, Go to Design /  Page Element.
2. Click Add a gadget and then choose HTML /  JavaScript.
3. Paste the following code in it.

<!-- http://moreforblogger.blogspot.in/  -->
<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://connect.facebook.net/en_US/all.js#xfbml=1"></script>
<script type="text/javascript">
//<![CDATA[
 kakinetworkdotcom01username="moreforblogger",
 kakinetworkdotcom01title="Join us at Facebook!",
 kakinetworkdotcom01skin="01",
 kakinetworkdotcom01time="20",
 kakinetworkdotcom01wait="5",
 kakinetworkdotcom01lang="en"
//]]>
</script>
<script type="text/javascript" src="http://kakinetworkdotcom.googlecode.com/svn/01/files/likeboxfbfanpro.js"></script>
<script type="text/javascript">
//<![CDATA[
 $(document).ready(function(){$().kakinetworkdotcom({ closeable: true });});
//]]>
</script>
<!-- http://moreforblogger.blogspot.in/  -->

Modification

• Replace moreforblogger with your Facebook fan page username
• Join us at Facebook is title of widget
• How long like box will display on blog is define by 20. ( means 20 second ) after 20 seconds it will close automatically
• 5 define the time in minute after which it will popup again.

And if you liked this post, please consider sharing it. Thanks!

Read More

Facebook Like Button For Blogger

This Tutorial will help you in adding a Facebook Like Button For Blogger. Facebook has come up with a new set of Social plugins which enable you to provide engaging social experiences to your users with just a line of HTML. The Facebook Like Button is One of them. You can see a demo of the like button on this page. The Facebook like button will allow your readers to quickly share your posts with their Facebook Friends. You can also get to know how many people liked your Blog Post .This tutorial will teach you to add a Facebook Like button for Blogger

 

How to Add the Facebook Like Button Below every Post

1. First Generate the Facebook code using the options below. (Code will be updated with these details)

Button Type	Standard Button CountBox Count
Text on Button	LikeRecommend
Show Send Button	YesNo
Color Scheme	LightDark
Font	arial lucida grandesegoe ui tahoma trebuchet ms verdana
Float	None LeftRight
Location of the Button	Below the Post Content Above the Post Content
Display	On Post pages only EverywhereEverywhere other than Static Pages

<div>
<b:if cond='data:post.isFirstPost'> 
<script>(function(d){
  var js, id = 'facebook-jssdk'; if (d.getElementById(id)) {return;}
  js = d.createElement('script'); js.id = id; js.async = true;
  js.src = "//connect.facebook.net/en_US/all.js#xfbml=1";
  d.getElementsByTagName('head')[0].appendChild(js);
}(document));</script>

</b:if> 
<fb:like expr:href="data:post.canonicalUrl" layout='standard' send='true' show_faces='false' font="arial" action="like" colorscheme="light"></fb:like>
</div>

2. Copy the Above code. Login to your Blogger Account and go to Design > Edit HTML and click on the check box which says “Expand Widget Templates”
3. Look for <data:post.body/> and immediately below that place the copied code.
4.Next you have to add the fb namespace to your template tag.Your template should have the specification for the fb tag that you have used. The following namespace declaration will take care of that. To declare the namespace, find

<html

and change it to

<html xmlns:fb="https://www.facebook.com/2008/fbml"

The following screenshot will help you out.


              

This is necessary for all FBML widgets using the fb tag.  So if you have already added the namespace while adding some other FB plugin, then you can skip this.
4. Now Save the template and you should see the Like Button near each of your posts. You are done :)

Read More