[Support request] Set the Entire header element to be a link

[Josh]

I created a header element and set it to a test page.

The header element has an image as a background and in the content I put this code:

I’ve added 15% padding to the top and bottom of the element in the options.

I don’t know how to make this entire header be the link though. Is that possible?

I tried setting .sitebannerlink to 100% height and to display as a block but still nothing.

[Josh]

adding myself to notifications…

[Leo]

Hi there,

Did you get this to work? The entire image is clickable to me currently.

The Container link option in GB pro would be very helpful if you have it:
https://docs.generateblocks.com/article/container-links/

[Josh]

Not really. The only way I could get it to do the link for the whole image was to remove the background image from the element and add this code:

<div class="sitebannerlink">
	<a href="/events/expo-2/"><img src="/wp-content/uploads/2023/03/SNF_working_1154x350.jpg" /></a>
</div>

The problem with this method is that the image doesn’t span with width of the page. Is there any way to do this with the image spanning the background?

[Fernando]

Hi Josh,

The easier way would be to use a Block Element for your Header and use the Container link option in GB pro.

Otherwise, try adding this through Appearance > Customize > Additional CSS:

.sitebannerlink img {
    width: 100%;
}

.page-hero .inside-page-hero {
    max-width: unset;
}

[Author]

Posts