Add User Name to Social Media login in MVC Core

 Author: Shengtao Zhou       Created: 1/9/2019 6:17:46 PM       Modified: 2/2/2019 3:11:41 AM   More...
Ask users to add a user name on your site when login with their Facebook, Google, Microsoft, Twitter accounts. By default, MVC Core social media login use email as the user name. But the user may want to have a user name when they post on your site, instead of show their emails.

In Visual Studio, right click your project name, select "Add" -> Add Scaffolding Item -> Identity -> check "Account\External Login" -> select your data source from "Data context class" dropdown -> click "Add".

Then you see 2 files created under "Areas\Identity\Pages\Account" folder:
ExternalLogin.cshtml
ExternalLogin.cshtml.cs

1. Change ExternalLogin.cshtml.cs file

  1) Add following code to InputModel class,

            [Required]
            [StringLength(20, ErrorMessage = "The {0} must be at least {2} and at max {1} characters long.", MinimumLength = 8)]
            [DisplayName("User Name")]
            public string UserName { get; set; }

  2) Change OnPostConfirmationAsync method, replace "UserName = Input.Email" with "UserName = Input.UserName"

2. Change ExternalLogin.cshtml file, add these lines under email section,

More...          Back to List          

(Please enter you comments between 100 to 2000 characters. Thanks for your contribution.) 

         Created:       Modified: 

Editing a comment

       (Please enter you comments between 100 to 2000 characters. Please login before edit comment.) 

div class="col-md-2">