- This topic has 17 replies, 3 voices, and was last updated 3 years, 3 months ago by
.
-
Posts
-
Your off canvas panel overview doc has instructions for how to make the off canvas panel work only on desktop. I want it to work only on mobile. So I chose that setting, and set the menu I want on both to show up in both “primary” (desktop) and off panel (mobile).
It looks perfect at first. But when I close the mobile menu, the primary menu displays below the site logo. The seemingly obvious solution is to make an empty menu, like your instructions say, and set it to the Primary slot. But then my desktop menu is just a hamburger.
Maybe I’m missing something obvious, but how can I have a menu across the top of my desktop in the usual way, but an off panel canvas behind the hamburger for the mobile views?
Customer Support
Hi there,
Any chance you can link us to the page in question?
You can use the private information field:
https://docs.generatepress.com/article/using-the-premium-support-forum/#private-informationLet me know 🙂
Yes, linked in the private info area.
Hmm never seen this issue before.
Any chance you can disable all plugins and custom functions except GP Premium and GenerateBlocks to eliminate conflicts from other plugins first?
Make sure to activate the parent theme if you are using a child theme as well.
Let me know 🙂
Done!
Hmm strange.
Can you provide the dashboard access for us to take a look?
Actually, can you remove your custom CSS to test first?
I removed CSS and it’s working now. Hmm. Sure, if you send me an email I’ll create a user account for you, if you want. I’ll put my email in the private info box.
Ok, I found the errant piece of CSS in the customizer. I’ve replaced the rest of the custom CSS and turned the plugins back on and it’s working.
This was the code. I’m not sure what it was supposed to do or why I added it. Most of what I’ve added was GP related and found in the forums here, but removing it doesn’t seem to be hurting anything.
Thanks for your help! Now I’ve learned another DIY troubleshooting step. 🙂
@media(max-width: 768px) { .mobile-menu-open .main-nav>ul { display: flex !important; } .main-nav>ul>li.menu-icon { flex: 0 1 60px; } }One last problem. Can you tell me why my social icons at the bottom of the off-canvas panel are so tiny? I’m using the included Gutenberg block and now matter what I change the size setting to in it the block, it still looks the same size in the off-canvas panel.
Customer Support
Hi there,
the Social Links don’t have any CSS to set their font size, so they inherit from the main nav.
Add this CSS to change them:
.slideout-widget .wp-block-social-links.is-style-logos-only .wp-social-link a { font-size: 20px; }That had no effect. I’m using the overlay version, if that makes a difference.
ETA: I take it back. It worked on one site, but not another. Hmm.
Okay, I added this to the site that wasn’t working:
.wp-block-social-links .wp-social-link svg { width: 2em; height: 2em; }And now it looks good to me. I don’t know why this one site always seems to need more CSS than my others when they’re all pretty similarly styled lol.
An alternative way without using CSS would be to use the buttons block with icon from GB:
https://docs.generateblocks.com/article/buttons-overview/Then you should be able to use the block settings to customize them.
Oooh, I like that! Thank you.
- You must be logged in to reply to this topic.
