Global Footer and one header not showing the upper layer in live mode

Support
#1

I have recently moved my site from one server to another. I have just noticed that the upper layer of the section background is not showing in live mode on a mobile device. It shows on all other platforms and it shows that it will show on mobile properly but doesn’t?

This is happening on the Global Footer and one header but everything else is ok.

#2

Hello Melanie,

Thanks for writing in! Do you have caching installed? Please clear your site cache first before testing. To assist you with this issue, we’ll first need you to provide us with your URL. This is to ensure that we can provide you with a tailored answer to your situation. Once you have provided us with your URL, we will be happy to assist you with everything.

Regards.

#3

Hello,

Thank you for writing back, my url is https://tngwebdesign.ca

Yes I have W3 Cache installed and I did clear it. I tried creating a different footer, I tried changing many things. Now I noticed that the upper layer on another background in a section of my webpage isn’t showing on the mobile either.

Thank you

#4

Hey Melanie,

I have checked your site on my mobile phone and I am seeing the image and the upper layer semi-transparent background color.

Are you not getting the same result on your phone? Kindly let us know.

#5

No I am getting something completely different, I wonder why? I’ve cleared my browser history and tried a private browsing session to see. And I’ve tried 2 different browsers on my phone. If I turn my phone sideways then I see it but not when I turn it back.

I recently changed the text to white and the upper layer so I could see it on my phone. I’ll check my husbands phone later today and let you know if he is seeing the same thing as me.

#6

Hi Melanie,

I’m getting the same as @RueNel, and yes, please check it with another device. I’ve tried both orientations and works well, perhaps its image loading is slow at your end?

Thanks!

#7

Hello,

I just tried it on my husbands phone and he is getting what I am yet our friend is getting what you are getting. My husband and I both have a iPhone and my friend has a Samsung? I used to be able to see it properly but now I can’t.

Thank you

#8

Hello Melanie,

Since you are using iPhones, please clear your phone’s browser cache. You can also use private browsing mode. And for more testing, please install Chrome browser in your iPhone and test your site again.

Hope this helps. Kindly let us know.

#9

I have tried what you suggested yet I still see something different. Do any of you have iPhones you can check to see if it’s just our phones?

Thank you

#10

Hey Melanie,

I see the issue just in Chrome’s responsive mode so this is not device specific but screen size specific.

That is happening because your footer bar’s content is taller than the actual bar which is currently having a height of 11em.

Try setting your bar’s height to auto. And, it would be nice to set some top and bottom padding as well.

Once set, your bottom footer bar should look like this.

For more building tips and tricks, we have builder tutorials available in our Knowledge Base and also our Youtube channel.

Hope that helps.

#11

Thank you I’ll fix that but what about the Upper Layer not showing on iPhone? Has any been able to try viewing from an iPhone to see about the missing layer. I know it shows on other devices.

Thanks

#12

Hi Melanie,

Yes and I’m still getting the same, the background layer appears. May I know what iOS and Safari version you’re testing it with?

Thanks!

#13

My iOS is 13.2 and my safari doesn’t say but it’s as updated as it can be.

Thank you

#14

Hi Melanie,

Ah, the latest one, this one seems related https://github.com/WordPress/gutenberg/issues/17718. I’ll continue checking but I can’t update to 13.2 as of now. I’ll pass this too for multiple testing too to see if this is a bug.

Thanks!

#15

Ok thank you :blush:

#16

You are most welcome.

#17

So I just fixed my footer bar size and updated 2 plugins today and now all of a sudden my layer is showing on my phone. They were the Contact Widgets plugin and Duplicator plugin. Odd why it happened but none the less I see the layer now. Thank you for your help.

#18

Hey @Melanie,

You are most welcome. Thanks to @Christian finally found out that root cause of the issue.

Best Regards.

1 Like
#19

This topic was automatically closed 10 days after the last reply. New replies are no longer allowed.