---
title: "How to Add a Login Button to a Sticky Header in Elementor?"
url: https://theplusaddons.com/docs/add-a-login-button-to-a-sticky-header-in-elementor/
date: 2024-05-16
modified: 2026-04-09
lang: en
author: "Aditya Sharma"
description: "Do you want to add a login button on a sticky Elementor header? Having the login button in a sticky header makes the login button always accessible for visitors to..."
image: https://theplusaddons.com/wp-content/uploads/2024/05/How-to-Add-a-Login-Button-to-a-Sticky-Header-in-Elementor_-1024x536.jpg
word_count: 312
---

# How to Add a Login Button to a Sticky Header in Elementor?

## 

- Integrates the WP Login & Register and Navigation Menu widgets from The Plus Addons for Elementor to add a login button to a sticky header.
- Utilizes the Nexter Builder or Elementor Pro to create the header template for the sticky menu.
- Enables the Sticky Menu toggle and configures button styles for normal and hover states in the WP Login & Register widget.

Do you want to add a login button on a sticky Elementor header? Having the login button in a sticky header makes the login button always accessible for visitors to access their accounts, this can greatly improve user experience.

With the WP Login & Register and Navigation Menu widgets from The Plus Addons for Elementor, you can easily add a login button on a sticky header.

*To check the complete feature overview documentation of The Plus Addons for Elementor WP Login & Register widget, [click here](https://theplusaddons.com/docs/create-a-login-register-form-in-elementor/).*

***Requirement  - This widget is a part of The Plus Addons for Elementor, make sure its installed & activated to enjoy all its powers.***

[LIVE WIDGET LINK](https://theplusaddons.com/elementor-widget/elementor-login-form/)

To do this, add the Navigation Menu and WP Login & Register widgets to a container in the header template and follow the steps -

> *Note: To create the header template, you can use the free *[*Nexter Builder*](https://nexterwp.com/docs/nexter-theme-builder-explained/)* or you can use Elementor Pro if you are already using it.*

1. Select the **Navigation Menu** widget.

2. From the **Navigation Bar** tab, select the appropriate **Menu Type**, **Menu Direction** and menu.

![](https://theplusaddons.com/wp-content/uploads/2024/05/wp-login-register-sticky-menu-enable.png)

3. Then enable the **Sticky Menu** toggle from the **Extra Options** tab.

4. Then select the **WP Login & Register** widget.

5. From the **Forms Layout** tab, select the **Login** or **Login and Register** form from the **Type** dropdown.

6. Then from the **Layout** dropdown, select **Button Hover**, **Button Click** or **Button Popup**.

![](https://theplusaddons.com/wp-content/uploads/2024/05/wp-login-register-button-hover-2.gif)

7. Then go to the **Style** tab and enable the **Sticky Navigation Connection** toggle from the **Extra Option** tab.

![](https://theplusaddons.com/wp-content/uploads/2024/05/wp-login-register-sticky-navigation-connection-1-329x1024.gif)

Now you’ll see different styling options.

From the **Before Login** section, you can style the button for normal and hover states before login.

Then from the **After Login** section, you can style the button for normal and hover states after login.

Now you’ll see the login button sticking on the header along with other menu items.