• 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

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

Gutenberg

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

Essence Pro Theme Gutenberg Slider

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

Gutenberg Reusable Blocks

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

Gutenberg Reusable Blocks Twenty Twenty Theme

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

Essence Pro Theme Gutenberg Reusable Blocks

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

Essence Pro Theme Genesis Blocks Gutenberg Reusable Blocks

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

Gutenberg Patterns Twenty Twenty Two

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

Genesis Blocks Gutenberg Monochrome Pro Video

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

Genesis Blocks Genesis Markup Gutenberg

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

Accordion & Toggle Genesis Blocks Genesis Markup Gutenberg

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

CSS Grid Columns Custom Fields Genesis Blocks Gutenberg

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

CSS Grid Columns Genesis Blocks Gutenberg

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

Background Image Gutenberg Monochrome Pro Video

Menu Logo Menu In Essence Pro

This solution enables you to modify the default Essence Pro site header elements to display a menu logo menu like this : Centers either

Custom Logo Essence Pro Theme Gutenberg Nav Menu

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

Gutenberg Revolution Pro Theme Slider

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

CSS Grid Columns Gutenberg

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

Authority Pro Theme Gutenberg

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

After Header Image Gutenberg Revolution Pro Theme

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

Entry Meta Gutenberg Magazine Pro Theme

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

Essence Pro Theme Gutenberg Slider

  • Go to page 1
  • Go to page 2
  • Go to Next Page »

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.