Adding Facebook Login to your website dramatically simplifies your user login experience, can increase user engagement and increase customer conversion rates. As I mentioned in my previous blog post social login is growing and Facebook is leading the way. In this post I will talk about how to connect Facebook Login to your website with the help of Stitchz Social Login.

Create a Stitchz Social Login App

The first thing you'll need to do is create a Stitchz Social Login account. Go to the login page, and sign in with the social identity of your choice, Figure 1.

Figure 1 - Select a Social Login to sign in with
Once logged in, create a new application by hovering your mouse over the Applications menu at the top, then click the Create Application link, Figure 2.
Create a new Social Login Application Button
Figure 2 - Create a new application
In the new application page, select the type of application you'd like to create. There are three choices, Basic, Professional, and Enterprise, Figure 3. The differences between the three can be found on our , but in general they are around how many logins per month and how many providers you can setup for your site. The application type can be changed at any time, so for now, select Basic.
Select an Application Type for the new application
Figure 3 - Choosing an application type
Next, enter the new application's details, Figure 4. The fields with the red asterisk are required. The application name, which must be unqiue, accepts only letters and numbers and cannot contain spaces. The application name will become your "App Url" and you'll use it when setting up your credentials with Facebook Login, write it down or copy it (we'll talk about this later).
New application details form
Figure 4 - New application details
Enter the description of your application and the full Url of your website's Favicon if you'd like. Your Domain is exactly as it sounds, your website's root domain name, i.e. example.com, without the "http" or "www" in front of it.
The Return Url is an end point or page on your website that is ready to accept a POST back from Stitchz containing a one-time unique code or "token". If you're using one of our CMS plug-ins (i.e. Drupal, Wordpress, etc.) the Url is simple, usually "https://www.yourwebsite.com/stitchz_social_login/auth", otherwise make sure your website is ready to accept a POST request from Stitchz and enter that full Url. Check the "Web Site Set Up" page for your application for more details.
Next, enter the Url to your website's privacy page and the domain(s) you will be sending your authentication request from in the Privacy Url and Whitelist Domains fields respectively.
Finally, the domain(s) in the Whitelist Domains field is a comma separated list of domains, and it is very important as Stitchz Social Login will only accept requests from one of the domains listed, i.e. "localhost, yourdomain.com".
Once all the fields are complete click the "Create" button at the bottom.

Adding Social Login Providers

Now your application has been created, but no social login providers have been setup, that's our next step. To add a new Social Login Provider, a wizard will walk you through each step in creating a new provider, Figure 5. First, select a Social Login Identity Provider from the drop down list. The envelope icon next to a provider name indicates that the respective provider offers the user's email address in their profile data. As the wizard walks through each field, you will be asked to enter an App Key and Secret Token, we'll go to Facebook Login to get those after saving the new provider, for now, enter "0000000000000000000" for both fields. Write down or copy the "Stitchz Return URL" as we'll need this next. Click Save.
Create a new Identity Provider
Figure 5 - Add new Identity Provider
After saving your provider, you'll be asked what permissions (or scope) you'd like to request from each end user logging in to you website. Select only the permissions you need, selecting too many without proper justification may scare your end users off. Click "Save" at the bottom.

Create a Facebook App

Open a new browser window and go to: https://developers.facebook.com/apps. Click the "Create New App" button to create your Facebook application. A new dialog box will open asking you for your website's details. Enter a descriptive name for your "Display Name", this will be presented to your end users when they login, that way they will be absolutely clear where and what they are logging in to. Next select a "Category" that your website fits into and click "Create App".
On your new App's Settings page, write down or copy the "App ID" and "App Secret" values, you may need to click on "Show" to get the values. Remember the "App URL" from when you created you application above, add that as your Facebook "App Domain" (if you don't remember it go to your Stitchz application's Settings page). Then, take your "Stitchz Return URL" from above and copy that into your Facebook "Website > Site URL". Click "Save Changes" at the bottom.

Final Setup

Now, go back to your Stitchz Social Login list of Providers and click on "Edit" to open the Facebook edit dialog box. Enter your "App ID" and "App Secret" copied from Facebook into the Stitchz "App Key/ID" and "Secret Token" fields respectively. Click "Save".
If you're using one of our CMS plug-ins (i.e. Drupal, Wordpress, etc.) then go to your administrative page and configure the plug-in per the instructions. If not, your Return URL should be ready to accept a POST from Stitchz with a one time unique key or "token". Take the token submitted to your website by Stitchz and POST it back to your App URL (https://yourappurl/Authentication/v1/Auth) along with your desired response format (XML or JSON). Stitchz will verify your token and send back the authenticated user's identity packet. Take the response and log the user in to your website.
That's it! Now your end users are ready to begin logging in with their Social Identity!
If you need any further help getting started let us know.
 
 
 
How often have you heard from website users they forgot their username and password or requests to reset passwords only to forget which email account they signed up with? It is likely a common issue that can go unresolved when trying to persuade users by selling a product, blogging or communicating through social media.
With the vast number of different websites requiring a username and password, it is nearly impossible to remember all of them. 90% of users who forget their username and password combination end up leaving the website instead of retrieving or resetting it.
A 2012 study published by Blue Inc., shows that 4 out of 5 consumers avoid creating or registering a new account. The study indicates that only 14% will create a new account, 32% will leave or go to a competing site, while the remaining 54% may never return.
A website registration process can be cumbersome and often ask for information the user does not want or need to share. When unnecessary information is required to create a new account, users often provide incorrect or incomplete data. Because of this, many users receive marketing promotions or information that is irrelevant to them. When trying to engage users this can be disastrous causing users to lose trust or ignore future communications.
According to the 2012 study mentioned above, given a choice, 41% of website visitors prefer to use their social login identity to create a new account over a guest account (24%) or new account (35%). That means that 2 out of 5 visitors would rather use their existing social media account. Adding a social login option to your website could translate into retaining over one-third of the 86% that would have ended up leaving and probably not returning. Combined with the 14% that said they'd create a new account, you would potentially retain over half of your website visitors!
social iconsAs social media use grows so does the number of people using it. In January of 2014, Facebook announced that at the end of 2013 they had over 1.23 billion monthly users and over 757 million daily users; that's a lot of social media users.
With social login you get social profile information which can be used to customize a website visitor's experience. Associating your website with a trusted brand such as Facebook, Twitter, Google, etc., you establish a trust with your users that lead to a higher visitor return rate, higher likelihood of purchasing products, and an increase of site referrals and recommendations.
To get started, sign up for a Stitchz account today, or contact our sales department for more information.