---
title: "How to Change Site Logo on Hover in WordPress? (Show Full Logo on Hover)"
url: https://nexterwp.com/docs/change-site-logo-on-hover-in-wordpress-show-full-logo-on-hover/
date: 2024-11-29
modified: 2026-04-14
author: "Aditya Sharma"
description: "Do you want to change the logo when hovering on your WordPress website? If you have two logo variations, changing the logo on hover can add some interactivity to your..."
image: https://nexterwp.com/wp-content/uploads/2024/11/How-to-Change-Site-Logo-on-Hover-in-WordPress_-Show-Full-Logo-on-Hover-1024x519.jpg
word_count: 193
---

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

## Key Takeaways

- Nexter Blocks Site Logo block changes the site logo on hover in WordPress when a site has two logo variations.
- Logo Normal/Dual set to Double shows two sections for adding two different logos, then the normal logo goes in Upload Image/Svg and the hover logo goes in Upload Hover Image/Svg.
- Nexter Builder creates the template for this setup, and the post says Nexter Blocks must be installed and activated to use the Site Logo block.

Do you want to change the logo when hovering on your WordPress website? If you have two logo variations, changing the logo on hover can add some interactivity to your website. 

With the Site Logo block from the Nexter Blocks, you can easily change the site logo on hover in WordPress.

*To check the complete feature overview documentation of the Nexter Blocks Site Logo block,* [click here](https://nexterwp.com/docs/add-site-logo-in-wordpress/).

***Requirement  - This block is a part of the Nexter Blocks, make sure it's installed & activated to enjoy all its powers.***

[LIVE BLOCK LINK](https://nexterwp.com/nexter-blocks/builder/wordpress-site-logo/)

To do this, add the Site Logo block 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/)*.*

1. Select **Double** from the **Logo Normal/Dual** section.

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

![](https://nexterwp.com/wp-content/uploads/2024/11/site-logo-logo-double-hover.gif)

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

Set the appropriate logo size.

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

Now you’ll see a different logo on hover.

![](https://nexterwp.com/wp-content/uploads/2024/11/site-logo-logo-double-hover-demo.gif)