Hi there,
By default, the menu should be on all pages. Is there some CSS that you added that may have removed the menu bar? I see from this thread that Envira helped you add some CSS to widen the page:
https://ww.wp.xz.cn/support/topic/extra-space-3/
Did you stop seeing the menu once that CSS was added?
Thank you for replying darnelldibbles
There is no CSS applied, in the end I applied a Template to the front page (FULL WIDTH PAGE TEMPLATE) and another Template (FW No Side Bar) for the other pages.
Looking at https://fotoscopic.com/mundane :
I need to include a header in each page and I would like to include the hamburger menu icon on each page.
AS far as I can see, I can only have these two things if I choose the same template as the front page (so that the side bar is included)
My trouble is that I have no control over the size of the header size. So that the header MUNDANE is huge on the page, and the space around it seems too much.
Is there so CSS I can use to force the size of the header down?
Thanks
So, I have this sort of work around in place:
https://fotoscopic.com/mundane
I have just moved the header to the bottom of the page. I wanted to just remove the header altogether but then the menu made no sense!
is there any way out of this? There is still too much space around the top of the page. I this the price I pay in Espied to have a menu presented?
That isnt working. I cant remove the title, I cant put it at the bottom of the page.
It is stuck at the top, and I cant control the font size.
This is the bottom line I think and it has me stuck.
Please – any way to control the heading? (I must keep it as I want to include the menu. I could sole this by just going to back to FW No Sidebar, but I need a menu on each page)
Thank you for any tips on how to get out of this fix.
Ok I have found how to reduce the size of the page title
.entry-title {
font-size: 14px;
}
SO, now https://fotoscopic.com/mundane has the text smaller, but the padding around it hasnt reduced. So there is still lots of dead space.
Am I able to reduce the padding around that title?
Are you just wanting to reduce the space between the word ‘mundane’ and the ‘the remarkable ordinariness of life’? If so, you can use this
.entry-title {
margin-bottom: 0px;
}
Thank you Jarret that has worked nicely. Much appreciated.
On my mobile it looks ok…but on desktop there still remains so much padding (to me) between the site name fotoscopic and the page title (mundane).
Would you know of a way to eliminate all that space?
I would like to have the menu displayed on each page, but so far choosing the Full Width Page Template means yes, I get the menu, but also a lot of dead space
Example: https://fotoscopic.com/mundane
I can keep the page looking nicely formed, but without the menu, if I choose Full Width No Side Bar
Example: https://fotoscopic.com/unposed
Do you see my problem?
You have this code setup in your custom CSS somewhere
.content-area .site-main {
padding: 20px 0 !important;
}
Which is causing the space between the site name and the page title. If you remove that or lower the 20px value to something like 5px it should reduce the space for you.
Thank you Jarret. Yes, I did locate that CSS and have been able to make some improvements:
I have changed the size of each page header to zero (so its not visible on the page) so now
https://fotoscopic.com/mundane
Looks better
But, is there any way I can squeeze the space down any further?
On a mobile device it doesnt render too badly, but on a desk top there still remains so much space between the site header (fotoscopic) and the page defintion (“mundane: the remarkable ordinary)
Am I just stuck with this extra black space? Hope not! Also, the shade of black between the row that holds the site name and the menu icon is a different shade of black that “mundane: the remarkable ordinary” sits on. Is there any way to change the background colour so that each row matches?
One way out of this is to totally remove the “mundane: the remarkable ordinary” line, but i wanted to include this as it helps explain the page to the uninitiated.
THanks again in advance for any tips.
David.
Hi David,
But, is there any way I can squeeze the space down any further?
The remaining space is the padding added to the site header itself, combined with the fact that the theme specifies a minimum height for the site header, so even if we reduce the padding, the header will never be less than a certain height.
You can override that using this:
#page header#masthead.site-header {
padding-bottom: 10px;
min-height: 0;
}
Also, the shade of black between the row that holds the site name and the menu icon is a different shade of black that “mundane: the remarkable ordinary” sits on. Is there any way to change the background colour so that each row matches?
You can use this:
.site-header {
background-color: #000;
}
HI kokkieh
Thank you so much for that. I have applied
#page header#masthead.site-header {
padding-bottom: 10px;
min-height: 0;
}
And now there is a tighter look to the page
I did however decide to just remove entirely the ““mundane: the rem….” as I thought this was just superfluous anyway
Thank you again, much appreciated.
David.
