Archived topic
Set the Entire header element to be a link
4 replies · Started by Josh on March 24, 2023
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.
adding myself to notifications...
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/
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?
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;
}