WooCommerce Social Login allows your customers to link their store accounts with a social media account for easier, faster checkout. Customers no longer have to remember yet another username and password. Instead, they can use their preferred social network to create an account for your site for a frictionless checkout experience every time they visit.
Social Login buttons can be used on the “Checkout” page to expedite account creation, and customers are taken right back to the page to complete their purchases.
Customers can also create new accounts from the “My Account” page, or existing customers can link an account from the “Order Received” page:
They can also be used by existing users when logged in from the “My Account” page:
Requirements
Below are the requirements to use the plugin. If your site is hosted by WP Engine or uses a caching plugin, please also view the troubleshooting section in case of issues.
WooCommerce Social Login works best with pretty permalinks enabled. Go go to Settings > Permalinks and select anything but the default option.
To allow sign in with Amazon, you must use an SSL for your “My Account” and “Checkout” pages. This is a requirement from Amazon.
Using bbPress? The username generated by a social login will be the customer’s email, which unfortunately bbPress displays for some reason instead of a display name. See our FAQ entry for guidance on how to change this.
Go to Plugins > Add New > Upload and select the ZIP file you just downloaded
Click Install Now, and then Activate
Go to WooCommerce > Settings > Social Login and read the next section to learn how to setup and configure the plugin.
Setup and Configuration
Installing the plugin will allow you to set some general settings for all social buttons, then enable settings for each social network. Let’s start with the general settings:
Social Login Options
Display Social Login on – This controls where the social login options are displayed:
Checkout: Within the checkout “Log In” Notice
My Account: On the “My Account” page login
Checkout Notice: Within a unique Notice on the checkout page (recommend this OR Checkout, not both)
Please note that if a user is logged in (including you), s/he won’t see social login at checkout. The goal is to make your checkout experience seamless, so introducing a distraction at checkout when user information is already there hinders this.
Display “Link Your Account” button on Thank You page – This will display a notice on the top of the Order Received page to ask logged in users to link their account for faster checkout in the future.
Social Login Display Text – This controls the text displayed to users above the social login buttons.
Force SSL for all Providers – Enable this to force all callback URLs (when returning to your site) to use SSL (you must have an SSL certificate installed).
Providers – List of connected providers; drag and drop to change the display order on the frontend.
General Settings
Don’t forget to hit “Save Changes”
Once you’ve configured general settings, you’ll need to set up apps for the social networks that you’d like to use in your store. We have a document that explains how to set up apps.
Once you’ve set them up, you can enter credentials and adjust the settings for each under WooCommerce > Settings > Social Login by selecting the correct service.
Provider Settings
Most providers have similar settings (aside from PayPal). You can find settings for each provider under WooCommerce > Settings > Social Login > {Provider Name}.
Enable/Disable – Check this option to use this provider’s login where you display social options.
App ID / Client ID / API Key – The name for this field may change, but for each provider, this is the Key or ID you get while creating your app.
App Secret / Client Secret / API Secret – The name for this field may change, but for each provider, this is the Secret key you get while creating your app.
Login Button Text – The text that will be displayed on Social Login Buttons for the provider.
Link Button Text – The text that is displayed on the “My Account” page to ask current customers to connect social accounts to the provider.
Here’s an example of the Facebook Settings:
Facebook Settings
PayPal Settings
PayPal has an additional setting worth noting: Environment.
Enable/Disable – Check this option to use PayPal login where you display social options.
Client ID – This is the Client ID for your PayPal app that you can access from your PayPal developer account.
Secret – This is the Secret for your PayPal app that you can access from your PayPal developer account.
Login Button Text – The text that will be displayed on Social Login Buttons.
Link Button Text – The text that is displayed on the “My Account” page to ask current customers to connect social accounts.
Environment – This is the environment for your PayPal login app. This should always be live. Sandbox can only be used with a dedicated PayPal sandbox account, which requires much further setup (and isn’t needed since we’re only testing login).
PayPal Settings
Connecting Social Networks
You can connect WooCommerce Social Login to Facebook, Twitter, Google, Amazon, PayPal, LinkedIn, Instagram, Disqus, Yahoo, and VK. Please follow our Creating Social Apps guide to set up an app for your social network if you don’t already have one. This will give you API credentials to enter into the plugin settings page to connect your store to the social network(s) selected.
Once you’ve created your apps and configured the plugin, there’s nothing else that needs to be done from the admin side. If you’d like some insight into how this is used, you can view WooCommerce > Reports > Customers and go over to “Social Registration”. This graphic will show you total registration based on social network:
You can also view this information by visiting your “Users” menu, where you’ll see a new column for “Social Profiles”. This will display which accounts have been linked for a customer.
Users list
You can view linked account information in the user profile for the customer as well.
Customer profile
Customer Usage
Customers can manage linked accounts from the “My Account” page. Here they can add or unlink social networks to their customer account. Unlinking a social network will not delete the user account. Customers may have to reset the password to be able to log in if they unlink all accounts and do not want to use a social account to log in.
The only exceptions are Twitter and Instagram, as we cannot access an email address from someone’s account via their APIs. The plugin does have a prompt to ask them to enter an email after signing up with these services, but the customer may not do so.
This means they won’t be able to log back into an account after unlinking. However, they can provide you with the appropriate Twitter handle or Instagram username, which will be set as the username. Using this, you can reset the account password and / or add an email address.
Customers can also link accounts from the Order Received page if you enable this notice:
Order Received Page
Shortcodes and Widgets
WooCommerce Social Login provides both a shortcode and widget for shop admins to display social login buttons anywhere they’d like to on their website. For logged out users, this will ask them to sign in. For logged-in users, they can link accounts to their site account.
to display the Social Login message and buttons for any activated networks. The return_url attribute is the page to which customers will be redirected after signing in. We recommend the “My Account” page, but you can use any URL for a page / post on your site.
You can also use the WooCommerce Social Login widget to add social login buttons to your sidebar or any widget area. The Return URL does the same thing here – it’s the page you want to redirect customers to after using the social sign in.
Add the Widget
The final display will look like this:
Widget / Shortcode display
Upgrading to Version 2.0
Version 2.0 of Social Login updated how login is authenticated with provider networks like Facebook and Twitter. We migrated from using Opauth to HybridAuth, which is a different code library for communicating with social networks.
We made this move because, while we routinely audit the plugin for security, HybridAuth has a more active development community, and thus will be more secure in the long run over the life of WooCommerce Social Login, and we want to be proactive in using newer codebases.
If you’ve started using Social Login after version 2.0, you’ll never have to worry about this, and in fact, won’t even see a setting to change callback URLs Only existing users will need to take action.
The plugin will continue to work without issue after upgrading. This change is backwards-compatible, but you will eventually have to make an update to your site.
The tradeoff to using a new library is that users must update callback URLs for some of their social network applications, and the plugin will notify you of this upon upgrade.
Update Notice
This is a fairly simple process, as many networks let you add a new callback URL to add the new format. You can then change the plugin from “Legacy” to “Default” callback URLs and it will continue to work the same exact way (especially for customers who have already linked an account).
Ready to make the switch? It should take about 15 minutes (depending on the providers you use), and you can view our v2.0 upgrade guide.
Troubleshooting
Having trouble? Follow these steps to make sure everything is setup correctly before posting a support request:
Check that your App / Client IDs or keys are correct
Double-check that your App / Client IDs or keys are correct
Go to Settings > Permalinks and confirm you’re using anything but the default permalink structure.
Not seeing social login buttons? Make sure that you’re not already logged in, or use a different browser.
Using PayPal? Ensure that you’re using a Live Environment, not Sandbox.
Seeing a “You do not have access to YOURSITE.com” error? Please follow these steps.
Having trouble logging in with a new social account? Please see our “how login works” document, as the way administrators and customers are handled are different.
Are you using the iThemes Security plugin? If so, please ensure that you’ve unchecked Filter Long URL Strings in iThemes Security settings. Facebook login will not work with the setting enabled.
Q: Will you add XYZ Network? A: We’ve covered over 95% of social sign-ins with the current providers (recent reports here). However, if we need to add more social networks, we plan to add them based on votes – you can vote for what gets added here. We don’t have a schedule posted for this, but the number of votes will determine what gets added and when.
Q: Why aren’t my social login buttons displayed? I have them set for XYZ pages. A: Because you’re probably already logged in Try this in a different browser or incognito window and you’ll see login options.
Q: Can I use this plugin with Sensei? A: If you use Sensei, you’re in luck! When Sensei is active and Social Login is enabled, the social login buttons will show up on the Sensei login for automatically You don’t have to set up a single thing!
Q: I don’t like using the social login buttons in the login notice. Can I change this? A: Yep! Please use the “Checkout Notice” option instead of “Checkout”, or you can display the social login buttons using the buttons shortcode on your checkout page. Edit the checkout page, and add the shortcode above the checkout shortcode (replace with your store’s URL):
Note: We recommend changing the buttons setting to “My Account” only if using the shortcode on the checkout page so that buttons are not duplicated.
Q: Why can’t I log in when I click one of the buttons? I get a 404 error. A: Go to Settings > Permalinks and confirm you’re using anything but the default permalink structure. WooCommerce Social Login requires pretty permalinks to be used.
Q: Why do I see a “You do not have access to YOURSITE.com” error when trying to sign in for a second time? This happens with Twitter and sometimes other providers. A: The issue is caused by your host or a plugin caching the authentication endpoint. To avoid this issue, the wc-api endpoint must be excluded from the cache: http://YOURSITE.com/wc-api/*
If you are using a caching plugin, please add the following to the exclude rule: /wc-api/*
and also exclude the wc-api query argument.
Finally, ensure your site does not have wp_woocommerce_session* cookies cached — this should never occur, but we’ve seen some hosts do this, which affects the ability to log in.
We have written a sample support ticket for those using WP Engine to make things really easy for you:
Hi!
My site runs the WooCommerce Social Login plugin and we are having some issues with signing in with our social providers and WP Engine caching. The developers of the plugin have asked us to place a cache exception for the /wc-api/ endpoint and the wc-api query argument, along with ensuring that `wp_woocommerce_session*` cookies are not cached.
Could you please add the following URL to the exception list? http://YOURSITE.com/wc-api/* Along with excluding all session cookies using `wp_woocommerce_session*`?
And also exclude anything using the wc-api query parameter from caching as well, such as http://YOURSITE.com/?wc-api&auth=twitter
Thanks!
Q: Can customers still log in or change account information without a social account linked or if they delete it later? A: Yep! This plugin ties into the existing WordPress user accounts. Your new customers are still created with customer accounts, using their email (Facebook, Amazon, Google), handle (Twitter), or username (Instagram) for the username. They could reset passwords using their email addresses to log into your site normally.
In the case of users that have created an account with Twitter or Instagram, you could add their email to their accounts manually, or ask them to do so from the “My Account” page. We do prompt users to enter an email when logging in with these services, but they don’t always do so.
Q: Why doesn’t Login with Amazon work? A: You must have an SSL certificate for your site and ensure it’s forced on the Checkout and My Account pages for customers to be able to use this service (this is required by Amazon). You can enable this under the Checkout Settings or confirm it’s being forced with your hosting provider.
Q: Does Social Login give the linked social networks access to all of the account information for that user on our website? A: No, there’s very little information that’s sent back to the social network during the initial login and after that there’s no information exchanged until the user logs in again. The only data that’s passed back and forth is login information – nothing on orders, site activity, etc. See below for what information is pulled from each network.
Q: What happens to a customer’s account and order history if the plugin is deactivated / deleted? A: Once a user logs in with a social network, a WordPress account is created for the user using his/her email address as the username and a random password. If you were to uninstall the plugin, a user can always use the “lost password” feature to create a new password and log into their account normally, rather than with their social network.
The exceptions to this are Twitter and Instagram, which do not make the user email available. The admin would have to search for the Twitter handle or Instagram username, which is used as the username, to reset the password for the customer. We ask customers to enter an email when using Twitter or Instagram to avoid this, but some do not do so.
Q: Does WooCommerce Social Login use tokens or other trackers on the shop websites that can give more information to the social network than just the account users’ activities? A: No, there are no scripts or trackers active by the social network providers. The information exchanged is for login credentials only. The social provider may track when the customer uses its credentials to log into your site to show the customer the last login date/time in their social account, but no other information is sent or gathered.
Q: I want the “My Social Profiles” section of the My Account page to be above other sections. Is this possible? A: There’s no setting for this, but it’s definitely possible to move this section on the My Account page! Here’s a code snippet that would show the “My Social Profiles” section first in the account area.
Q: Why does unlinked / relinking Twitter or Instagram result in a duplicate account? A: Twitter and Instagram don’t return an email address when the user logs in, so their WordPress account isn’t tied to an email (just a username). While we can reasonably assume an email gives us a unique person, we can’t make that assumption about a username, as the user can just enter whatever they want for a username. We create a new account for security to ensure we don’t link two different people’s accounts.
Q: I don’t want the plugin to create usernames from the user’s email. How do I change this? A: We have a filter that will let you change this. You’d use the
wc_social_login_{$provider_id}_new_user_data
filter listed in our hook reference to change the 'user_login' to something else, such as a first name, unique ID, or random string.
Q: Help, my social login buttons are not displaying! I promise I’m not logged in already. A: This is most likely an issue with your theme (we’ve seen this happen several times already). If your theme overwrites WooCommerce templates, as many do, it may be missing the required action hooks to display the social login buttons. It would be best to contact your theme author and prod them to update their templates to be compatible with the latest version of WooCommerce and include any hooks and functions WooCommerce does.
In the mean time, you can add the login buttons to any page using our shortcode: [woocommerce_social_login_buttons return_url="http://MYSTORE.com/checkout"]
Q: Can I use this to accept payments with Amazon or PayPal? A: No, sorry! This plugin only allows users to securely log in with an account from another site; it doesn’t function as a payment gateway and won’t pull in any payment details from a linked account.
Social login can be used elsewhere on your site through the use of some handy template tags. If you’d like to read more about incorporating these changes, please view the post here (customizations are not supported by our help desk).
User Info Received
This table shows the information that can is accepted by the plugin from each social network. Note that there’s no way for us to pull the user’s email from Twitter or Instagram via their APIs, so unlinking / relinking these accounts can result in duplicate user account creation if the user doesn’t set an email.
We do prompt the user to enter an email when signing in with Instagram or Twitter to avoid this issue, but it can occur if they leave the page before adding an email to the account.
Please note that users can often decline permissions (for example, Facebook lets users opt not to share an email). The plugin cannot force these permissions. It will ask for an email if one isn’t returned by the social network as soon as the customer returns to your site, but the plugin will block login to require certain permissions, as typically this is against the terms of service for a network.
NETWORK
F NAME
L NAME
USERNAME
EMAIL
PHOTO
POSTCODE
OTHER
Facebook
✓
✓
✓
✓
N/A
Twitter*
✓
✓
✓
✓
City
Google
✓
✓
✓
✓
City
Amazon*
✓
✓
✓
✓
N/A
LinkedIn
✓
✓
✓
✓
N/A
PayPal
✓
✓
✓
✓
N/A
Instagram
✓
✓
N/A
Disqus*
✓
✓
✓
✓
✓
N/A
Yahoo
✓
✓
✓
✓
✓
N/A
VK
✓
✓
✓
✓
✓
N/A
*First and last name may not be accurate; the plugin will guess based on the returned full name.
Try this in a different browser or incognito window and you’ll see login options.
0 Comments:
Post a Comment
Note: only a member of this blog may post a comment.
Subscribe to Post Comments [Atom]
<< Home