Updated on 27 Sep 2022Tested in Monochrome 1.6.0 and Genesis 3.4.0 Monochrome Pro comes with a fixed site header having a white background on all pages including the homepage (with front page 1 section that has the full-width background image) and single posts (that have the featured image as background below the site header). If […]
Genesis
Off-canvas side menu in Genesis using Slideout.js
Update on January 12, 2020: Follow the updated tutorial here instead. Slideout.js is a touch slideout navigation menu for mobile web apps. In this tutorial, I share the steps to display a hamburger menu icon at smaller widths which when clicked/tapped will slide out the widgets placed in a widget area from the side of […]
Inline Site Header and Primary Navigation in Pretty Creative
In Pretty Creative theme, the Primary Navigation menu is moved above the site header out of the box. In this tutorial, I share the steps to wrap the site header and primary nav in a custom div and float site header to left and primary nav to the right on desktops. We shall also make […]
Responsive “background” image for Front Page 1 section in Digital Pro
Digital Pro has code that automatically sets the height of Front Page 1 widget area to that of viewport height and uses Backstretch jQuery script to set an image (changeable via WordPress customizer) as its background. There might be cases when you want the Front Page 1 section to take up only as much height […]
How to set featured image as background for Posts page heading in Genesis
When a static Page has been set as Posts page at Settings > Reading, the title of the Page will automatically appear as a heading on the Posts page in Genesis. This tutorial provides the steps to grab URL of the featured image set for this Page and set it as background image for the […]
Animated Hamburger Menu Icon in Genesis
In Genesis (Genesis Sample, to be precise as well as most other child themes from StudioPress), tapping on the hamburger menu icon at smaller screen widths will toggle the responsive menu and the menu icon does not change i.e., remains a hamburger. It is possible to customize this such that tapping the mobile menu’s icon […]
Custom Author Archive Intro in Genesis
In the comments section of Custom Page Template for Authors Index in Genesis, a user wanted me to ..Add a template for the author showing a short bio and all the posts from the author. WordPress provides an archive page for every author accessible at example.com/author/authorname/ which lists all posts by that author. Posts Grid […]
Custom Page Template for Authors Index in Genesis
This tutorial provides the steps to get the list of all users in the site, loop through them and if the user has published at least one post, display the user’s avatar, display name and job title (a custom user profile field) and use CSS Grid with a Flebox fallback to display the results in […]
Default Footer in Genesis
Footer content in Genesis, out of the box will appear like this: If you’d like to modify it, add this in child theme’s functions.php: add_filter( ‘genesis_footer_creds_text’, ‘custom_footer_creds_filter’ ); /** * Change Footer text. * * @link https://my.studiopress.com/documentation/customization/shortcodes-reference/footer-shortcode-reference/ */ function custom_footer_creds_filter( $creds ) { $creds = ‘Copyright © 2025 · Genesis Sample on Genesis Framework · WordPress […]
Genesis Starter 2.3.0
I have released Genesis Starter 2.3.0, a customized version of Genesis Sample 2.3.0 to include Theme Logo support, inline navigation menu, CSS Grid support for structural elements, mobile first CSS and more. This is the successor to my earlier Sample Starter theme. Click here to see the full list of features and download from the […]
Recent Comments