Introduction of Magento Social Login Extension by Knowband:
Magento Social Login Extension by Knowband allows users to login via their social accounts out of prvided 15. For example Facebook, Google Plus, Twitter, LinkedIn, Live, Yahoo, Instagram and many others. The Magento social login plugin is designed to simplify the logins for the users. By integrating social login plugin on your Magento store, you allow your visitors to login to your website with their existing social network accounts.
Steps For Installation of Magento Social Loginizer Extension:
Required Materials:
- All files used by the extension.
- FTP access to your website.
The connect manager is a useful tool for installing Magento extensions, but prefer hands-on method when it comes to installations. It feels more comfortable when you are personally in control of the process.
Do you see an app-code directory there, what about app-etc-modules? If you don’t see these directory paths and files contained within them, chances are that the extension download was faulty. Take a look at the package.xml file, this is the blueprint used by Magento Connect to arrange the files in the proper places. You may need to use this to ensure that everything is as it should be. Once you have reviewed the extension files you are ready to perform the last step. Using your ftp client, drag all of the files onto the store root of the magento instance.
Depending on the number of files in the Magento extension by Knowband, this may take a few moments. Now go to the admin console and click Flush Cache Storage. This is the requirement for any extension that adds pages to the admin console. Logging out and back in is also required to ensure that everything loads properly. If you cannot clear the cache via the admin console for any reason, you will need to clear the cache manually via your FTP client (see the first FAQ question for assistance). That is the final step. Congratulations on a successful installation.
Troubleshooting & FAQs
I loaded all files onto my Magento store, and now get a white screen for some or all of the admin console.
This is a fairly common problem, and 99% of the time it is cache related. If you can get to it, go to System->Cache Management and click Flush Cache Storage. This will ensure that everything cached by Magento is deleted and will to be regenerated. Log out and back in to complete the process.
If you are completely cut off from the admin console, navigate to the var-cache directory of your website. You should see a series of directories named mage*. Delete all of these directories (DO NOT DELETE var-cache). This is the equivalent of flushing the cache storage from the admin console.
I am receiving a Magento error when accessing certain pages. How can I debug this?
This question really deserves a blog post all to itself, but a good start would be to go into the errors directory of your store. Locate the local.xml.sample file and rename it local.xml. The next time you see the error detailed information will be provided explaining where the error took place. Dont forget to change this back when you are finished troubleshooting!
I have a critical error with my webstore and need to turn off an extension I cannot access the admin console. What do I do?
Go to the app-etc-modules directory and open the file that goes with your extension. The naming convention is generally DeveloperName_ExtensionName.xml. In this case it would be Velocity_SocialLoginizer.xml.
Look for the active tags in the file, change the value from true to false and save your changes. This tells Magento that the Magneto extension is disabled and not to run any code associated to it. Deleting the Magento cache is recommended (and most likely required) for this change to take effect.
User Guide
To excess Magento Social Loginizer plugin, Click on Social Loginizer Menu appearing in System Menu navigation menu as shown below.
After clicking on Social Loginizer menu, the Magento social login plugin by Knowband will open. It contains navigational bar at the top, Tab menu at the left and in main content the first general setting tab will display.
General Settings Tab
General Settings:
- Active: To enable the Magento facebook login extension plugin, select enable present under the label Activate.
- Show At :
Login Popup: To enable the login popup.
Checkout Page: To add Magento social media login plugin on checkout page.
Login Page: To add social login bar on login page.
Registration Page: To add Magento social login extension on registration page.
- Test for Popup Link: Set the text for login popup link which will shown next to default login link of the Magento social login plugin.
- Test for Heading: Set the text for heading of social media login plugin Magento which will shown on selected pages.
- Include jQuery File: jQuery i.e. a javascript framework is required for this Magento plugin to work. Sometimes themes used in Magento already includes it but sometime they do not. If jquery is already included in your theme then deactivate else activate to include it.
- Default Visible Option: Select the no. of social icons to be visible by default on Magento social media login extension.
NOTE : In Magento social login module, only small icons will be visible and only maximum 6 icons will be visible.
- Animate Icons: Activate this option to turn on the animation effect on icons of Magento social login.
- Sort Icons: This option of Magento social media login allow to sort the order of icons in which they will display at login bar and login popup.
Loginizer Settings Tab
In this tab of Magento twitter login extension, you can save API key and Secret for each social website. There is a side bar listing all the websites. On click of any website its corresponding setting options will be shown. Below option there a link of corresponding website where you can create your application and get your client id and secret. In each website settings there will be following 4 options:
Website Settings:
- Active: To enable the Magento social login, select enable present under the label Activate.
- App ID (eg. for Facebook : Facebook App Id): In this field of Magento social media login, you need to enter your Application ID/Client ID/Consumer ID provide by corresponding website
- App Secret (eg. for Facebook : Facebook App Secret): This field of Magento social login extension allows you to enter your Application Secret/Client Secret /Consumer Secret provide by corresponding website.
- Select Icons: For each Magento social login, there are two kind of icons small and large. Select any one of the icon to show at social login bar.
Report Tab:
In this tab of Magento social login module, you can get graphical and tabular analytic data that will help you for analysis. There is a option of select website. On click of the option a dropdown listing all the websites will display choose websites and click on the submit button. That will create a graph for the selected website represent login and registration count for each selected websites.
In the graph below, you can see the table for website analysis and another table for customer analysis data. The website analysis table show websites and their total login and registration count and the customer analysis table shows customer details and his login details (login count and website name).
At top right , there is button Reset Database. This option will delete all the login and registration data from database. This will not affect your core database table. It will clear records only from the table created by this magento social media login extension.
How To Set Redirect URL?
Let your website url be www.example.com.
If Url Rewrite is enabled in your website then redirect url will be
Unsecured Url: https://www.example.com/socialloginizer/index/vssSoloApi/
Secured Url: https://www.example.com/socialloginizer/index/vssSoloApi/
If Url Rewrite is disabled in your website then redirect url will be
Unsecured Url: https://www.example.com/index.php/socialloginizer/index/vssSoloApi/
Secured Url: https://www.example.com/index.php/socialloginizer/index/vssSoloApi/
How To Get Facebook App Details?
Steps:
1. Go to Facebook Developers Website (https://developers.facebook.com) or click on link given top right of respective tab in module configuration page.
2. Click on Apps -> Create a new App.
3. Follow the instructions on the screen.
4. You will get the App ID and App Secret (Click Show button).
5. Now, go to Settings from left menu.
6. Click on Add Platform button.
7. Select Website.
8. Enter your App Domain and Site URL.
Application Type: Web Application.
Authorized JavaScript origins: Your store domain name. (https://www.example.com)
9. Click Save Changes button.
10. Now, go to Status & Review tab from left menu and make the Application Live.
How To Get Google App Details?
Steps:
1. Go to Google Developers Console (https://code.google.com/apis/console)or click on link given top right of respective tab in module configuration page.
2. Now click Apps &Auth-> Credentials from left menu.
3. Click Create New Client ID button from the right panel of the screen.
4. Fill the pop-up form with below details:
Application Type: Web Application.
Authorized JavaScript Origins: Your store domain name. (https://www.example.com)
5. Now click Create Client ID button to get your Client ID and Client Secret Key.
How To Get LinkedIn App Details?
Steps:
1. Go to LinkedIn Developers (https://www.linkedin.com/secure/developer) or click on link given top right of respective tab in module configuration page.
2. Click Add New Application.
3. Fill the form to register a new application. Website URL must be your Store URL like https://www.example.com.
4.Click Add Application to submit the form and keep your API Key and Secret Key safe.
How To Get Live App Details?
Steps:
1. Go to Microsoft Development Center (https://account.live.com/developers/applications) or click on link given top right of respective tab in module configuration page.
2. Click Create Application.
3. Enter Application name and click I Accept button.
4. From left menu select API Settings.
5. On the right panel enable Enhanced redirection security, enter Loginizer redirection page URL (in Redirect URLs and click Save.
6. Now from left menu click App Settings and copy your Client ID and Client Secret.
How To Get Twitter App Details?
Steps:
1. Go to Twitter App Management (https://apps.twitter.com/) or click on link given top right of respective tab in module configuration page.
2. Click Create New App button.
3. Enter Application Details as follows:
Application Name : Name of your Application.
Description : 10 to 200 characters description of your application.
Website : Your store URL.
Callback URL : Loginizer redirect page URL of your store.
4. Now, Click Yes, I agree and then click Create your Twitter application.
5. Now, select the API Keys from the menu below your Application Name and copy your API Key and API Secret.
How To Get Yahoo App Details?
Steps:
1. Go to Yahoo Developer Network (https://developer.apps.yahoo.com/projects) or click on link given top right of respective tab in module configuration page.
2. Click Create a Project.
3. Fill the required details as per instructions. Home URL will be your Store URL.
4. Click Create Project button.
5. Copy your Consumer Key and Consumer Secret.
How To Get Amazon App Details?
Steps:
1. Go to Amazon Developer Network (https://login.amazon.com/manageApps) or click on link given top right of respective tab in module configuration page.
2. Click on Sign in to App Console button.
3. After successful login to App Console click on Register new application button in top right of page and you will be redirected to following page.
4. Enter Application Details as follows:
Name: Name of your Application.
Description: Description of your application.
Privacy Notice URL: Url of privacy policy page of your store.
5. Logo Image: Select optional logo image of your store.
6. Click Save button.
7. Now click on Web Settings to get your client id and secret.
8. Allowed Return URL : Loginizer redirect page URL of your store.
Note: To enable Amazon login into your website, your website must be secure with HTTPS otherwise Amazon login will not work.
How To Get Instagram App Details?
Steps:
1. Go to Instagram Developer Network (https://instagram.com/developer/clients/manage/) or click on link given top right of respective tab in module configuration page.
2. Click on Register a New Client button on top right of page.
3. Fill the following form.
4. Set OAuth redirect_uri as Loginizer redirect page URL of your store. (https://www.example.com/module/socialoginizer/instagram).
5. Click Create button then copy and paste Client Id and Secret in admin panel of plug-in.
How To Get Paypal App Details?
Steps:
1. Go to Paypal Developer Network (https://developer.paypal.com/webapps/developer/applications/myapps) or click on link given top right of respective tab in module configuration page.
2. Click on Create App button.
3. Now enter name of your Application and click Create App Button.
4. Set App return URL.
5. Copy and paste live credentials to admin panel of plug-in.
How To Get Dropbox App Details?
Steps:
Note: To enable Dropbox login into yout website, your website must be secure with HTTPS otherwise Dropbox login will not work.
1. Go to Dropbox Developer Website (https://www.dropbox.com/developers/apps) or click on link given bottom of respective tab in module configuration page.
2. Click On the Create App button and provide a name for Application.
3. Fill up the details , set redirect url and save the settings.
4. Copy and paste the key and secret in plugin admin panel.
How To Get WordPress App Details?
Steps:
1. Go to WordPress Developer Website (https://developer.wordpress.com/apps/) or click on link given bottom of respective tab in module configuration page.
2. Click On the Create App button and provide a name for Application.
3. Fill up the details and save the application.
4. Copy and Paste the credentials in Magento extension admin console.
How To Get FourSquare App Details?
Steps:
1. Go to foursquare developer website(https://foursquare.com/developers/apps) or click on the bottom link in Magento plugin admin console.
2. Click on the CREATE NEW APP button.
3. Fill up the details , set the redirect url and save the application.
4. Copy the credentials in plugin admin console.
Module Link: https://www.knowband.com/magento-social-loginizer
User Manual: https://www.knowband.com/blog/user-manual/magento-social-loginizer
Related Stories: