Genesis Tutorials

The tutorials in this archive are primarily focused on but not limited to modification and customization of Genesis child themes. Most of these tutorials relate to web design changes, additions and removal of default functionality and features included in StudioPress HTML 5 child themes. Some tutorials also focus on but not limited to 3rd party genesis child themes like Foodie Pro. You'll also find several dozen tutorials for WordPress default themes from 2010 thru to 2016. Tutorials include PHP code that works with Genesis, WordPress as well as CSS, jQuery and HTML. All code is tested and supported for members.

Use single.php Template On All Post Types In Monochrome Pro

The code in this download folder enables you to use the single.php template file with the full width after header featured image, on all

Aweber Email Form Styled Like Genesis Newsletter Block

This tutorial provides the code which enables you to add your Aweber email signup form in the header hero section on Essence Pro theme front

Add Email Optin Form Block To Hero Header In Essence Pro

By default, the Essence Pro themes front page header hero section displays 2 buttons. In this tutorial, you'll get : A custom reusable

Wrap Entry Title & Widget in Same Entry Header Class

If you want to add a custom widget area below your entry title in Genesis and wrap both elements in the same div, you can using PHP code in

How to add text to the bottom of category and tag archive pages

This code enables you to add content to the end of your archive pages like this. The content is added using the Advanced Custom Fields

Logo Inline With Mobile Menu In Genesis Child Themes

You can add this CSS to the end of your Genesis child themes style.css file to move your mobile menu inline with your custom logo or site

Only Show Profile Box On Author Archive If User Has Valid Gravatar In Genesis

This code checks if the author has a Gravatar image and displays the author box before the loop on the author archive page of any Genesis

Custom Avatar In Genesis Author Box

The code in this download folder provides a unique way of changing the default Gravatar hosted avatar with a custom image added via the Edit

Essence Pro Center Header Elements on Mobiles

Copy & paste this CSS to the end of your Essence Pro themes style.css file to center all header elements on smaller screens. Code not

Dynamic Rating System With Stars & Bar Graph

This WordPress code enables you to add your own hand coded star rating system to your child theme without relying on any plugins. The

Scroll Indicator JS For WP Themes

Adds a scroll indicator at the bottom of your fixed header in Genesis and other WordPress themes. Only displays on desktops. Includes the

Style Each Post With A Different Background Color

This code adds a color picker to the Edit Post screen enabling you to set the background color for each post ( Not the front page archive

Color Picker To Style Post Meta

The code in this download folder produces exactly the same result as this tutorial without the need to use a plugin like ACF or add

Inline Style Post Category Links Differently Using Color Picker

The code in this download folder enables you use the color picker on the Edit Category page to style your post category links different

Different Video For Desktop & Mobile

The code in this download folder enables you to change the front page 1 background video on mobile screens. It also includes code to add 2

Open Specific Button Links In a New Window Or Same Window

The PHP code in this download folder enables you to add one or 2 buttons on all single posts & pages without modifying the HTML for each

Load CSS 2 Google Fonts In Genesis Child Themes

Google Fonts now fully supports variable fonts in the CSS v2 API update. Let's look at how to modify the PHP code in your Genesis child