MOBILE TROUBLE: OVERLAY MENU AND FIXED FOOTER NOT WORKING
-
Hey Armin. I've already shared the project with you previously and you helped me figure out how to implement a fixed footer with a 'reveal' effect:
Now I'm working on the mobile version and I have two problems:
- menu overlay doesn't work; tapping the burger icon doesn't do anything on mobile.
- footer disappeared on mobile; it doesn't show at all.
You can access the website using test / test login and password. If you can help, I will be really grateful!
-
hey man pls dont all caps your post title on the forum
nice website!
so you need to use css to make the fixed footer work for mobile too.
you use a custom phone layout, so the css is different here cause the markup is different, best to learn how to use the chrome inspector to inspect the html elements and to understand where the css applies and where it doesn't and what html is currently shown!in lay options → custom css & html → custom css for mobile
#custom-phone-grid{ margin-bottom: 100lvh; background: black; z-index: 1; }
dont use the id of footer here!
because lay theme already uses that id internally for the desktop footer. so it hides the desktop footer in case we have a custom phone layout footer and we are viewing the custom phone layout. so lay theme now thinks your custom phone layout footer is a desktop footer and then hides it for the phone version :Dso in wp-admin go to your footer page, in the gridder switch to your phone layout. then right click the row and don't use "footer" as the id, but use "footer2" or sth
-
the overlay for mobile works for me! does it work for you too now?
-
Hey Armin. Thanks for the footer fix – it works! Appreciate it.
Overlay for mobile – I replaced it with a custom mobile menu, but I'd prefer to use the overlay. Just switched back to it, and it still doesn't work. I left it on for mobile now, so you can check for yourself. Clicking the menu burger doesn't do anything.
-
it just didn't work for you on chrome on mobile right :O
Before you post:
- When using a WordPress Cache plugin, disable it or clear your cache.
- Update Lay Theme and all Lay Theme Addons
- Disable all Plugins
- Go to Lay Options → Custom CSS & HTML, click "Turn Off All Custom Code", click "Save Changes"
This often solves issues you might run into
When you post:
- Post a link to where the problem is
- Does the problem happen on Chrome, Firefox, Safari or iPhone or Android?
- If the problem is difficult to explain, post screenshots / link to a video to explain it