When i first fired up VS2010 i created a new asp.net website.
I couldn’t help bug get all bug eyed with the results when my project was created successfully.
Not only did it come with a premade default template but it also has the membership system included without having to do anything at all.
If you’re new to Visual Studio 2010 or just new to Visual Web Developer, i wanna go over the Membership Controls that have been provided to us.
I am using VS2010 but the same applies for previous versions as well.

Visual Controls

If you take a look in your Toolbox, you will notice a Login section.
This is where all your login controls are stored.

These are the controls that allow you to run a standard membership based website.
Don’t be fooled by this by thinking this is all that’s offered for our membership system cause it’s not.
There’s a ASP.NET Configuration Tool that’s available for us that lets us do a lot more, we will get into that later on.
Lets take a look at these controls and see what they do

Change Password

When you drag a instance of the ChangePassword control onto your form it will create a template with the appropriate fields that will change your password on request

Create User Wizard

When you drag a instance of the CreateUserWizard on to your form it will create a template with the appropriate registration fields.
There are several customizable options that are available for this control.
If you click on the little Arrow at the top right corner of the control you will see a list of customizations you can make.

Login

This control is the user Login section.
This control provides the standard User Name and Password fields.

Login Name

When you drag a instance of the LoginName on to your form it will display the current logged in User Name.
This kind of control can be used several times on any given page.
When you drag it on to your form you will see something that looks like this

[LoginName]

Login Status

When you drag a instance of the LoginStatus on to your form it will display your status.
You can click on the control on the form and click the Arrow, you will notice you have 2 views

1. Logged Out
2. Logged In

What you see is what the user will see when they visit your website.
If you click on the links and check out the properties window, you can set properties for that control.

Login View

This is a important control when enabling your site with the membership system.
The LoginView control comes with 2 templates

1. Anonymous Template
2. Logged In Template

By default, when you drag this on to your form it’s set to the Anonymous Template.
Anything you put in here will be viewable to users NOT logged in
If you switch to the Logged In Template, anything you put in here will be viewable to Logged in users only.
You can use many of  these controls on any given web page.
This allows you to protect your content and control who can and can’t see certain content within your website.

Password Recovery

Like the other controls i talked about, this one works the same way.
When you drag a PasswordRecovery control on to your page it will create a wizard like control.
This allows you to recover your password providing the security question is answered correctly.

Visual Controls In Source Code

If you prefer to code as much as you can in Source View mode than adding these controls are easy.
I will show you the code that makes up each of these controls.
If you have dragged any of the above controls on to your form and you switched to Source or Code view than some of these will look familiar.

Change Password

<asp:ChangePassword ID=”ChangePassword1″ runat=”server”>
</asp:ChangePassword>

Create User Wizard

<asp:CreateUserWizard ID=”CreateUserWizard1″ runat=”server”>
<WizardSteps>
<asp:CreateUserWizardStep runat=”server” />
<asp:CompleteWizardStep runat=”server” />
</WizardSteps>
</asp:CreateUserWizard>

Login

<asp:Login ID=”Login1″ runat=”server”>
</asp:Login>

Login Name

<asp:LoginName ID=”Loginname1″ runat=”server” />

Login Status

<asp:LoginStatus ID=”LoginStatus1″ runat=”server” />

Login View

<asp:LoginView ID=”LoginView1″ runat=”server”>
<AnonymousTemplate>

</AnonymousTemplate>
<LoggedInTemplate>

</LoggedInTemplate>
</asp:LoginView>

Password Recovery

<asp:PasswordRecovery ID=”PasswordRecovery2″ runat=”server”>
</asp:PasswordRecovery>

So you can see how easy it is to add these controls to your webform easily.
After adding in your code and going back to Design Mode, you will see the control sitting on your form.
You can click on it to access the properties for that control.

If you used VS2010 and created a asp.net blank website you will need to add these controls to the pages than configure the site to use the memebrship system.
You can access the asp.net configuration tool by going to your Solution Explorer.
Located to the top are some icons, click the globe and hammer icon.
This will open your asp.net configuration tool via web browser.

If you create a asp.net website a default site will be created with all the login controls added, pages created that hold some of these controls and the asp.net configuration tool is already configured.
All you have to do now is press F5 or right click and choose View In Browser.
You will now be able to register, login etc.

This tutorial was focused on the login control inside Visual Studio 2010.
The controls are also available in 2005 and 2008 as well as Visual Web Developer.
This tutorial does not focus on the asp.net configuration tool.