- This topic has 25 replies, 3 voices, and was last updated 5 years ago by Tom.
-
AuthorPosts
-
February 7, 2019 at 6:20 am #803923Leonardo
Hello,
this is the PDF with the mobile menu that my customer would like have in your site:http://www.demowordpress.it/monaldesca/wp-content/uploads/2019/02/Menu-Mobile.pdf
Thanks a lot!
Leonardo
February 7, 2019 at 7:25 am #804113DavidStaffCustomer Support1. Align mobile toggle:
#mobile-header .menu-toggle { margin-left: auto; }
2. Center align slideout menu:
#generate-slideout-menu .slideout-menu li { text-align: center; }
3. Full screen slideout – just to note this is coming to GPP 1.8 – so you won’t need this in a future update:
3.1 First create a new Custom Menu item in your slideout menu.
Add the URL of:#
Give it a label of:<span class="slideout-exit screen-reader-text">Chiudi</span>
Add this CSS:
@media (max-width: 768px) { .offside--left.is-open, .offside-js--is-left .offside-sliding-element { -webkit-transform: translate3d(100vw, 0, 0); -moz-transform: translate3d(100vw, 0, 0); -ms-transform: translate3d(100vw, 0, 0); -o-transform: translate3d(100vw, 0, 0); transform: translate3d(100vw, 0, 0); } .offside--right.is-open, .offside-js--is-right .offside-sliding-element { -webkit-transform: translate3d(-100vw, 0, 0); -moz-transform: translate3d(-100vw, 0, 0); -ms-transform: translate3d(-100vw, 0, 0); -o-transform: translate3d(-100vw, 0, 0); transform: translate3d(-100vw, 0, 0); } .main-navigation.offside { width: 100vw; } .offside--left { left: -100vw; } .offside--right { right: -100vw; } .offside-js--is-right.slide-opened .slideout-overlay button.slideout-exit { right: auto !important; } .offside-js--is-left.slide-opened .slideout-overlay button.slideout-exit { left: auto !important; } }
February 7, 2019 at 9:31 am #804230LeonardoAll perfect, thank! Just this question: I create a new Custom Menu item in your slideout menu, with # and label as you write, but I can’t see the item “Chiusi”.
If it’s more easy, we can insert a “X” like before…
Thank you for your patience
February 7, 2019 at 9:43 am #804244DavidStaffCustomer SupportThe X should be output automatically by GP styles. The Chiusi is just the screen reader text, its not meant to be visible just there fore accessibility.
March 4, 2019 at 12:23 pm #828739LeonardoHello David,
I’m here again for a problem: until last week everything was ok and I was able to fix the menu, to make it and put two sliders, one for mobile and the other for the desk.
Just before, I discovered that when I open the site on the desktop, the menu items overlap and those of the secondary menu (with the items of WPML), are noticeably larger, even the whole layout is not good. Finally, in mobile mode the slider does not occupy the whole screen as set.I noticed that there was an update to WordPress with version 5.1. Is it possible that this has caused such poblems? I add that I have just updated the plugins for which updates were available.
I’m pretty worried, because until yesterday everything was ok and I was about to deliver the site to the customer.
Thank you for your reply and have a nice day!
March 4, 2019 at 12:24 pm #828741LeonardoSorry, the web site is: http://www.demowordpress.it/monaldesca
March 4, 2019 at 6:46 pm #828957TomLead DeveloperLead DeveloperHi there,
Your secondary navigation items don’t seem to have any text inside the link elements: https://www.screencast.com/t/wI6FRpRm
Maybe it’s a bug in WPML?
Your slideout seems to be full width on mobile for me, although there isn’t a way to close it currently. Can you show us a screenshot of what you’re seeing?
Thanks!
March 4, 2019 at 8:34 pm #829013LeonardoHello, thanks to the backup of the hosting I restored WPML and now the secondary menu entries and slideouts are correct.
All other pages also work correctly, both on the desktop and on the mobile. At the moment these problems remain:
-the main desktop menu does not show everything and a voice overlaps with the logo.
-the slider of the home page does not occupy the whole page, both from desktop and mobile, and on mobile the menu does not occupy the entire screen (with David we implemented the code to achieve this effect, even if you did not see the closing X was good the same). I enclose the screenshots.Thanks a lot!
http://www.demowordpress.it/monaldesca/wp-content/uploads/2019/03/Immagine.png
http://www.demowordpress.it/monaldesca/wp-content/uploads/2019/03/Screenshot_2019-03-05-05-31-50.png
March 5, 2019 at 9:40 am #829713TomLead DeveloperLead Developer1. This is an issue with the logo centering method. You’ll have to either reduce the width of your menu items, or reduce the number of menu items in the navigation.
2. Try adding this CSS:
.flexslider li { padding-left: 0 !important; }
March 7, 2019 at 12:51 am #831342LeonardoHi Tom,
I solved the problem, just a lines of css code interfered with the “li” of the slider and of the primary and secondary menus.
Now everything is ok, thank you very much for your patience!
Have a good day!
March 7, 2019 at 6:47 am #831663TomLead DeveloperLead DeveloperNo problem! You too 🙂
-
AuthorPosts
- You must be logged in to reply to this topic.