Jump to content

Linked Image Blocks won't take you to the linked page

Recommended Posts

9 minutes ago, LV-OZ said:

Site URL: https://lobster-ray-g42d.squarespace.com/

Hi - I am having trouble with my image blocks on my homepage, they are set to link to other pages within the site, but when I click on them they do not take me there.

Is there any issue here that I am not aware of?

pw: youcanenter

 

1433449631_ScreenShot2021-07-20at10_59_05AM.thumb.png.681ec7f5a2d1e5e217ee34b2bcd5f4f8.png

You add overlay on the image itself, try to add overlay on <a> tag inside the image so that it still be hoverable

.image-block .image-linked a:before {
    content: "";
    width: 100%;
    height: 100%;
    position: absolute;
    z-index: 1;
    top: 0;
    left: 0;
    opacity: .1;
    background: #000;
    transition: all 0.75s;
}
.image-block .image-linked:hover a:before {
    opacity: .8;
}

image.thumb.png.1a1b86d637ed3dbd16a3c2428cd447d2.png

BeyondSpace - Squarespace Website Developer

🖼️ Lightbox Studio (Enable Pinch/Zoom on lightbox)
🗓️ Delivery Date Picker (Squarespace Date picker form field)
💫 Gallery block 7.1 workaround
🥳 Sparkplugin Customisations Browsers (Browse +100 Spark plugin customisations)
🥳 Elfsight Template Browsers (Browse +1000 Elfsight widget Templates)

If you find my answer useful, let's leave a like or upvote so others with the same issue can find their solution. Thank you!

 

Link to comment
3 minutes ago, bangank36 said:

You add overlay on the image itself, try to add overlay on <a> tag inside the image so that it still be hoverable

.image-block .image-linked a:before {
    content: "";
    width: 100%;
    height: 100%;
    position: absolute;
    z-index: 1;
    top: 0;
    left: 0;
    opacity: .1;
    background: #000;
    transition: all 0.75s;
}
.image-block .image-linked:hover a:before {
    opacity: .8;
}

image.thumb.png.1a1b86d637ed3dbd16a3c2428cd447d2.png

Thank you, you are a lifesaver!!

Link to comment

Create an account or sign in to comment

You need to be a member in order to leave a comment

×
×
  • Create New...

Squarespace Webinars

Free online sessions where you’ll learn the basics and refine your Squarespace skills.

Hire a Designer

Stand out online with the help of an experienced designer or developer.