---
title: "How to Change Site Logo on Hover in Elementor? (Show Full Logo on Hover)"
url: https://theplusaddons.com/docs/change-site-logo-on-hover-in-elementor/
date: 2023-10-27
modified: 2026-04-10
lang: en
author: "Aditya Sharma"
description: "Do you want to change the logo on hover in Elementor? Changing the logo on hover can add an additional interactivity to your website, especially If you have two variations..."
image: https://theplusaddons.com/wp-content/uploads/2023/10/How-to-Change-Site-Logo-on-Hover-in-Elementor_-1024x536.jpg
word_count: 242
---

# How to Change Site Logo on Hover in Elementor? (Show Full Logo on Hover)

## 

- Utilizes the Site Logo widget from The Plus Addons for Elementor to change the logo on hover.
- Requires installation and activation of The Plus Addons for Elementor to access the hover logo feature.
- Instructs users to select 'Double' from the Logo Normal/Double dropdown to add two different logos.

Do you want to change the logo on hover in Elementor? Changing the logo on hover can add an additional interactivity to your website, especially If you have two variations of the logo or just want to add some animation to your logo on hover. 

With the Site Logo widget from The Plus Addons for Elementor, you can easily change the site logo on hover 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 the Site Logo widget to the template and follow the steps -

> *Note: To create the 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=kfX5sSR8XYI

1. Select **Double** from the **Logo Normal/Double** dropdown.

Now, you'll see two sections to add two different logos.

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

2. After selecting the appropriate image type from the** Logo Type** dropdown, select the normal logo image from the **Image Logo**/**Only Svg Logo** section.

Set the appropriate logo size.

3. Then select the hover logo image from the **Hover Logo Image**/**Hover Svg Logo** section and set the appropriate logo size.

Now you’ll see a different logo on hover.

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

Also, read [How to Change Logo in Sticky Header on Scroll in Elementor](https://theplusaddons.com/docs//change-logo-in-sticky-header-on-scroll-in-elementor/).