• Skip to primary navigation
  • Skip to main content
  • Skip to primary sidebar

WP SITES

2785

Original Genesis & WooCommerce Tutorials & 6000+ Guaranteed Code

Snippets

  • Try Premium
  • Log in

Altitude Pro – Make Front Page Site Header Background Static

By default, the front page site header background is transparent and changes to black on scroll unlike all other pages where the site header background is black by default and remains black on scroll. This tutorial provides a very simple solution which enables you to make the front page site header background the same as all other pages so it’s black and remains black on scroll.

All you need to do is remove or comment out the following 2 CSS rules located between lines 1130 – 1139 in the Altitude Pro child themes style.css file:

/* Remove or comment out these 2 rules
.featured-section .site-header {
	background-color: transparent;
}

.featured-section .site-header > .wrap {
	border-bottom: 1px solid #fff;
}
*/

And here’s the result showing the site header background remains black regardless of scroll like all other pages:

Another option

You could also remove or comment out the following js located in js/global.js between lines 3 -17.

if( $( document ).scrollTop() > 0 ){
	$( '.site-header' ).addClass( 'dark' );			
}

// Add opacity class to site header
$( document ).on('scroll', function(){

if ( $( document ).scrollTop() > 0 ){
	$( '.site-header' ).addClass( 'dark' );			

} else {
	$( '.site-header' ).removeClass( 'dark' );			
}

});

The Altitude Pro child theme by StudioPress is similar to a more recently developed child theme Infinity Pro which also runs on Genesis.

Altitude Pro

Reader Interactions

Leave a Reply Cancel reply

You must be logged in to post a comment.

Primary Sidebar

Code written by Brad Dalton specialist for Genesis, WooCommerce & WordPress theme customization. Read More…

Advertise · WPEngine · Genesis · Log in

  • Access Problems
  • Account Details
  • Consulting
  • Tags
 

Loading Comments...
 

You must be logged in to post a comment.