Space Between Menu/Header and Page Content

rlucas1060 · June 2019

Hello, I can't figure out how to remove the space that's displaying between my menu/header and the page content. Any chance u could take a look?

Bryan · June 2019

Hello,

this is called "content padding" and it is enabled by default on each page.

You can disable it globally in theme options>global>advanced.

thanks

rlucas1060 · July 2019

Ah, nice! I see this then affected individual product pages. Do you know of an option to now create space between the header and page content on product pages only?

Pablo · July 2019

Can you send a link to your website?

I'll check what we can suggest you.

Thanks

rlucas1060 · July 2019

Sorry for the late reply. Here is a link: https://www.shop.jniplants.com/product/state-street-miyabe-maple-acer-morton/

I'm trying create space at the top.

While I got you - I can't find the setting to change the color of that black footer bar. Or, is there an option for that bar to "attach to the bottom of screen", so there isn't white/dead space underneath it. My goal is to keep the product pages super lean with no scrolling.

Thanks for all your help!

rlucas1060 · July 2019

For the second part of the above question. I found there was custom css where that background color is. How about - is it possible to completely remove that container? Like, just remove that footer altogehter?

Bryan · July 2019

Hey,

please disable the maintenance mode.

thanks

rlucas1060 · August 2019

Hello - I removed the maintenance mode.

I'm looking to create space at the top. Notice the image and text are near top of screen.

https://www.shop.jniplants.com/product/state-street-miyabe-maple-acer-morton/

Pablo · August 2019

1) To make the space on that product page, you can resolve it in two ways

a) Turn on the "Content Padding" - it's in the Theme Options > Global > Advanced

just turn off the "Content | Remove Padding" option http://prntscr.com/op21ik

b) Change the "Minimalist" option to OFF - Theme Options > Header & Subheader > Header

2) Which footer container? With "Johnson's Nursery" text?

You can completely hide the footer in Theme Options > Footer

Thanks

rlucas1060 · August 2019

I'm getting close! Thank you for the help.

Now, there's too much space above the content. I tried variations of those settings too. It looks like either the content is way at the top or there's tons of room between top screen and content. If you view the page, the settings I have now are 1) Minimalist OFF 2) Remove Padding ON. With Minimalist OFF, whether I turn Remove Padding ON/OFF has no effect.

Pablo · August 2019

Turn on the "Minimalist" option and apply this CSS code in the Theme Options > Custom CSS & JS > CSS

body.single-product header#Header{
  height:75px !important;
}

Thanks

rlucas1060 · August 2019

Thanks, again, getting closer

The product pages look nice.

Now the homepage has anonymous white space at the top: https://www.shop.jniplants.com/

Sorry for the hassle

But thanks for your help.

Pablo · August 2019

I've updated the code above.

It should work fine now.

Thanks

eilishf · August 2019

Hey!

I'm commenting here because i have a similar issue..

I've imported an existing website as i was changing to your theme. I had white space at the top which has now been disabled by turning off the global content padding, but i still have this random black bar at the top of all of my pages...

can you help me get rid of it please?

Bryan · August 2019

eilishf

Hey,

please send a link to this page so we can take a look.

thanks

rlucas1060 · August 2019

Thank you! Is it possible to modify that CSS so it doesn't affect mobile?

Pablo · August 2019

Yes, you have to apply this code in the @media queries.

Check it here:

https://developer.mozilla.org/en-US/docs/Web/CSS/Media_Queries/Using_media_queries

Thanks

geraldjian0 · June 7

Hi - I'm having a similar problem with my website

when I go to Mobile view, the sticky header blocks a portion of the slider revolution element

this only happens for mobile view though - my website name is https://elush.shop/

I tried to find the options to adjust the content padding but i could not find them - need some help

Thank you

Phil · June 7

Hi @geraldjian0,

FYI, it is better to create a new topic for your issue instead of writing in such ancient ones.

Anyway, regarding your issue, please edit your header template, and set Body offset to Yes in the mobile header options:

Best regards

Space Between Menu/Header and Page Content

Comments