• 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

Digital Pro Adjust The Height of Front Page 1 Hero Image

This tutorial provides the instructions to modify the height of the front page 1 hero image in the Digital Pro child theme by StudioPress.

Demo Video

Shows how to modify the jQuery in the front-page.js file to set the height of the front-page-1 widget background image.

Instructions

There’s 2 steps :

Step 1 : Remove the following jQuery from the digital-pro > lib > front-page.js file located between lines 12 – 22 :

var windowHeight = $( window ).height() - 90;

$( '.front-page-1' ).css({'height': windowHeight +'px'});

$( window ).resize(function(){

var windowHeight = $( window ).height();

$( '.front-page-1' ).css({'height': windowHeight +'px'});

});

Step 2 : Replace the above code with the following :

$( '.front-page-1' ).height(400);

The code in the file should now look like this.

This is what the code modification produces :

From the default which is this :

Uses the jQuery .height() method to set the content height of the front-page-1 div.

Related Tutorials

  • Using jQuery To Change Height At Any Screen Width

Digital Pro Theme

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.