Jump to content
xisto Community
Sign in to follow this  
Jonnii

Help Needed: Facebook Connect How to integrate facebook into website..

Recommended Posts

Need some help putting facebook connect on my website. Ive managed to do the 'like' page part but cant set the rest up so they can log in and register to the site using their current facebook account.Can someone please help me do this? Stuck on the code side of things. Thanks in advance.

Share this post


Link to post
Share on other sites

In this tutorial I will try to explain How to put a basic facebook login button next to a comment form so that users can login through their facebook accounts and are then allowed to comment on your blog.
You need to edit the source code of the page where you want the facebook login button to appear. Open the source code editor and enter the code
<fb:login-button onlogin="alert('Authenticated!');"></fb:login-button>
You see it is a simple html tag. It allows you to easily incorporate facebook components into your webpage. But in order to make this work you are going to need a little bit of javascript. Add the following to your webpage (the best place to add this javascript is just above the closing body tag in your page.
<script type=âtext/javascriptâ src=âhttp://forums.xisto.com/no_longer_exists/;
The second step is to add another script to tell facebook who you are and how to communicate with you. To do this add the following code;
FB.init(âyour application keyâ, âcross domain receiver fileâ)
As stated within the code, the first argument is your application key and the second argument is the cross domain receiver file. Both of these are explained below. Facebook treats every website as an application and you need to go to facebook to get an application key. Go to facebook developers /?_fb_noscript=1. This is the place where you can configure all your application settings. It is a dedicated platform from facebook to users like you and me where we can develop our own facebook application. At the developers page, click âsetup a new applicationâ. You need to enter two fields to get you started. The first is your application name. This is what your users will see when they connect to your website. So make sure that it is something recognizable. After entering a name, you need to click the âoptional fields buttonâ and then enter the root url of your website in the field âBase Domainâ. Edit further options if you want but I recommend to leave them as they are. Click âsubmitâ to complete their application. When your application is created, you will se to special key visible to you. The first one is titled API key and the second one is Secrets. Other things visible on this page are application id and contact email etc. Copy the API key and paste it into the âyour application keyâ in the FB.init code. The second argument was the url to your cross domain receiver file. It should be a simple url to a page that enables secure connection between your website and facebook. Create a new file within your websiteâs root directory and name it something like âcross_domain_reciever.htmâ or something you can remember. Enter the filename in the cross domain receiver file argument. You need to do one more thing to make sure that your html code is standards compliant. You need to make an extra xml name space declaration in the html tag at the top of the page. The declaration should look something like below:
xmlns:fb=http://forums.xisto.com/no_longer_exists/
Thatâs it. Check how it works by refreshing the page. You should see a connect button at the place where you added its code.

Share this post


Link to post
Share on other sites

Create an account or sign in to comment

You need to be a member in order to leave a comment

Create an account

Sign up for a new account in our community. It's easy!

Register a new account

Sign in

Already have an account? Sign in here.

Sign In Now
Sign in to follow this  

×
×
  • Create New...

Important Information

Terms of Use | Privacy Policy | Guidelines | We have placed cookies on your device to help make this website better. You can adjust your cookie settings, otherwise we'll assume you're okay to continue.