How To Add Facebook Invite Friends Widget To Blogger

Previously we shared social networking widgets like buttons , follow buttons and many more... These widgets helps viewer to like , follow and as well as share . Today we are sharing Invite friends widget . This widget send invites to facebook friends regarding who click on this . This is easiest way to get interact with viewers and also helps to gain traffic from social networking sites .

See Live Demo Below :

Invite your friends

Tutorial : How To Add Facebook Invite Friends Widget To Blogger

• Login To Facebook .
• Now go to Facebook Developers Page .

(Note : If you are not a developer then register for first time and the proceed )

Now click on Create new app .

Fill the blanks with required content and click on Create App .

You had successfully created app and your app is live (Development mode only) .

Note the APP ID .
Now click on settings and Add platforms Select Website in options .

Give URL of your blog as well mobile site URL .

Click on Save Changes .

Congos , You had successfully created app .

Steps To Add Facecbook Button To Your Blog :

Log in to blogger dashboard .
Click on Layout tab and click on HTML/JAVASCRIPT .
Copy the below code and paste the widget anywhere in your blog .

<style>
 .BL-FB a {
  font-family: tahoma, verdana, arial, sans-serif !important;
  font-weight:bold !important;
  font-size:12px !important;
  width:150px !important;
  border:solid #29447e 1px !important;
  border-bottom:solid #29447e 1px !important;
  cursor:pointer !important;
  padding:6px 6px 6px 6px !important;
  background-color:#5c75a9 !important;
  border-top:solid #8a9cc2 1px !important;
  text-align:center !important;
  color:#fff !important;
  text-decoration:none  ! important;
 }
 .BL-FB a:active {
  background-color:#4f6aa3 !important;
 }
</style>
<script src='http://connect.facebook.net/en_US/all.js'></script>
<script>
 FB.init ({
  appId:'674573502616101',
  cookie:true,
  status:true,
  xfbml:true
 });
 function FacebookInviteFriends () {
  FB.ui ({
   method: 'apprequests',
   message: 'Invite your friends'
  });
 }
</script>
<div id='fb-root'></div>
<span class='BL-FB'>
 <a href='#' onclick='FacebookInviteFriends();'>Invite your friends</a>
</span>
<script type='text/javascript'>
 if (top.location != self.location) {
  top.location = self.location
 }
</script>

Change The APP ID with your APP ID .

Note :  If you apply this widget more than one time in your blog Button will not work and it will show error . 


Like and Share Articles .

Having any trouble applying this tutorial feel free to comment below .