The site logo is usually the first thing a visitor sees, so it is worth getting it in the right place, at the right size, pointing at the right page.
The Site Logo widget from The Plus Addons for Elementor puts a logo image in your Elementor header or footer, links it to your home page or to a URL of your choice, and can swap it for a second image on hover or when the header becomes sticky.
Requirement – This widget is a part of The Plus Addons for Elementor Pro, make sure it’s installed & activated to enjoy all its powers.
Before You Start
- Edition: Pro — Site Logo is a Pro-only widget. It does not exist in the free The Plus Addons for Elementor plugin, so there is no free version of it to fall back on.
- Prerequisite: Elementor (free) installed and active, alongside The Plus Addons for Elementor Pro.
- Widget to enable: Site Logo, under The Plus Addons > Widgets. Search for Site Logo and turn the toggle on.
- Where to put it: a header or footer template, built with the free Nexter Builder or with Elementor Pro’s Theme Builder. The widget renders on an ordinary page too, but a header is where a logo belongs.
- An image in your media library. The widget does not read the logo from Appearance > Customize > Site Identity. If you do not pick an image inside the widget, nothing is shown at all.
Switch the Site Logo widget on
- In your WordPress admin, go to The Plus Addons > Widgets.
- Search for Site Logo and turn its toggle on.
Add your logo
- Edit your header or footer template with Elementor and drag the Site Logo widget into it.
- In the Content section, leave Logo on Normal for a single logo. Choose Double instead if you want a second image to appear on hover.
- Set Logo Type to Image or SVG. The control below it changes to match: Image Logo for an image, Only Svg Logo for an SVG. You never see both at once.
- Pick your file in Image Logo. Nothing is shown until you do — see below.
- Set Logo Max Width. It starts at 100 px, which is small for most logos, so this is usually the first thing you change.
Where the logo image comes from
The logo is only ever the image you pick inside the widget. The Site Logo widget does not read the logo set in Appearance > Customize > Site Identity, and it has no fallback of its own. With Image Logo left empty the widget outputs an empty, zero-width container: no image, no placeholder, no site name, nothing at all. This was checked twice, including on a site that had a logo configured in Site Identity — it still rendered nothing. In a flex header row that empty container is an invisible item you cannot see or click.
If your header looks like the logo has simply vanished, open the widget and check Image Logo. An empty control is the usual answer.
Link, alignment and the sticky logo
The Extra Options section holds everything around the image itself.
- Logo URL Type decides where the logo goes when it is clicked. Home URL, the default, links it to your home page. Custom Link reveals a Logo URL field with the usual Elementor link options, so you can open the link in a new tab or mark it nofollow.
- Alignment puts the logo on the left, in the centre or on the right. Nothing is selected to begin with and the logo sits on the left until you pick one.
- Sticky Logo shows a different logo once the header becomes sticky. It only appears when Logo is set to Normal, and it needs a Navigation Menu widget with Sticky Menu turned on in the same container to do anything at all.
Settings
Content
| Setting | What it does | Default |
|---|---|---|
| Logo | Normal shows a single logo image. Double shows two and switches between them on hover. | Normal |
| Logo Type | Whether the logo is an image file or an SVG. It decides which media control appears below. | Image |
| Image Logo | The logo image itself. Shown when Logo Type is Image. This is the only place the widget takes a logo from. | Empty |
| Image Resolution | Which registered WordPress image size of your file is output. This is Elementor’s own image size control. | Full |
| Only Svg Logo | The SVG logo file. Shown when Logo Type is SVG. Its own description asks you to select only an .svg file from the media library. | Empty |
| Logo Max Width | Maximum width of the logo, in pixels, per device. Range 0 to 1000. | 100 px |
| Hover Logo Image | The second logo, shown on hover. Appears when Logo is Double and Logo Type is Image. | Empty |
| Hover Svg Logo | The second logo as an SVG. Appears when Logo is Double and Logo Type is SVG. | Empty |
| Hover Logo Max Width | Maximum width of the hover logo, per device. Range 0 to 1000. | 100 px |
Extra Options
| Setting | What it does | Default |
|---|---|---|
| Logo URL Type | Where the logo links. Home URL uses your site’s home page; Custom Link reveals the Logo URL field. | Home URL |
| Logo URL | Your own link, with Elementor’s open-in-new-window and nofollow options. Shown when Logo URL Type is Custom Link. | # |
| Alignment | Left, Center or Right, per device. Nothing is selected out of the box. | None selected |
| Sticky Logo | Shows a third image once the header sticks on scroll. Only offered when Logo is Normal. | Off |
| Image Logo (Extra Options) | The sticky logo image. Same label as the one in the Content section — this is the one inside Extra Options, below Sticky Logo. | Empty |
| Only Svg Logo (Extra Options) | The sticky logo as an SVG, when Logo Type is SVG. | Empty |
| Logo Max Width (Extra Options) | Maximum width of the sticky logo, per device. Range 0 to 1000. | 100 px |
Three labels are used twice inside the same panel: Image Logo, Only Svg Logo and Logo Max Width each appear once in Content and once in Extra Options. The ones in Extra Options always belong to the sticky logo.
How It Behaves
The following was measured on the front end with the widget in a page container.
- The logo is output as one linked image. With Logo URL Type on Home URL it links to your home page, with no new-tab and no rel attribute.
- The alt text and the link title are your site name. They come from your WordPress site title, not from the image file, and there is no control to change them.
- Logo Max Width really does cap the logo at 100 px. A 520 px-wide logo file rendered 100 px wide at the default; raising the slider to 220 rendered it 220 px wide.
- Custom Link works with the link options. A custom URL with the new-window and nofollow switches on produced a link that opens in a new tab and is marked nofollow.
- Alignment works once you pick a value. Choosing Right moved the logo to the right. Leaving it untouched left the logo on the left with no button highlighted in the panel.
Limitations
- There is no Site Identity fallback. The widget ignores the logo set in Appearance > Customize > Site Identity. Leave Image Logo empty and it renders an empty, zero-width container instead of an image or a placeholder.
- The logo starts small. Logo Max Width defaults to 100 px, which is narrower than most logo files. If your logo looks tiny, this is why; raise it, the slider runs to 1000 px.
- Alignment has no working default. Out of the box no alignment button is selected and the logo sits on the left. Picking Left, Center or Right works correctly — you just have to pick one.
- There is no Style tab. The panel has Content, Extra Options, Need Help? and Elementor’s Advanced tab, and nothing else. Any spacing, border or background has to come from the Advanced tab.
- You cannot edit the alt text or the link title. Both are set to your site name automatically, not to the image’s own alt text and not to anything you can type in the widget.
- The sticky logo is not self-contained. Sticky Logo only works when a Navigation Menu widget with Sticky Menu enabled sits in the same container. On its own it silently does nothing, with no warning in the editor.
- Double with no hover image does nothing. If you set Logo to Double but leave Hover Logo Image empty, the widget renders one logo and hovering changes nothing.
- Sticky and Double cannot be combined. Sticky Logo is only offered while Logo is Normal.
Not verified
So you know exactly what has and has not been checked:
- The SVG path. Logo Type = SVG and the Only Svg Logo controls were read in the plugin source only. No SVG logo was rendered and tested, so nothing about how SVG behaves is claimed here beyond the control’s own instruction to choose an .svg file from the media library.
- Tablet and mobile. Logo Max Width, Hover Logo Max Width and Alignment are responsive controls, but only the desktop value was measured. No tablet or mobile viewport was tested.
- Image Resolution other than Full. Only the default Full was used.
- The header template flow. Everything was measured with the widget in an ordinary page container, which is what the sticky behaviour actually keys off. Building the header in Nexter Builder or Elementor Pro’s Theme Builder was not reproduced.
- The sticky logo together with a hover logo. The panel does not offer the combination, so it was not tested.
Troubleshooting
Nothing appears where the logo should be
Image Logo is empty. The widget has no fallback: it does not use the logo from Appearance > Customize > Site Identity and it does not show a placeholder. Open the widget and choose an image.
The logo is far too small
Logo Max Width starts at 100 px. Raise it in the Content section; the slider goes up to 1000 px.
The logo will not move away from the left
No alignment is selected until you choose one. Click Center or Right under Alignment in Extra Options.
There is no Style tab on the widget
There is not one. The widget has Content, Extra Options, Need Help? and Elementor’s Advanced tab only. Use Advanced for spacing, borders and backgrounds.
