Social Logins
Before We Start
Social logins require a little bit of preparation, but it's really worth it. We've worked hard to shoehorn both Google and Facebook social logins and to do it in a way that maintains all the normal UserSpice goodness.
What makes the UserSpice implementation so unique is that it allows your users to use all 3 methods (traditional, Facebook, and Google) without winding up with 3 accounts. If your user has a traditional account, they can choose to use either of the social options at any time and it will make zero difference in their experience. If the first time they user creates an account using one of the social options to begin with, they can simply click the "forgot password" link to make themselves a password and can use all 3 methods. If that doesn't make sense, you'll just have to keep going and it will soon.
PLEASE NOTE: It can take a few minutes to 1 hour for those callback URLs you setup to be active in Google/Facebook's system. Give it a little time.Setting up Google
Note: It seems as if FB and Google change these settings weekly. If these instructions are wrong, please let us know in the forums! Step 1: Visit https://console.developers.google.com(You may have to create an account)Step 2: On the left side, click "Credentials"
Step 3: Click "Create Credentials-->OAuth Client ID-->Web Application"
Step 4: Give it a name.
Step 5: For "Authorized Redirect URI's, add the complete path to the oauth_success.php file. If you are on localhost in a subfolder called userspice, use
FOR US 4.4 and below: http://localhost/userspice/users/oauth_success.php
FOR US 5.0 and above: http://localhost/userspice/usersc/plugins/google_login/assets/oauth_success.php
If you are on mydomain.com, use
For 4.4 and below use: http://mydomain.com/users/oauth_success.php/
For 5.0 and above use: http://mydomain.com/usersc/plugins/google_login/assets/oauth_success.php/
Step 6: Click Create.
Step 7: Copy your Client ID and Client Secret and put them in the UserSpice Admin Dashboard.
Step 8: On the UserSpice Admin Dashboard, put the full url of your website (including subfolder if necessary)
Step 9: Put the full path to your oauth_success.php file (should be the same as the one you put in the Google console).
Step 10: Change Enable Google Login to "Enabled"
Step 11: Save your settings.
Step 12: Give it a whirl!
Step 13: Visit the forums if you have any issues.
Setting up Facebook
Note: It seems as if FB and Google change these settings weekly. If these instructions are wrong, please let us know in the forums! Step 1: Visit https://developers.facebook.com/(You may have to create an account)Step 2: On the upper right click My Apps-> Add New App
Step 3: Give it a name and email and click Create App Id
Step 4: Check Integrate Facebook Login and click confirm.
Step 5: Copy your App ID and App Secret to the UserSpice FB Social login settings page.
Step 6: On that same page set the callback url as
On 4.4 and below: http(s)://yoursite.com/users/fb-callback.php
On 5.0 and above: http(s)://yoursite.com/usersc/plugins/facebook_login/assets/fb-callback.php
Step 7: Set FB Graph to v3.2 and Redirect After Login to index.php or users/account.php or whatever you want.
Step 8: On the FB Dev page give your app a category. Fill out other info as you wish. Click Save Changes.
Step 9: On the left side click advanced
Step 10: Click Add a Domain. Add your domain with https and http Click exact match. Click save changes.
Step 11: On the left under Products->Facebook Login click settings
Step 12: Under Valid Oauth Redirect URIs enter the same thing you put in step 6.
Step 13: Click save changes
Step 14: You can test this at the bottom by pasting that same URI in the URI validator and clicking check. Green is good.
Step 15: Cross your fingers, and give it a whirl. This is Facebook and they like to move fast and break things.