- This topic has 11 replies, 2 voices, and was last updated 2 years, 3 months ago by
David.
-
AuthorPosts
-
November 1, 2022 at 1:57 am #2396365
Michael
Hello, I would like to have the menu like on this website https://www.rohr-real-estate.com/
, i.e. on the right and also on the smartphone on the right edge.Thank you for your support
Addendum: I would like to solve this with slideout from the site library
November 1, 2022 at 3:36 am #2396502David
StaffCustomer SupportHi there,
is this for a new site ? or an existing site ?
If it is for an existing site – can i see it?November 1, 2022 at 4:30 am #2396581Michael
Hello, is for a new site
November 1, 2022 at 4:56 am #2396620David
StaffCustomer SupportOK, so you could import the Slider Site – and then we could help move the header to the right ? is that an option.
IF so import the site, and share a link to where i can see it.November 1, 2022 at 6:24 am #2396706Michael
thank you
November 1, 2022 at 6:39 am #2396726David
StaffCustomer SupportOk, go to Customizer > Additional CSS.
Inside you will see some CSS.This CSS:
@media (min-width: 769px) { body { padding-left: 60px; } #site-navigation .navigation-branding { margin: 10px 0 auto; } .main-title { writing-mode: vertical-lr; } } #site-navigation { position: fixed; left: 0; min-height: 100vh; max-width: 60px; overflow: hidden; }
Change to:
@media (min-width: 769px) { body { padding-right: 60px; } #site-navigation .navigation-branding { margin: 10px 0 auto; } .main-title { writing-mode: vertical-lr; } } #site-navigation { position: fixed; right: 0; min-height: 100vh; max-width: 60px; overflow: hidden; }
Then go to Customizer > Layout > Off Canvas and change it to show on the Right.
November 1, 2022 at 6:45 am #2396742Michael
Thanks it works on desktop but not on Smartphone
November 1, 2022 at 6:55 am #2396757David
StaffCustomer SupportAh ok, a few things.
First edit the CSS and replace this:@media (min-width: 769px) { body { padding-right: 60px; } #site-navigation .navigation-branding { margin: 10px 0 auto; } .main-title { writing-mode: vertical-lr; } }
with:
body { padding-right: 60px; } #site-navigation .navigation-branding { margin: 10px 0 auto; } .main-title { writing-mode: vertical-lr; }
then:
Layout > Header and Disable the Mobile Header.
Layout > Primary Navigation and set the Mobile Menu Breakpoint to0
Layout > Off Canvas make sure it set to Desktop Only.November 1, 2022 at 7:18 am #2396775Michael
I did everything according to your instructions, but unfortunately no toogle appears on mobile
November 1, 2022 at 7:27 am #2396784David
StaffCustomer SupportAdd this CSS to fix that:
@media (max-width: 768px) { .main-navigation .menu-bar-item { display: block !important; } }
November 1, 2022 at 7:31 am #2396789Michael
Thank You, it works !
November 1, 2022 at 7:33 am #2396792David
StaffCustomer SupportGlad to hear that!
-
AuthorPosts
- You must be logged in to reply to this topic.