Jump to content

Adding a link to an image with revealing text on hover

Recommended Posts


I like to add a link to an image with revealing text on hover. I don't know how to do it. 

To understand better my problem, Please find the attached.

It would be great if you help me to sort it out. 

Thank you.


Link to comment
  • Replies 1
  • Created
  • Last Reply

Top Posters In This Topic

Top Posters In This Topic

Posted Images


You can add an Image Block - Inline



Next, add some caption


Next, add this to Design > Custom CSS

figcaption.image-caption-wrapper {
    visibility: hidden !important;
    transition: all 0.3s ease;
  pointer-events: none;
.design-layout-inline:hover figcaption.image-caption-wrapper {
    visibility: visible !important;
    max-height: 100% !important;
    height: 100% !important;
    display: flex;
    align-items: center;
    justify-content: center;
    transition: all 0.3s ease;


Email me if you have need any help (free, of course.). Answer within 24 hours. 
Or send to forum message

How to: Setup Password & Share url Insert Custom CSS - Page Header - Upload Custom Font - Upload File - Find Block ID - Contact Customer Care

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.