Jump to content

Image description on hover 7.1 personal plan

Recommended Posts

Site URL: https://www.stephanilewis.com/

Hello,

I am building a portfolio webpage and I have run into an issue. I am working in 7.1 with a personal plan and I can't seem to find the code to solve this. I have some landing pages that each have a gallery slideshow with images that link to their individual project pages. I have found code to add a color overlay of the images on hover but I cannot seem to figure out code for hover text. I believe what I want is an option for gallery blocks but those are only available on blog pages.

I've attached some screenshots of what I have now and what I am aiming for.

This is a site for someone else so I cannot upgrade to a Business Plan.

URL: https://www.stephanilewis.com/
Password: newyork11

Screen-Shot-2021-09-14-at-12.24.31-AM_current.jpg

Screen-Shot-2021-09-14-at-12.24.31-AM_desired.jpg

Link to comment
  • Replies 9
  • Views 703
  • Created
  • Last Reply

Top Posters In This Topic

On 9/17/2021 at 10:09 AM, astpaul said:

Hello! Yes, the link to that specific page that I referenced is: https://www.stephanilewis.com/television

I would like to add this effect to multiple pages but I can start with that one and figure out the others!

Can you enable Gallery Caption & add some demo caption? We can test code easier

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

Contact Customer Care - Learn CSS - Buy me a coffee (thank you!)

Link to comment
On 9/22/2021 at 8:03 PM, stephanilewis said:

Hi @tuanphan, just curious if you've had a chance to look at this? Not to rush you at all, I'm going to take this site live as is if not 🙂 

Hi,

I don't see caption here. Which image did you add caption?

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

Contact Customer Care - Learn CSS - Buy me a coffee (thank you!)

Link to comment
5 hours ago, tuanphan said:

Hi,

I don't see caption here. Which image did you add caption?

Hi @tuanphan, I turned the captions off since this is a website for my client and she wants to go ahead and publish it to begin applying for jobs. I will turn them on again until tomorrow if you have the opportunity to check it out again!

The page that has captions is: https://www.stephanilewis.com/television
Password: newyork11

Edited by stephanilewis
Link to comment
11 hours ago, stephanilewis said:

Hi @tuanphan, I turned the captions off since this is a website for my client and she wants to go ahead and publish it to begin applying for jobs. I will turn them on again until tomorrow if you have the opportunity to check it out again!

The page that has captions is: https://www.stephanilewis.com/television
Password: newyork11

I see images is very small

Don't remove any code in your current code. Add this to DESIGN > CUSTOM CSS (Personal Plan supports CSS)

figcaption.gallery-caption.gallery-caption-reel {
    position: absolute !important;
    top: 50%;
    left: 50%;
    margin: 0 !important;
    transform: translate(-50%,-50%);
    z-index: 9999;
    opacity: 0 !important;
}

figure:hover figcaption.gallery-caption.gallery-caption-reel {
    opacity: 1 !important;
}

 

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

Contact Customer Care - Learn CSS - Buy me a coffee (thank you!)

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.