Title and description not showing on gallery lightbox

Site URL: http://piaeklund.com

Hi, on my desktop i can see titles and descriptions hovering over my lightbox images. But it does not appear on mobile. Only pressing the little dot in the down right corner makes it show, wich is not much help since no one knows to press that. It would be helpful if the box constantly shows in lightbox on mobile.

It looks like there is some code that you can do to make this work? I use template "native". 

If there is a code, how do i apply it and where? (I´m not a coder so have no clue about these things.)

www.piaeklund.com

6 hours ago, studiopiaeklund said:

Site URL: http://piaeklund.com

Hi, on my desktop i can see titles and descriptions hovering over my lightbox images. But it does not appear on mobile. Only pressing the little dot in the down right corner makes it show, wich is not much help since no one knows to press that. It would be helpful if the box constantly shows in lightbox on mobile.

It looks like there is some code that you can do to make this work? I use template "native". 

If there is a code, how do i apply it and where? (I´m not a coder so have no clue about these things.)

www.piaeklund.com

You can try

@media only screen and (max-width: 767px) {
  .sqs-lightbox-meta.overlay-description-visible {
    bottom: 0 !important;
  }
}

Let me know how it works on your site

Hi, thank you, it worked. BUT, it only works when i have the site set on on mobile styles. I have "disabled mobile styles" on template settings, to get the same look on my site either you are on desktop or mobile. And in this look this doesn´t work. Obviously because you can´t hover over on mobile, wich makes sense.

So, my next question is, is it possible to take away the hover effect in lightbox, and have descriptionbox constantly showing when in lightboxmode? Maybe that way the description would show on mobile, even when having disabled mobilestyles.

On 4/22/2022 at 3:49 PM, studiopiaeklund said:

Hi, thank you, it worked. BUT, it only works when i have the site set on on mobile styles. I have "disabled mobile styles" on template settings, to get the same look on my site either you are on desktop or mobile. And in this look this doesn´t work. Obviously because you can´t hover over on mobile, wich makes sense.

So, my next question is, is it possible to take away the hover effect in lightbox, and have descriptionbox constantly showing when in lightboxmode? Maybe that way the description would show on mobile, even when having disabled mobilestyles.

Add to Design > Custom CSS

/* Disable description on lightbox */
.yui3-lightbox2 .sqs-lightbox-meta {
    display: none !important;
}

Thank you, but i think you misunderstood. Now the description doesn´t show at all.

The problem is that i -need- the description to show in lightbox. Both on mobile and desktop.

I have my site set as "disable mobile styles", so that it looks the same on desktop and mobile. On mobile the hover effect doesn´t work for obvious reasons. So my question is, is there some way, to make description show all the time. Maybe by disabling the hover effect, and make the description show -all the time-.

Thank you.

On 4/29/2022 at 3:38 AM, studiopiaeklund said:

Thank you, but i think you misunderstood. Now the description doesn´t show at all.

The problem is that i -need- the description to show in lightbox. Both on mobile and desktop.

I have my site set as "disable mobile styles", so that it looks the same on desktop and mobile. On mobile the hover effect doesn´t work for obvious reasons. So my question is, is there some way, to make description show all the time. Maybe by disabling the hover effect, and make the description show -all the time-.

Thank you.

Try this new code

.yui3-lightbox2 .sqs-lightbox-meta.overlay-description-visible {
    bottom: 100px !important;
}

Thank you so much, it works! 🙂
I also lowered it down to 1px, since 100px put the box a bit in front of the picture.