How to Add Social Login to WordPress

Hi guys today we are going to see how you can add social logins to your WordPress website Now let's say you have a website And you have a login page like this Now instead of asking your visitors to enter their username and password every time What if you want to let them use their Google or Facebook account to login to your site So you can do that easily by watching this video So once you add these buttons to your website your visitors will be able to quickly login to your site using their social media accounts So let's get started We are going to add our social media buttons in just five steps. The first step is to install a plugin in WordPress So to install the plugin let's go to our WordPress dashboard Now go to plugins And click add new Now search for a plugin called super socializer And you will get this plugin Now this is the plugin which is going to help us add social logins to our website So to install the plugin let's click install And then click activate So now we have successfully installed the plugin So once you install the plugin you can see that we have a new button called super socializer So now we can go to step two Which is to enable the social login feature on this plugin So to enable it, let's go here And then click social login Now enable this option And as you can see We have got the list of social networks which we can add to our site So once you're enabled the social login feature We can now go to step three Which is to choose the social network You want to add your site So first I'm going to enable the Google login feature So let's select Google So once you have selected your social network We can now go to step four Which is to connect your website with Google So to connect it, we need to get these details from Google So to get these details, let's open a new tab And then search for Google developers console Now click the first link And then login to your Google account Now to get these details Just click create And enter any name here I'm going to enter social login And then click create Okay So now a new project has been created Now get our details let's click here And then enter social login Now scroll down And enter your website address here Then click Save Now get the details click create credentials And then click here Now select web application And here you need to enter your website's URL So let's go to our website And then copy this URL Now let's go back to this tab And then paste it here Now make sure you remove this slash And then click create And as you can see we have got the details which we need So now all you have to do is just copy these details And then paste it on your website So let's click here to copy And then paste it here Next let's copy this And paste it here Now scroll down And click save changes Okay so now we have successfully connected our website with Google So once you're connected your website with Google We can now go to the final step Which is to choose where you want your social login buttons to appear So to choose the place where we want our buttons to appear Let's click advanced configuration So these are the places where you can display your social login buttons Now let's say you have an e-commerce website And you want your social login buttons to appear on a login page like this You need to enable this option Next if you want to add it to your checkout page Just enable this option Now let's scroll down And click Save Changes Now as soon as you click Save Changes The Google login button will be successfully added to your website So now your customers can login to your site using the Google login So next let's see how it works So now let's go to our website So let's imagine customer is visiting your website and buying a product Now if they click proceed to checkout You can see that we have now got the Google login on our checkout page So now if a customer wants to login to your website All they have to do is just click this Google icon And then sign in with your Google account So now we have successfully logged into our website using the Google login And as you can see the customers name and email address has been automatically entered from their Google account Now as soon as a customer logs in for the first time Their account will be created So if you go their inbox You can see that they have received a mail Which says their account has been created Okay so now let's go back to our website So once a user has logged in They can now complete the purchase just by entering their address here And then place the order So now as you can see their order has been placed So now you know how your customer can use the social login feature to place an order Next let's say the same customer wants to check their order status after some time So after placing an order all they have to do is just go to your site And then click my account And here you can see that we have again got the same Google login On our login page Now in order to login all they have to do is just click here And then select their Google account And now the customer has logged into you website And here they can see the order which they have placed on your site Now if they go to addresses You can also see that their address has been saved to their account So now you know how your customer can log into their account using their social login Now let's say after a few days The same customer wants to buy another product from your site So they are going to your store And then buying another product And once they reach their checkout page Now if they login here with the same Google account You can see that your customer's address has been automatically entered here Now to place the order all they have to do is click place order And the order will be placed So now we have successfully connected our website with Google Next if you see here your customers name appears on the menu When they have logged in to your site Now by default this name will not appear here Instead it will show as my account like this So next let's see how you can add your customer's name on the menu after they login to your website Now to display your customer's name on the menu We are going to do two steps The first step is to install a plugin in WordPress So let's go to our WordPress dashboard And then go to plugins And click add new Now search for user menu in this box And you will get this plugin Now let's click install And then click activate So now we have successfully installed the plugin on our website So once you've installed the plugin we can now go to step two Which is to add your customer's name to your menu So to add the name let's go to appearance click menus And here you can see all your menu items Now let's open my account Now here enter the name you want to show Before a customer logs in So I'm gonna enter login here Now since we want login to appear only when customers are logged out Let's click here And select logged out users Then click save menu Now if we go to our website And click refresh You can see that we have the login menu here Now if you login You can see that we don't have any menu item here Now in order to display your customer's name here After they login You need to create another menu item on your website So to create another menu item Let's go back to WordPress Now these are the pages which we have on our site And now you need to select the page Which needs to appear when the customer clicks on their name So as I want to show the my account page When the customer clicks on their name I'm going to select my account And click add to menu And now this new menu item will be added here And let's click here to open the menu Now to display this menu item only when the customer is logged in Let's click here And change it to logged in users Now this menu item will only be shown to logged in uses Now to show your customer's name instead of my account Let's delete this And now if you click here You can see that we now have the option to display our customer's name So let's select first name And now your customer's name will be displayed like this Now if you want to add any text before your customer's name Like welcome or hello You can do that just by entering that text here So I'm gonna type hello Next we need to choose which users you want to show this menu item to So in WordPress users will have different roles So since we want to show this menu to customers Let's select customer And in WordPress customers can also be treated as subscribers So make sure you select this option too So now if you click save menu And then go to our site And click refresh You can see that we know how the customers name on our menu This is how you can display your customers name on the menu Once they are logged in So now we have seen how you can add the Google login to your website And we have also seen how we can add the customers name to the menu So next let's go to the final part of this tutorial Where we see how you can add another social network to your website So next we are going to add the Facebook login to our website s So once you do this step Facebook login will appear on your website along with the Google login And your customers will be able to login to your site using their Facebook account Now in order to add Facebook login You must have SSL on your site If you don't have SSL you can watch this video to get it for free So to add Facebook login we are going to do three steps The first step is to enable Facebook login So to enable it, let's go to WordPress And then go to super socializer And click social login Now to enable Facebook login just select Facebook here And Facebook login will be enabled So now let's go to step two Which is to connect your website with Facebook So to connect it Like we did before We need to get these details from Facebook So to get these details Let's open a new tab And then enter developers.facebook.com Now click login And login to your Facebook account Now to get the details, let's click here And click Next Now select other And then click create first app Now here you can enter any name you want I'm going to enter my first app And click create Now as we are adding Facebook login Let's select this option And then select web here Now here you need to enter your website's URL So let's go to our website And then copy this link And paste it here Make sure you remove this slash And now if we click Save Our details will be created So to see the details Let's click settings And then click basic Now as you can see we have got the details which we want So once you have got these details All you have to do is Just copy these details And then paste it on your website So let's copy this And then paste it here Next let's copy this one And paste it So now we have entered our details for the Facebook login So now if you click Save Changes You can see that we have got a message Which says We need to add this URL to our Facebook settings So let's copy this URL Now click Facebook login here And then click settings Now paste the URL in this box And click Save Changes So now we have successfully connected our website with Facebook So once you've connected your website with Facebook You can now go to the final step Which is to activate your Facebook login So to activate your Facebook login just enable this button Now as soon as you click this button You'll get a message saying You need to provide your privacy policy link to activate your Facebook login So next we need to add our privacy policy page to Facebook So to add it Let's click here And now you need to add your privacy policy link in this box Now if you already have a privacy policy page on your website You can add its link here But if you don't have it you can easily create a new page right now So to create the privacy policy page Let's go to our WordPress dashboard And then go to settings And click privacy Now to create the privacy page Click create new page And then click publish And now we have got our privacy policy link here Now to activate your Facebook login all you have to do is just copy this link And paste it on Facebook So let's click here to copy this link Now let's go here And then paste it in this box Once you have added the privacy policy link Next you need to select your website's category So I'm going to select shopping And then click save changes Now to activate Facebook login Let's enable this button Now if you click switch mode The Facebook login will now be added to your website So let's see how it works So let's go to our checkout page And click refresh You can see that we have now got the Facebook login button on our website So now let's try logging in with our Facebook account So let's click here And login to our Facebook account And as you can see we have successfully logged into our website using Facebook So that's it guys this is how you can add Facebook login to your WordPress site Now instead of having these buttons If you want to get more designs like this You can get it by getting the premium version of the plugin Given in the link below this video So that's it guys this is how we can add social logins to your WordPress site Now if you want to learn how to make an e-commerce website You can watch this video And if you want to learn how to create a business email for your website You can watch this video Also make sure you subscribe to Website learners to get more videos like this one Thanks for watching I will see you in the next video Bye...Bye

Channel: Website Learners

Views: 212,513

Keywords: How to add social login to wordpress, social login, facebook login for WordPress, google login for WordPress, wordpress, auto user registration, login with facebook, login with google, wordpress social login, super socializer, social login integration, website, social login for website

Id: CQdMKa7C_oo

Length: 21min 12sec (1272 seconds)

Published: Mon Dec 02 2019