Image description on hover 7.1 personal plan

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

Hi,

I think this is possible in Personal Plan.

Can you share link to page in screenshot? We can check code easier

On 9/15/2021 at 10:14 PM, tuanphan said:

Hi,

I think this is possible in Personal Plan.

Can you share link to page in screenshot? We can check code easier

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!

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

13 hours ago, tuanphan said:

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

Sure thing, the captions are now enabled.

URL for this page is: https://www.stephanilewis.com/television

On 9/20/2021 at 9:04 AM, astpaul said:

Sure thing, the captions are now enabled.

URL for this page is: https://www.stephanilewis.com/television

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 🙂 

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?

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

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;
}

Thanks so much @tuanphan! 🙂