Atomic Element · Free
Put your WordPress logo in any Elementor 4 header or footer, linked home. Change the logo once in WordPress and every page shows the new one, with no Elementor Pro Theme Builder.
The short answer
The Elementor site logo widget from Animation Addons is an Elementor 4 Atomic Element that shows your site's logo as a link. It reads the logo set in WordPress on every page load, or shows a custom Image or SVG child you style yourself. The link goes to your home page, a custom URL, or nowhere.
In classic Elementor, the Site Logo widget is part of Elementor Pro's Theme Builder, and Elementor 4 has no atomic logo element. Many "Elementor V4 compatible" addons offer a classic v3 logo widget. The Animation Addons for Elementor Site Logo is a native Atomic Element that runs on Elementor Free.
| Plan | Free |
|---|---|
| Element type | Native Elementor 4 Atomic Element (link container) |
| Works with | Elementor Free and Elementor Pro, Atomic Editor on |
| Logo source | Site Logo (WordPress) or Custom (Child Image) |
| Child elements | Elementor Image by default; Image or SVG in custom mode |
| Link | None, Site URL or Custom URL; Open In Same Window or New Window (adds noopener); Add Nofollow |
| Alt text and label | The logo's Media Library alt text, or the site name |
| Weight | About 140 bytes of CSS, printed once per page; no JavaScript |
| Limits | No caption option. In WordPress mode the full-size logo file is used, without width and height attributes, so set its size in the Style tab. With no logo set in WordPress, Elementor's default grey image shows |
| Plugin version | Animation Addons for Elementor 4.3 · Last updated October 2026 |
Demo variations
Ideas you can build today with the Site Logo and native Elementor 4 elements. Cards marked Pro add an Animation Addons Pro extension or element; the rest work on the free plugin.
A white header with the logo left at 150px wide on desktop and 110px on phones, a menu centred and a "Book a visit" button right.
A transparent header over a dark kitchen photo, with a white version of the logo. Inner pages keep the dark logo from WordPress.
A minimal black-and-white site with a thin SVG wordmark centred above the menu; it turns the accent colour on hover.
A small grey logo in a dark footer, next to the line "A Fernhill Group company", opening the parent company's site in a new tab.
A slim centred logo at the top of a single-purpose page, not clickable, above the headline and signup form.
Features
Every option below is a real control in the Site Logo panel or part of how the element renders. Nothing here needs custom code.
With Logo set to Site Logo (WordPress), the element reads the logo from WordPress every time a page loads. Change the logo once and every header and footer updates, without re-saving a page.
Switch Logo to Custom (Child Image) to show the Image child instead, or swap in an SVG child for a crisp, recolourable wordmark. Both are Elementor's own elements with their own Style panels.
Site URL uses the home address WordPress generates, so it stays correct on staging and live. Custom URL, Open In and Add Nofollow cover footer and partner logos; None removes the link.
The link's accessible label comes from the logo's alt text, or the site name. With Link set to None, the element is marked presentational so screen readers don't announce an empty link.
Built on the atomic base
Why it mattersThe link area and the picture are separate, so padding and hover sit on the Site Logo while size and colour sit on the image, each in your Classes.
<a> link: Logo, Link, Custom URL, Open In, Add NofollowStep by step
Six steps, from installing the plugin to publishing the page. The bold names are the exact labels you will see in the Elementor 4 panel.
Download freeSet your logo in WordPress: Appearance > Customize > Site Identity on classic themes, or the Site Logo block in Appearance > Editor on block themes. Add alt text to the image in the Media Library.
Install and activate Animation Addons for Elementor, then open your header in Elementor with the Atomic Editor on.
Drag Site Logo from the Elements panel into the header.
Leave Logo on Site Logo (WordPress), or switch to Custom (Child Image) and set the Image or SVG child.
Set Link to Site URL, or choose Custom URL, Open In and Add Nofollow.
Set the logo width per breakpoint in the Style tab, check mobile and publish.
Honest comparison
What each option has, side by side. We list where the other choice is the better fit, too.
| Feature | Elementor Pro Site Logo (classic Theme Builder widget) | Animation Addons Site Logo |
|---|---|---|
| Requires Elementor Pro | Yes | No |
| Native Elementor 4 Atomic Element | No | Yes |
| Logo from WordPress site settings | Yes | Yes, read on every page load |
| Link | Yes | Site URL, Custom URL or None, with new window and nofollow |
| Caption | Yes | No |
| Styled with Elementor 4 Classes and Variables | No | Yes |
Compared with Elementor 4.3.3 (September 2026).
If you already build headers with Elementor Pro's Theme Builder and need a caption, its Site Logo does the job. The atomic Site Logo is for headers built in Elementor 4's Atomic Editor, including on Elementor Free.
Who it's for
The people who get the most out of it, and what they use it for.
Who need a linked header logo without Theme Builder.
Building one header that every client page shares.
Who want the new logo live everywhere after one change.
FAQ
Install the free Animation Addons for Elementor plugin and drag the Site Logo element into your header. The Animation Addons Site Logo shows the logo set in WordPress and links to your home page by default. It runs on Elementor Free with the Atomic Editor on, with no Theme Builder needed.
Yes. With Logo set to Site Logo (WordPress), the Animation Addons Site Logo reads the current WordPress logo every time a page loads. Change it in Site Identity or the Site Logo block, and every header, footer and page using the element shows the new logo without being re-saved.
Yes. Switch that page's Animation Addons Site Logo to Custom (Child Image) and put the white logo in the Image child. Other pages keep Site Logo (WordPress). This is the usual way to handle a transparent header over a dark photo or video, without changing the logo set in WordPress.
In WordPress mode, the Animation Addons Site Logo uses the full-size logo file and prints it without width and height attributes. To avoid layout shift, set a fixed width in the Style tab for each breakpoint. Upload the logo at twice its display width for sharp retina screens, or use an SVG child, which stays sharp at any size.
Select the Animation Addons Site Logo, switch the editor to the mobile breakpoint and set a smaller width in the Style tab. To keep header and footer logos in step, store the width in an Elementor 4 Variable and use it on every logo, so one change resizes them all.
The Animation Addons Site Logo outputs a real link with an image, so crawlers follow it to your home page. The image alt text, and the link's accessible label, come from the logo's alt text in the Media Library, or your site name if none is set. With Link set to None, the logo is marked presentational.
More answers in the FAQ · Documentation · Free vs Pro
Pairs well with
Elements that work well with the Site Logo on the same page or template.
Free on Elementor Free. One logo change in WordPress updates every page.