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

WP SITES

2784

Original Genesis Tutorials & 6000+ Guaranteed Code

Snippets

  • Consultation
  • Full Access
  • Log in

Responsive After Header Image Text & Button

This tutorial adds a after header widget area to the front page of the Genesis Sample child theme by StudioPress. You can add this featured to any other Genesis child theme however the CSS may need a little tweaking.

If you want to do the work yourself, you can take the code from the Enterprise Pro theme like i have done and add it to any child theme yourself which will require some time ( approx. 1 – 2 hours ) as well as modification and addition of code.

Demo Video

Here’s the demo video showing how the CSS for Media Queries works at different screen widths:

Here’s the Genesis – Featured Page width settings you need to configure:

Code Installation

After downloading and unzipping the folder below for logged in members, follow these instructions:

Step 1 : Upload the front-page.php file to the Genesis Sample themes folder. If you’re wanting to use this solution with a theme that already includes a front-page.php or home.php file, you’ll need to take the code out of the front-page.php file and add it to your themes front-page.php or home.php file.

Step 2 : Copy and paste the PHP code from the functions.php file to the end of your child themes functions.php file.

Step 3 : Copy & paste the CSS & CSS for Media Queries from the style.css file to the end of your child themes style.css file.

You’ll also need to configure the Genesis Featured Page widget in the Home Top widget area and choose a page to use for the content.

Here’s the download for logged in members:

Register for full access

Related Tutorials

  • After Header Parallax Image

After Header Image Enterprise 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.