Gutenberg & Genesis Block Editor Tutorials

The tutorials in this archive contain solutions relating to the Gutenberg block editor for WordPress used in Genesis child themes. The code is guaranteed to work as shown in the demo images and videos. Installation of all code as well as support for PHP code is provided for members.

Genesis One Page Block Theme

This child theme for Genesis extends the Genesis Sample theme as a 1 page theme using Gutenberg blocks. The one page includes 3 sections

Slider In Essence Pro Header Hero – New Version

This tutorial, written for the latest version of Essence Pro, includes the code which enables you to replace the header hero image on the

Add Reusable Blocks Link To WordPress Toolbar

The code in the download folder adds a custom link in your admin toolbar to the Reusable Blocks page. Download Folder Copy & paste the

Aweber Email Hero Block In WordPress

This tutorial provides the steps which enable you to add your Aweber signup form anywhere in any theme and style it like you see in the

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

Custom Call To Action Block Pattern For Any WordPress Theme

This tutorial provides the code which enables you to add a custom pattern to any WordPress theme. In this case, we add the pattern to the

Replace The Image With Video In Monochrome Pro

This solution enables you to add a responsive video with cover text which overlays the video on all screen sizes. In this case, we replace

Change Post & Page Grid Class in Genesis Blocks

By default, Genesis Blocks wraps the featured image ( as seen in the following images ) in the gb-block-post-grid-image class when using the

Modify HTML Tags In Genesis Blocks

This code enables you to change the HTML tags ( opening & closing ) in the Genesis accordion block or any other Genesis or WordPress

Custom Block To Select Individual Entries Unique On Each Single Post

The code in this download folder adds a custom block which enables you to select individual entries from posts, pages & custom post

Genesis Custom Block for Related Posts

The block files in this download folder enable you to create a custom block for related posts using WP_Query in Genesis child themes. You

Replace Genesis Block Background Image With Video On Monochrome Pro Front Page

For use with the Monochrome Pro child theme for Genesis, this tutorial provides the code which enables you to replace the background image

Replace Image With Slider In Revolution Pro Themes Home Page

This tutorial provides the steps which enable you to replace the home page image with a responsive slider like this - Demo Video Shows

How To Add Image Hover Overlay Text To Gutenberg Images

This solution enables you to show text when images are hovered using the Gutenberg block editor. In this case, unique text is added to each

Copy Genesis Front Page Template Using Gutenberg

This tutorial shows you how to copy the front page template using the Gutenberg editor. In this download, you'll get a copy of the

Full Width Image Block Revolution Pro Front Page

This tutorial shows you how to make the windows image block ( first image ) added using Gutenberg in the Revolution Pro themes front page

Magazine Pro – Move Entry Date Back To The Default Position In The Post Info

This solution enables you to reposition the entry date back to the default position inline with the post info on the front page of the

Replace Hero Image With Soliloquy Slider Premium In Essence Pro Hero Section

This version works with both the free and premium version of Soliloquy slider. It replaces the hero image with the slider on desktops and