- This topic has 9 replies, 2 voices, and was last updated 4 years ago by
Leo.
-
AuthorPosts
-
February 27, 2017 at 11:31 am #284679
Nicholas
Hi,
I am really enjoying all the premium features and the theme. One of the best themes I have worked with.
The problem I have is fairly simple, I just have never done anything like it so trying to learn. I did read some other forum posts but none of them did exactly what I want.
I have a secondary navigation menu on my website and I am trying to make it change when on mobile/tablet. I would like it to only have the icons and none of the text as well as not be a drop down menu. So pretty much a separate menu that does not use the drop down feature on mobile.
Any ideas on how I can achieve this? thanks π
February 27, 2017 at 11:36 am #284681Leo
StaffCustomer SupportHi Nicholas,
Checkout this post: https://docs.generatepress.com/article/disable-secondary-navigation-mobile-menu/
Let me know if this does what you wanted π
Documentation: http://docs.generatepress.com/
Adding CSS: http://docs.generatepress.com/article/adding-css/February 27, 2017 at 11:49 am #284683Nicholas
That is almost perfect, it got rid of the drop down menu.
on this menu I have My Account, Cart, and Checkout with icons for each.. how can I make the menu not have the TEXT and only show the three logos? (I guess this is almost a separate menu?)
February 27, 2017 at 12:29 pm #284699Leo
StaffCustomer SupportTry wrapping the text part in hide-on-mobile class like this:
<div class="hide-on-mobile">My Account</div>
Let me know if this works.Documentation: http://docs.generatepress.com/
Adding CSS: http://docs.generatepress.com/article/adding-css/February 27, 2017 at 12:58 pm #284711Nicholas
It worked it is only showing the logos now but it kicked the text down a line on the desktop menu π
February 27, 2017 at 1:01 pm #284716Nicholas
What it is doing.
February 27, 2017 at 1:03 pm #284718Leo
StaffCustomer SupportAdd this addtional CSS:
.hide-on-mobile { display: inline; }
Let me know.
Documentation: http://docs.generatepress.com/
Adding CSS: http://docs.generatepress.com/article/adding-css/February 27, 2017 at 1:04 pm #284720Nicholas
YEY π perfect thank you!
Appreciate the help!
February 27, 2017 at 1:05 pm #284721Leo
StaffCustomer SupportYou’re very welcome π
Documentation: http://docs.generatepress.com/
Adding CSS: http://docs.generatepress.com/article/adding-css/February 27, 2017 at 6:58 pm #284820Leo
StaffCustomer SupportHey actually come to think of it, if you wrap it in span instead of div like this:
<span class="hide-on-mobile">My Account</span>
then you can remove the CSS I provided above:
.hide-on-mobile { display: inline; }
It makes no visual difference. Just 3 less lines of code π
Documentation: http://docs.generatepress.com/
Adding CSS: http://docs.generatepress.com/article/adding-css/ -
AuthorPosts
- You must be logged in to reply to this topic.