Archived topic
Customize main menu icons in mobile
19 replies · Started by Pedro Chincoa on November 14, 2017
Hi there!
How can I customize the colors and position (I want them to be horizontal) of the main menu icons in mobile?
I've tried with menu-item-float-right.
The thing is that I want the desktop-centric menu and that the WPML selector was also well aligned in Mobile.
In vertical breaks all the design..
Thank you!
Hi there,
Your site is in maintenance mode so I can't see it.
Have you tried the mobile header feature? https://docs.generatepress.com/article/mobile-header/
Hi Leo,
Sorry, my website is not in maintenance. You can click on several links and see the problem in mobile.
I do not want to use the header on the site. Only modify the color of the main menu on the mobile and see the items horizontally, as in the desktop option
I have added the following CSS code:
@media (max-width: 768px) {
.primary-navigation .main-nav ul ul li a {
color: #fff;
}
.generate-combined-header .main-navigation.toggled {
background-color: transparent;
}
#generate-slideout-menu li.menu-item-float-right {
display: inline-block !important;
}
}
I still can not change the color and above all I can not put the icons in horizontal line
Can you help me please?
Thanks
This is what I currently see on mobile: https://s33.postimg.org/dea91tybj/2017-11-14_0822.png
I'm still not quite sure what you are after? I don't see any icons?
I mean the first page, in which there is a page header with a photo and particles. The capture that you have passed to me is from the "multimedia" page.
Click here, please: http://pedrochincoa.com/
Ahh I see.
So basically you don't want the menu to be responsive on that page?
What about the other pages?
Oh, finally!
What I want is to have the menu (icons) responsive, of course, but horizontally, only on that page. On the other pages I combine the top bar and the secondary navigation
Can you see the icons vertically? true? They look so bad
That's just what I need, change position and color in mobile
...Thanks
Do you still want the toggle though?
I prefer without toggle though.
Just like it is in desktop: horizontal, white color and in hover {color: #2c3840;
background: #fff;}
Con you help me or not? Sorry but I think I've written the same thing many times.
Thanks
That's what I've been trying to do. Your explanation wasn't clear to me.
Try this solution and the CSS the user mentioned below: https://generatepress.com/forums/topic/menu-item-visible-on-mobile/#post-422745
Excuse me if I was not clear. My English is terrible
But I also tell you that you took 4 messages to recognize the page.
Nothing happens with that CSS :(
Right because of the language barrier like you said :)
Did you add the snippet that Tom provided which I linked?
Yes, I added the snippet. And it does not work!!
Just to double check (As it worked for the other users and I just tested it works as well).
This is added:
add_action( 'wp_enqueue_scripts', 'generate_dequeue_mobile', 100 );
function generate_dequeue_mobile() {
wp_dequeue_style( 'generate-mobile-style' );
}
Using one of these methods: https://docs.generatepress.com/article/adding-php/
Hi Leo,
It's weird . Because it only works when I'm logged in! If I close WordPress session, it does not work.
Do you know why this happens? Thanks