Getting started with our Joomla templates “Login with Facebook” feature

Last Updated:
Category:
Joomla

We have received many questions from our customers who have had difficulty implementing the “Login with Facebook” feature found in our templates. As a service to those who continue to require guidance, here is a step-by-step checklist of actions required to ensure successful activation of the Facebook login function on your website. Before diving into this tutorial, ensure that you update your GavickPro template to the very latest release as there have been many changes to the Facebook API since we added the “Login with Facebook” option.

Note: You will need a Facebook App ID before you start using Login via FB.

  1. Go to developers.facebook.com.
  2. Log into Facebook.
  3. Choose “Apps” from the top menu.

    Use this URL: https://developers.facebook.com/

    Use this URL: https://developers.facebook.com/

  4. Click the “Create New App” button located under Apps menu.

    FB: Create a New App menu

    FB: Create a New App menu

  5. In the pop-up window, indicate “Display Name” (the namespace field is not required) and choose category “Apps for Pages”, then “Create App”.

    FB: Fill fields

    FB: Fill fields

  6. You should now see a reCaptcha window where you need to re-type text appearing in an image into a textbox.

    fb-4

  7. After clicking on “Submit”, the new application should be added.Now under Apps menu you should see new Name.
  8. In the field, “App Domains”, type out the root of your domain, such as: “www.gavick.com” (the latter form depends upon your domain redirect settings). Please also check option called “Website with Facebook Login” – and also there type the domain name with http protocol.

    APP ID and APP secret

    Copy APP ID and APP secret code

  9. You can also also Add platform –> Website to insert Site URL and Mobile URL.
  10. Copy the APP ID and APP secret from the area near the application icon.
  11. Log into your Joomla template administration panel and go to Extensions -> Plugin Manager.
  12. Locate the plugin called, “Authentication – Facebook” and open the configuration. If you cannot find the plugin with this name in your plugins listing, then you had probably installed the clean template and not the quickstart version. In this case, you must find this plugin in the ‘rest_files’ package downloaded from the template download page and install it.
  13. Fill out the “Facebook API App ID” field with the APP ID generated from the Facebook page and the “Facebook API Secret” with the APP secret key.

    In plugin

    In plugin Authentication – Facebook insert FB API app ID and API secret code

  14. Ensure that the plugin status is set to “Enabled”.
  15. Our advice is to leave the option “Auto-register” as Enabled.
  16. Then save the configuration.
  17. Still from the back-end, choose Extensions >> Template Manager and choose the active GavickPro template.
  18. Open the “Social API” tab and in the field labelled “Facebook API ID”, paste the same API ID key like in plugin settings.

  19. In the Social API tab you can also specify the default language for all Facebook-related plugins.
  20. Be sure the option, “Use Facebook Logion” is set to ON.
  21. Go to your site’s login page and click on, “Login with Facebook”. You should see a pop-up window for entering the Facebook login and password details. If you are already logged into Facebook (a session was created), you will be automatically logged into the site and redirected to the user account page.
Getting started with our Joomla templates “Login with Facebook” feature 4.045 (80.83%) 24 votes

This article was first published

Villa Belluci - View our NEW theme
×

Tutorials & tips delivered regularly

Expand your purchase with regular tutorials and tips to making your site better, direct to your email.