split screen only for one page
-
Hi!
Is it possible to keep landing page as split screen setup and keep rest of page without?
Thank you!
-
yea!
just use the css for one page like:
https://laytheme.com/documentation/custom-css-styling.html#css-based-on-current-pageso if your body class is ".slug-home":
/* using "body>.lay-content #grid" instead of "#grid" for compatibility with "Overlay Feature" */ body.slug-home>.lay-content #grid, #footer-region { height: 100%; position: fixed; top: 0; overflow-y: scroll; overflow: -moz-scrollbars-none; scrollbar-width: none; -webkit-overflow-scrolling: touch; } body.slug-home #footer-region { left: 0; width: 50%; } body.slug-home #footer{ box-sizing: border-box; min-height: 100%; } body.slug-home>.lay-content #grid { right: 0; width: 50%; } body.slug-home>.lay-content #grid{ box-sizing: border-box; } body.slug-home *::-webkit-scrollbar { display: none; } -
yea!
just use the css for one page like:
https://laytheme.com/documentation/custom-css-styling.html#css-based-on-current-pageso if your body class is ".slug-home":
/* using "body>.lay-content #grid" instead of "#grid" for compatibility with "Overlay Feature" */ body.slug-home>.lay-content #grid, #footer-region { height: 100%; position: fixed; top: 0; overflow-y: scroll; overflow: -moz-scrollbars-none; scrollbar-width: none; -webkit-overflow-scrolling: touch; } body.slug-home #footer-region { left: 0; width: 50%; } body.slug-home #footer{ box-sizing: border-box; min-height: 100%; } body.slug-home>.lay-content #grid { right: 0; width: 50%; } body.slug-home>.lay-content #grid{ box-sizing: border-box; } body.slug-home *::-webkit-scrollbar { display: none; }@arminunruh Thank you!
-
@arminunruh
Hi, I've used the code as mentioned above to make a splitscreen landing page. on this page i have text with links to projects etc. If i click on any of the links, it now goes to a new page, without splitscreen (yay!). But the leftside of my splitscreen stays on this new page. Any idea how to fix this?Edit. U have now used this code:
[data-slug="grand-march"] .footer { display: none !important; }this way i have to add one for every new project page. is there an easier way?
-
how about
body.type-project .footer {
display: none !important;
}this will hide the footer on all project pages
Hello! It looks like you're interested in this conversation, but you don't have an account yet.
Getting fed up of having to scroll through the same posts each visit? When you register for an account, you'll always come back to exactly where you were before, and choose to be notified of new replies (either via email, or push notification). You'll also be able to save bookmarks and upvote posts to show your appreciation to other community members.
With your input, this post could be even better 💗
Register Login