This is one of the best widget every bloggers should have on their blog's, it's one of the best way to create a large audience for your blog. The main function of this facebook invite friends link is that it will allow your blog readers to invite their facebook friends to your blog.
Example of this facebook invite friends link can be found at the sidebar of this blog, and for a demo of how it works, simply click on the link. You will see a pop-up window which will show the list of all your facebook friends and you can invite anyone that you have the interest to notify about the blog/site.
The first step is to create a secure base url, you can create one at bit.ly. Copy the new generated shorten url and save it somewhere because you are still going to use it in this tutorial.
Now you will need to create a facebook application as you'll need an App ID. go to facebook developer page, and create an application. in the first pop-up box, fill it as follows:
- App Name: enter the name of your site (e.g RealcomBiz)
- App Namespace: also enter the name of your site, as it will feature in the url of your app (e.g http://apps.facebook.com/realcombiz)
- Click on Continue.
- Contact email - Enter your email address
- App Domains - The URL(s) of the blog(s) you will be using this app for (eg: http://yourblog.blogspot.com or yourblog.blogspot.com)
- Website with Facebook Login - Your blog's URL (eg: http://yourblog.blogspot.com)
- Canvas URL - Here you'll need to enter the bit.ly url you generated for your site, adding a question mark at the end. (e.g http://bit.ly/YklQKY?)
- Secure Canvas URL - Enter your blog's bit.ly URL beginning with https and add a question mark at the end (eg: https://bit.ly/YklQKY?)
You can see the screenshot below for more clarification.
When you have fill-in all your details, click on "Save Changes" and copy your App ID as identified in the screenshot above.
- Go to your blogger dashboard
- Copy and paste the following code in the content box
message: 'Your Message Here'
<span class="invite-friends-link"><a href='#' onclick="FacebookInviteFriends();">
Invite Friends Link Text
if (top.location!= self.location)
top.location = self.location
- Replace Your App-ID with the app id you copied from facebook developer page.
- Change Your Message Here to your preferred text
- Change Invite Friends Link Text to your preferred text.
- Go to Template > Edit HTML > Proceed
- Use ctrl F to find ]]></b:kin> and paste the following code above/before it.
background: url(http://2.bp.blogspot.com/-E5PpxJP0Dr4/T_YWB_HvV-I/AAAAAAAADSk/7fIRr2gw-B0/s1600/facebook.png) left no-repeat;
Now save changes and you are done.
We like to hear your feedback or suggestion concerning this Facebook invite friends link.
*Please confirm the email sent to your inbox after clicking "Sign Up!".