Login form widget

Overview

The Login form widget enables your website users to log in to your website. The widget displays a username and password login fields and additional login options that you can configure.

When you use this widget, you also have to give your users the opportunity to register, either through the Registration widget or by configuring external identify providers.

Place the widget on the page

You can place a Login form widget only inside a Section widget.
To do this, perform the following:

  1. Inside a column from the Section widget, click Add widget here…
  2. Select the Login & Users tab.
  3. Click the LOGIN FORM widget.
    The widget is placed inside the selected column of the Section widget.

RESULT: The widget displays the Emil / Username filed, the Password field, and a Log in button.
You can change these labels in the advanced widget settings.

Widget settings

To open the widget settings, perform the following:

  1. In the page editor, hover over the widget.
  2. Click the toggle menu in the widget label.
  3. Click  DotNetCore8 (Edit).
    The Login form page opens.

In the Select pages section you can do the following:

Display link for registration

To facilitate the users, you can display a link to the registration page.

To do this, under Registration page, click Add (Select page) and select a page from your website.
The page must have the Registration widget.

The Login form widget displays the Register now link.

Display link for password reset

If you want to provide the users the option to reset their password, you can display a link to the page that has the Reset password widget.

To do this, under Reset password page, click Add (Select page) and select a page from your website.
The page must have the Reset password widget.

The Login form widget displays the Forgotten password link.

Display the Remember me option

If you want to provide the users the option to save their credentials, you can display the Remember me checkbox.

To do this, under Login form options, select Show “Remember me” checkbox.

The Login form widget displays the Remember me checkbox, which is selected by default.

Enable external identity providers

You can allow your users to login with external identity providers, such as social media.

PREREQUISITES: Before adding an external identity provider as an option to the Login form widget, you must first have configured it. For more information, see  Configure external identity providers.

To do this, perform the following:

  1. Under Allow users to log in with…, click Add (Add).
    A list of external identity providers appears.
  2. Select one or more external identity providers.
  3. Click Use selected.
    The Login form widget displays links to external identity logins.

In Display setting section, you can do the following:

Change the template

To change the template that the Login form widget uses, select the new template in the Login form template dropdown box.

You must first have created a custom template.
For more information, see .NET Core pages and templates.

Configure the widget margins

In Margins, you can choose the margins between the text and the column where it is placed.
Choose from the predefined values of none, small, medium, or large.

Save your changes.

Advanced widget settings

To open the advanced settings, in the upper-right corner of the Login form page, click DotNetCore11 (Advanced settings).

  • In Label, you can enter a specific name for this widget.
    This name will be displayed in:
    • The page editor as a label for the widget
    • In the treeview with the page structure in the right pane of the page editor.
  • In CSS class, you can enter individual CSS class for the Login form widget.
  • In Membership provider, you can enter a specific membership provider to be used for logging the users of your website.
    For more information, see Create a custom membership provider.

Save your changes.

Configure the labels of the widget

You can change the following labels:

Label Description Default value
Login form header
The label that is displayed on the fronend page Login
Email field label
The label of the username field Email / Username
Password field label
The label of the password field Password
Login form button
The label of the button that logs in the user Log in
Incorrect credentials message
The message that is displayed when the credentials do not exist or do not match Incorrect credentials.
Remember me checkbox
The label of the checkbox for saving credentials Remember me
Forgotten password link
The text of the link that opens the page with the Reset password widget Forgotten password
Not registered label
The header displayed above the link to the registration page Not registered yet?
Register link
The text of the link that opens the registration page Register now
External providers header
The header displayed above the buttons for external logins, such as Google or Facebook or use account in...
Required fields error message
The message that is displayed when a required field is not filled out All fields are required.
Invalid email error message
The message that is displayed when an invalid email format is enterdLo Invalid email format.

Want to learn more?

Sign up for our free beginner training. Boost your credentials through advanced courses and certification.
Register for Sitefinity training and certification.

Was this article helpful?

Next article

Change password widget