> ## Knowledge Base Index
> Fetch the complete knowledge base index at: https://help.popup-builder.com/sitemap.xml
> Use this file to discover available pages before exploring further.
> Pure-Markdown content can be obtained by appending a '.md' suffix to the content URLs listed in the sitemap (without the trailing slash).

# How to Use the Login Extension

 The **Login Popup** gives an opportunity for your visitors who have an account on your website to **log into**  it. 

|| The extension is paid. It can be purchased either within the [bundles](https://popup-builder.com/pricing/) or as a [single extension](https://popup-builder.com/downloads/login-popup/).

Once purchased it should be installed like this:

• In case of the bundle [click here](https://help.popup-builder.com/en/article/how-to-install-bundle-paid-version-3364s5/). 
• In case it was purchased as a single extension [click here](https://help.popup-builder.com/en/article/how-to-install-a-single-extension-1gc5noh/).

##### Steps to create a Login Popup

1. From your WordPress dashboard open the Popup Builder and click on the **Add New**.

![](https://storage.crisp.chat/users/helpdesk/website/3fee58eaeb6dda00/screenshot8_1hi16b.png)

2. Choose the **Log in** popup type from the menu bar.


![](https://storage.crisp.chat/users/helpdesk/website/3fee58eaeb6dda00/screenshot20_1vvo61f.png)


##### Steps to customize the Login Popup

Below you can find the main options the **Login** popup can be customized with. 

![](https://storage.crisp.chat/users/helpdesk/website/3fee58eaeb6dda00/add-new-popup-tech-it-easy-wor_lv6paj.png)


* **Form background options**: set the background color, opacity and the padding for the form.
* **Form Fields**: there are 3 fields available within the popup, that can be managed by editing the label and placeholder

1. Username
2. Password
3. Remember me (optional)

* **Inputs' style**: set the width, height, border width, background color, border color, text color, placeholder color.
* **Required message**: set the message which appears, when none of the required fields is filled.
* **Custom error message**: set the desired error message to show when the username or password are incorrect.
* **Login button styles**: manage the button width, height, title, title ( in progress), background color, text color.
* **After successful login**: choose one of the following actions you wish to be implemented after the user is successfully logged in:

1. Refresh: the page within the Login popup will refresh, once the form is submitted. 
2. Redirect to URL: set the website link where you wish your users to be redirected after the login. The URL can be
opened in the same tab or another.
3. Open popup: when selecting this option you can set for another popup to be opened once the current one is submitted. Choose the popup
from the dropdown list.
4. Hide popup : choose this one to simply hide the popup when the user successfully logged in.

* **Already logged in message**: select the message to show for already logged in users.


|| You can check the [Registration Popup](https://popup-builder.com/product/registration-popup/) which will be helpful to use with the Login popup to unregistered users.