Page 1 of 1

*** SOLVED *** Pop Out Gallery Stopped Working

Posted: Mon Aug 12, 2019 1:30 am
by nrgiser
Hi good people,

I have come across a recent problem with my website. I have two galleries on each page, one gallery for page size 800 px and up and another galley for 320 px.

For the 320 px, the galley is a "Lightbox Gallery" and set to "Fancybox" so that when someone wants to look at a picture in more detail they can tap or click on the picture and it pop outs and starts the gallery.

All was working fine, until yesterday when I noticed it was not working anymore on my phone. So I checked the website on 3 other phones and it was not working on those either.

I checked to make sure all the settings are the same, which they are and have not changed.

So I am a bit stumped to why it has stopped working. I am only using Fancybox 1 I believe the one that came with WB 14.

The gallery is working fine in the other page sizes.

Can anyone point me in the right direction for me to check to see what may have gone wrong or any suggestions to try and fix it.

The URL is >> www.ocean-bay-beach-resort.com

Thank you for your time in this matter, it is much appreciated.

Re: Pop Out Gallery Stopped Working

Posted: Mon Aug 12, 2019 6:44 am
by Pablo
Where exactly do I need to go on the website to see the lightbox gallery?

Re: Pop Out Gallery Stopped Working

Posted: Mon Aug 12, 2019 9:52 am
by nrgiser
Hi Pablo,

It only becomes visible when viewed in a screen size between 320 px and 480 px, so it is probably best to view it in Chrome and then "More Tools" and then "Developer Tools", there you will see it.

Thank you for your time.

Re: Pop Out Gallery Stopped Working

Posted: Mon Aug 12, 2019 11:06 am
by Pablo
Can you please be more specific?
Which page?
Where on the page exactly?

Re: Pop Out Gallery Stopped Working

Posted: Tue Aug 13, 2019 11:22 pm
by nrgiser
Hi Pablo,

No problem. OK on the home page www.ocean-bay-beach-resort.com at the top in the 320 px size screen you will see a gallery, it states under that gallery "Click on image for pop out gallery" it is the gallery right above this. It used to work perfectly fine up until about 4 days ago. It is also the same problem for any page with that gallery on it, which are the resort page, the room pages etc. The gallery on the 320 px page does not work anymore, as where when you click on it the gallery no longer pops out and expands. Nothing has been changed on this page, so I am confused to why it suddenly stopped working. Any breakpoint 480 px and bigger uses a different gallery and that all works fine still. It is only on the breakpoint 320 px that I am having a problem.

Thank you for your continued time in this matter.

Re: Pop Out Gallery Stopped Working

Posted: Wed Aug 14, 2019 5:06 am
by BaconFries
You yourself have manually added code at the end of the page, this will break other code and its function. Please remove this code and insert correctly between the <head></head>tags* using Page HTML.
Code inserted in wrong place..
Image

Re: Pop Out Gallery Stopped Working

Posted: Wed Aug 14, 2019 6:52 am
by Pablo
The page headset (PageHeader1) overlaps the image so that is why you cannot click it.

Re: Pop Out Gallery Stopped Working

Posted: Wed Aug 14, 2019 7:37 am
by nrgiser
Hi BaconFries,

Thank you for your input, you are right i did indeed put that piece of coding at the end of the page as it is one of the last things that needed to be loaded on the site. I have again put it in between the headers.

But that is not what is causing my gallery in the 320 px size from working properly, as that snippet of code is only on the home page and not on any other page in the site and I am having a problem with all the galleries within the site on the 320 px breakpoint.

As i was writing this reply I had an idea to what could be causing the problem and i have indeed discovered why this is happening, but I cannot find a solution.

I have a header on the page, which over laps the gallery on the 320 px page, and as the header is set too "In front of Content" the gallery wont work.

I have tried to find a way of reducing the header depth on the page so it is not over the gallery, but I cannot seem to figure that out. It must be an easy solution, but it seems my header depth is set and i cannot reduce it in size.

Once someone tells me how to reduce the depth of the header on a breakpoint my gallery will start working again on that breakpoint.

I think I have just figured this out too as I am writing this. I do not think I can adjust a header for specific breakpoint on the page and that the header depth will only shorten to the first object on one of the larger breakpoints. So on breakpoint 1920 px the header depth is fine, but the depth on 320 px over laps the gallery as it is a smaller page.

Is there a way to adjust the depth of the header on a specific breakpoint, as you can adjust the same objects and text per breakpoint.

Thank you.

Re: Pop Out Gallery Stopped Working

Posted: Wed Aug 14, 2019 7:38 am
by nrgiser
Hi Pablo.

I saw you replied as I was writing my last post, and yes this is what I have figured out too. So can I adjust the header per breakpoint as asked in my last post on this subject.

Thank you.

Re: Pop Out Gallery Stopped Working

Posted: Wed Aug 14, 2019 8:55 am
by Pablo
Yes, the page header can have a different height in each breakpoint.

Re: Pop Out Gallery Stopped Working

Posted: Wed Aug 14, 2019 9:29 am
by nrgiser
Hi Pablo.

This maybe a stupid question but how can you change the height of the header?

For example in the breakpoint 1920 px the header comes to the edge of the menu which is placed inside the header. I cannot of course make it any shorter as then the menu would not fit inside the header.

But on breakpoint 320 px on the same web page, I cannot make the header any shorter than the menu in breakpoint 1920 px. When i render hidden objects you can see the menu for breakpoint 1920 px resting along the bottom of the header in breakpoint 320 px. It seems I cannot make the header any shorter than the menu bar in breakpoint 1920 px, even though I am working on breakpoint 320 px.

So if i can adjust the height individually on each breakpoint, then how do I make the header shorter on breakpoint 320 px than the menu which is on breakpoint 1920 px. When I try and adjust the size manually on break point 320 px, from 131 to 100, it reverts back to 131 as soon as I press enter. When I try and adjust it using my mouse, the pointer will not go any higher than the menu bar on breakpoint 1920 px.

Thank you.

Re: Pop Out Gallery Stopped Working

Posted: Wed Aug 14, 2019 9:59 am
by Pablo
You will have to make sure that all objects are inside the container.
The header (layer) cannot be smaller than its contents.

Re: Pop Out Gallery Stopped Working

Posted: Thu Aug 15, 2019 1:35 am
by nrgiser
Hi Pablo,

There was an easy fix to this after all.

I just had to hide the first header on the 320 px breakpoint and then add a new header just for that breakpoint.

And it works again.

You can now close this thread.

Thanks to you and BaconFries for your suggestions.