Infinity Pro – Header overlays first widget area on front page

[PyramidWeb]

Hi there,
I'm currently building a website using the Infinity Pro theme in a local environment. I'm using a logo instead of the site title, so the background of the header is always white (even without scrolling).

My problem: The header overlays the first widget area on the front page. For example, the header covers the upper part of the background image in the first widget area.

My question: How can I make the first widget area start after the header, so that the header does not cover any part of the first widget area?

In my opinion, adding a constant margin-top for ".front-page .site-inner" is not an option because the height of the header changes depending on viewing device. In addition, the height of the responsive header depends on the number of menu items.

Thanks for your help. Your comments are much appreciated.

http://(local)

[ᴅᴀᴠɪᴅ]

in infinity pro this problem is solved on the other pages apart from the home page. the site inner gets margin-top automatically applied depending on the height of the site header and if it's fixed position or not.

The only page this doesn't apply on is the home page. It sounds like all you need to do is activate it for the home page aswell.

so you need to go into /infinity-pro/js/global.js

and find the bit...

// Push the .site-inner down dependant on the header height.
	if ( ! $body.hasClass( 'front-page' ) ) {

		__repositionSiteHeader( headerHeight, $siteInner );

		$(window).resize(function() {

			// Update header height value.
			headerHeight = $siteHeader.height();
			__repositionSiteHeader( headerHeight, $siteInner );

		});

	}

and remove the restriction for the front page...

// Push the .site-inner down dependant on the header height.

		__repositionSiteHeader( headerHeight, $siteInner );

		$(window).resize(function() {

			// Update header height value.
			headerHeight = $siteHeader.height();
			__repositionSiteHeader( headerHeight, $siteInner );

		});

	

make sure to remove the end bracket also so you don't brake the js

---

I love helping creative entrepreneurs build epic things with WP & Genesis.

Follow on Twitter

[PyramidWeb]

Thank you, Dave. That solved the problem!

[Author]

Posts