---
title: "How to Change Logo in Sticky Header on Scroll in Elementor?"
url: https://theplusaddons.com/docs/change-logo-in-sticky-header-on-scroll-in-elementor/
date: 2023-10-27
modified: 2026-04-10
author: "Aditya Sharma"
description: "If you want to make your Elementor website more dynamic, changing the logo in the sticky header on the scroll can help you achieve that. With the Site Logo widget..."
image: https://theplusaddons.com/wp-content/uploads/2023/10/How-to-Change-Logo-in-Sticky-Header-on-Scroll-in-Elementor_-1024x536.jpg
word_count: 270
---

# How to Change Logo in Sticky Header on Scroll in Elementor?

## Key Takeaways

- Utilizes the Site Logo widget from The Plus Addons for Elementor to change the logo in a sticky header on scroll.
- Requires both the Site Logo widget and Navigation Menu widget to be placed in the same container in Elementor.
- Enables the Sticky Logo toggle in the Site Logo widget's Extra Options tab to display a different logo on scroll.

If you want to make your Elementor website more dynamic, changing the logo in the sticky header on the scroll can help you achieve that.

With the Site Logo widget from The Plus Addons for Elementor, you can easily change the site logo in a sticky header on scroll in Elementor.

*To check the complete feature overview documentation of The Plus Addons for Elementor Site Logo widget, [click here](/docs/site-logo-widget-settings-overview/).*

***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-builder/header-builder/?utm_source=tpae&utm_medium=docs&utm_campaign=text)

To do this, add both the Site Logo widget and the Navigation Menu widget to 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.* 

https://www.youtube.com/watch?v=Tbb0zs1_Gv0&t=14s

1. Make sure to place both the Site Logo widget and the Navigation Menu widget in the same container or section in Elementor.

![navigatior stracture](https://theplusaddons.com/wp-content/uploads/2023/10/navigatior-stracture.png)

2. In the Navigation Menu widget, select the appropriate **Menu Type**, **Menu Direction** and menu from the **Navigation Bar** tab.

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

![site logo sticky logo](https://theplusaddons.com/wp-content/uploads/2023/10/site-logo-sticky-logo.png)

4. In the Site Logo widget, select **Normal **from the **Logo Normal/Double** dropdown and add the logo.

![site logo normal logo](https://theplusaddons.com/wp-content/uploads/2023/10/site-logo-normal-logo.png)

5. Then go to the **Extra Options** tab and enable the **Sticky Logo** toggle.

![site logo sticky logo](https://theplusaddons.com/wp-content/uploads/2023/10/site-logo-sticky-logo.png)

6. In the **Image Logo** section, add the logo. Select the appropriate image size and width.  

Now you’ll see a different logo in the sticky header on scroll.

![site logo sticky logo demo](https://theplusaddons.com/wp-content/uploads/2023/10/site-logo-sticky-logo-demo.gif)

Also, read *[How to Change Site Logo on Hover in Elementor](https://theplusaddons.com/docs//change-site-logo-on-hover-in-elementor/).*