Hi guys, i’m building a very simple website, but i can’t understand how to get a full screen view of the site. As there is little content, at the bottom when displayed on a large screen, you see an annoying white part, because the footer remains attached to the previous block. I enclose a screenshot because I am afraid I have not made myself clear.
here the link to see it:
http://www.classyday.xyz/ddcdudu/real-estate/
Thank you
It looks like you applied full-width instead of full-screen
When using full-screen Blocs add the class .bloc-fill-screen for this.
If you click on the bloc to highlight it, then look at the settings panel to the right. You can change the padding. Change it to fullscreen.
1 Like
thank you very much
I’ve another question: is it possibile to change the color of header and footer in every page of my website?
tx
Yes, just create a class and change the colour. Then everytime you create another page the footer will be the same (as long as you have created them in a global area, i.e. the top and bottom blue part)
So click on the footer, then create a class called something like footer_colour, then on the background tab of the class, set the colour.
It’s not what i mean. i’d like to see header, central bloc and footer all in the same page. If i set just the central bloc with fullscreen, when i preview i have to scroll to see the footer
how can i do that?
Have you tried any of the other options other than full screen? try XXL or Xl and see if they work for you, they are slightly smaller.
The problem is that I would like to have both header and footer visible at all times regardless of the size of the screen from which I am looking. If I use xl for example and then view the website on a 13 inch screen, to see the footer I will have to scroll down. instead I would like it to always be there in the same place
Flexible space between content and footer in this link a user did the same question, but i can’t understand the answer
in this way it change the colour in every page in one time. i want a colour for the homepage, another color for the page contact, another one for the page about, etc…
You would need to use custom classes to calculate the height of each section.
In this example, I have set the main Bloc height to 80vh thats 80% of the vertical height. I’ve then used another class to set the footer height to 20% of the vertical height.
Regardless of height they will always show on screen. However things might get messy and create overlap so watch out for that.
fill-height-example.bloc (30.3 KB)
1 Like
Tx Norm, it was exactly what i needed
http://www.classyday.xyz/ddcdudu/index.html
GREAT!
And what about changing header and footer color (global area) in every page?
1 Like
Now I have just seen that in the other breakpoints a mess happens. How do I apply that percentage division system only in the desktop version?
Ok, for a change in footer colour for different pages.
example: you have 4 pages named, Page1, Page2, Page3 and Page4.
On page 1 create a class for your footer called footer_colour and set background colour to red.
This will create every footer to inherit the colour red as its global.
On page 2 open page settings and in the body classes field, write page2. Now open the class manager and create the class called page2 .footer_colour (leave spaces in tact, when asked by the prompt that pops up)
Now for the page2 .footer_colour class change the colour to green.
so basically the footer_colour class will apply to all pages as red, but where you have named the body class as page2, it will set this one to green.
So for page 3, you would goto page settings and name body class as, page3.
Then create a class in the class manager called page3 .footer_colour (keep spaces on prompt) then apply a background colour to the class and repeat.
This was a quick example, so i would recommend probably naming the classes more relevant to you.
p.s. you wont see the changes on the design canvas, you will have to preview to see the colour changes