Image Overlay

I think the href needs to be removed from the “a” tag… it’s not added unless you copy an image block or update

• This reply was modified 3 years, 6 months ago by christa365.

Hi,

I updated from Spectra version 2.0.16 to 2.1.0. I am running version 3.9.4 of Astra and 6.1.1 of WordPress, and the only other plugin I have installed is Astra Widgets version 1.2.12.

I can recreate the problem by:

1. Add an image block. 2. Select overlay. 3. Copy and paste the image block. The original image remains fine, but the copied image has an href in the ‘a’ tag.

HTML of original image w/ overlay:

a class=”wp-block-uagb-image–layout-overlay-link ” target=”” rel=”noopener”></a

HTML of copied image w/ overlay:

a class=”wp-block-uagb-image–layout-overlay-link ” href=”” target=”” rel=”noopener”></a

Due to the href, the image is now a link that refreshes the page.

This does not happen if I merely copy the style. I have to copy the block itself. This has always happened as long as I’ve used Spectra (since last month).

Unfortunately, the only two times I updated Spectra, it added hrefs to every image with an overlay. So now, even image blocks that were created from scratch and working fine now have href’s in the HTML after the update. And must be deleted and recreated to resolve.

Screenshot of image block settings:

Screenshot Spectra Image Blog w/ Overlay

Adding an href with no option to assign a url means the image always refreshes the page if you click on it. And since the only way to see the on-hover overlay on mobile is to click on it – the overlay effect is never visible (because it immediately refreshes the page upon clicking).

Offering the ability in the block settings editor to assign a url to the href would be optimal, assuming there was also the option to have no href at all on mobile.

I get that the image overlay needs an anchor tag to have the on-hover effect, but it doesn’t need the href.