How To Add Facebook Invite Friends Link To Blogger

In our last post, we explained in detail that How Facebook can be used as a mass weapon to increase your Blog's traffic.This post is just in that series of increasing your blog's traffic through Facebook.In this post, we are gonna show you how to make a Facebook Invite Friends Link.And when a reader will click on this link a box will appear showing there friends.This is an awesome way to increase your blog's traffic.If any of your reader likes your blog and want to tell his friends about your blog he can easily do this by this link.

Demo:

Invite Your Friends To Our Blog

On Click:

Steps.1: 

• Go to Developers.facebook.com/apps.
• Click on Create New App.
• Enter Your App Name.
• Enter Your Namespace(It means the link which will dispaly your app eg. http://apps.facebook.com/sbm).
• Now, click on Continue.
• Enter Your Contact Email.
• Enter Your App Domain(The URL which will use the Facebook Login).
• Now, go to Select How Your Apps Integrates With Facebook.
• Enter your blog's URL in Website with Facebook Login.
• Enter your blog's URL in Canvas URL(Add a " / " behind the your blog's link).
• Enter your blog's URL in Secure Canvas URL(Change your links protocol to "https" from "http").
• Leave all other thing as they are and click on Save.

Step.2:

• Log in to your Blogger Account.
• Go to Layout.
• Add a Gadget >> HTML/Javascript.
• Paste the below code there.

<script src="http://connect.facebook.net/en_US/all.js"></script>
<script>
FB.init({
appId:'Paste Your App ID',
cookie:true,
status:true,
xfbml:true
});
function FacebookInviteFriends()
{
FB.ui({
method: 'apprequests',
message: 'Invite Friends Message'
});
}
</script>
<div id="fb-root"></div>
<span class="invite-friends-link"><a href='#' onclick="FacebookInviteFriends();">
Invite Friends Link
</a></span>
<script type='text/javascript'>
if (top.location!= self.location)
{
top.location = self.location
}
</script>

• Now, click on Save.

It's done.

Your Invite Friends Link is now working.

• If you want add some styles to it the paste the below code there.

<style>
.invite-friends-link a {
background: url(https://lh4.googleusercontent.com/-k3_hoZ9cD0A/UQ5_LdnkknI/AAAAAAAABKo/K6UX7ygO0kg/h120/facebook.png) left no-repeat;
padding-left: 30px;
line-height: 30px;
font-size: 16px;
font-weight: bold;
color: #3b5998;
display: block;
}
</style>

Enjoy with your Invite Friends Link.