Leo
(@leohsiang)
Hi there,
but the problem is that on one of the installations I don’t have an option to choose structure (Float, Flex) in Customize – General settings.
Only older sites would have the option that allows you to switch from Float to Flex.
New installs will have Flex structure set by default.
And I think this may be the reason why I can’t setup different menu settings for desktop and mobile versions. For example, I want my primary menu to be “float right” on the desktop and I want this menu to be under the website logo and site title on the mobile.
GP does not have responsive settings for navigation location.
GP does not have responsive settings for navigation location.
Well, how does one of installations work as I described then? The structure of this installation is set to Float by the way if it makes any difference. Can it be the reason?
And are you telling me that I can’t have different menu location for desktop and mobile for the other installation?
Leo
(@leohsiang)
Tough to tell without seeing the site live.
Can you link me to the page(s) in question so I can compare?
Can you link me to the page(s) in question so I can compare?
I can. Can you tell me please how can I give you a link without sharing it for everybody publicly?
Leo
(@leohsiang)
Unfortunately there isn’t a way to share link privately in the free theme support forum here – it’s a WP rule.
Thanks for your understanding.
Hm.. Well, then maybe you can tell me what you wanted to check on the website live so I could check it myself or give you some screenshots or smth like that?
Leo
(@leohsiang)
I need to use the browser inspector tool to check the code/HTML.
Unfortunately screenshots don’t help with issues like this one.
Well, I could give you a screenshot of the HTML code from the dev tools window if that’s what you’re talking about.
Anyway, I compared these wordpress installations one more time and I saw that the installation that has menu under the title doesn’t have logo on mobile version and the installation that has menu float right has a logo on mobile version.
So, can you tell me please how can I hide logo for mobile version? Do you need to see the website live in order to help with this question?
Leo
(@leohsiang)
This CSS should hide the logo on mobile:
@media (max-width: 768px) {
.site-logo {
display: none;
}
}
Thanks but hiding logo didn’t help. It looks like the main problem is with site’s width and tagline’s wrapping.
I decided to add some screenshots below. Maybe they’ll help to better understand the situation:
https://prnt.sc/zpLuXrnM2Jc6
https://prnt.sc/CREHzKrXRw0p
Second screenshot shows that site’s tagline is in one line whereas on the first screenshot it’s in multiple lines. Can you help me please make this tagline wrapped just like on the first screenshot?
Leo
(@leohsiang)
Unfortunately I need to see the sites in question to provide a solution.
Thanks for your understanding.
Ok then. Hope it’s okay if I send the sites via the screenshot:
https://prnt.sc/9BuikFDuwEAo
Leo
(@leohsiang)
So the main site is using the old float structure and the /ua site is using the new flex structure.
Try adding this CSS to the /ua site:
@media (max-width: 768px) {
.has-inline-mobile-toggle .main-navigation.mobile-menu-control-wrapper {
width: 100%;
}
}
Adding CSS: https://docs.generatepress.com/article/adding-css/
Thanks. I added the CSS and menu button got bigger but site’s tagline is still not wrapped in multiple lines like on the English version of the website.
Is there a way to make site’s tagline wrapped in multiple lines based on site’s width?
Here’s a screenshot of how it looks like with your CSS:
https://prnt.sc/jnjjn95XlsZd
Leo
(@leohsiang)
Try this:
@media (max-width: 768px) {
.site-branding-container {
display: block !important;
flex-shrink: unset;
}
}
