different menus in different pages
-
hi there,
i would like to know how to have different menus in different pages. as far i am changing the menu its showing up on all pages.this is the link:
http://360style.de/landingpage_retail
this page i would like to have no menuhttp://360style.de/neu
here i would like to have no menu and the front page but on all following pages.i really appreciate help
thank you so much
g. -
Dear @vernandel
If you wish to remove the menu from a certain page you can do this by adding some Custom CSS - either in Customize or in "Lay Options - Custom CSS & HTML"
Targeting your page e,g "landingpage_retail"
.slug-landingpage_retail .laynav.primary { display:none; } .slug-landingpage_retail .laynav.mobile-nav { display:none; }
This removes the Desktop & Mobile Version for that page.
This will work for the page 'Neu' i am addressing the page with the slug:
.slug-neu
.slug-neu .laynav.primary { display:none; } .slug-neu .laynav.mobile-nav { display:none; }
Hope this helps and best wishes
Richard :) -
thank you so much but i am not sure how to do it.
do i have to past both of your suggestions?this is how my css is looking right now. can you help?
thank you#scrollertop img{
max-width: 30px;
}.video-container {
position: relative;
padding-bottom: 56.25%;
padding-top: 0;
height: 0;
overflow: hidden;
}.video-container iframe,
.video-container object,
.video-container embed {
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
} -
Dear @vernandel
Add the CSS to your Custom CSS Area at the top of ' Lay Options - Custom CSS & HTML'
So:
.slug-landingpage_retail .laynav.primary { display:none; } .slug-landingpage_retail .laynav.mobile-nav { display:none; } .slug-neu .laynav.primary { display:none; } .slug-neu .laynav.mobile-nav { display:none; }
With what you currently have it would be:
#scrollertop img{ max-width: 30px; } .video-container { position: relative; padding-bottom: 56.25%; padding-top: 0; height: 0; overflow: hidden; } .video-container iframe, .video-container object, .video-container embed { position: absolute; top: 0; left: 0; width: 100%; height: 100%; } .slug-landingpage_retail .laynav.primary { display:none; } .slug-landingpage_retail .laynav.mobile-nav { display:none; } .slug-neu .laynav.primary { display:none; } .slug-neu .laynav.mobile-nav { display:none; }
Let me know how you go :)
best
Richard -
hi richard,
thank you. i tried but it removes the menu on the entire site.
-http://360style.de/neu
-http://360style.de/landingpage_retailmaybe we have different wording. so let me try again:
http://360style.de/neu
here i would like to have no menu. also no tag line.If you scroll down or click on the text, you will land here :
http://360style.de/neu#shortcut
i would like to have the menu and the taglinemaybe its not different pages?
tank you so much
g. -
Dear @vernandel
Ok lets take it step by step :)
"http://360style.de/neu
here i would like to have no menu. also no tag line."The CSS would be:
.slug-neu .sitetitle { display:none; } .slug-neu .laynav{ display:none; }
As for the second:
"If you scroll down or click on the text, you will land here :
http://360style.de/neu#shortcut
i would like to have the menu and the tagline"This is more difficult - you would need to add some jQuery saying if your reach a certain scroll position or reach that #anchor point then:
.slug-neu .sitetitle { display:block; } .slug-neu .laynav{ display:block; }
Look into this idea:
https://stackoverflow.com/questions/23037672/how-do-you-add-a-class-to-an-element-when-the-page-scroll-reaches-a-specific-perThis functionality is not built into Lay Theme so if you wish to customize you will need to look into Adding some Custom CSS & JS:
https://laytheme.com/documentation.html#custom-javascriptLet me know how you go! :)
Best
Richard -
Dear @vernandel
Ok :) sorry if i wasnt able to provide the solution you were looking for!
Best wishes
Richard
Before you post:
- When using a WordPress Cache plugin, disable it or clear your cache.
- Update Lay Theme and all Lay Theme Addons
- Disable all Plugins
- Go to Lay Options → Custom CSS & HTML, click "Turn Off All Custom Code", click "Save Changes"
This often solves issues you might run into
When you post:
- Post a link to where the problem is
- Does the problem happen on Chrome, Firefox, Safari or iPhone or Android?
- If the problem is difficult to explain, post screenshots / link to a video to explain it