With the addition of the Gutenberg Block Editor my development workflow has vastly changed over the past year. Integrating a variety of custom blocks using Advanced Custom Fields has become a vital part of each website I build. In this post I’ll highlight a few different blocks that I have created showing their flexibility and some great use-cases.
A staple on most websites is some variation of a hero block. Whether this is a large image with text on it, a background video with a text overlay, or some sort of simple slideshow, most sites these days have some sort of “hero block”. Here are a few different ACF hero blocks I’ve built.
Last Week in AWS
Split Image Blocks
Here are a few examples of what I call “Split Image Blocks” where there is an images on one side and content on the other. The content and image both align vertically centered using flexbox.
Whiteley Designs Home Page
Testimonials are an important, and common aspect of many sites. Here are a few examples of custom testimonials blocks created with ACF.
Real Estate on Purpose
Last Week in AWS
Each site has it’s own nuances. Below are a few advanced blocks that show some more versatility that ACF custom blocks offer.
Waterloo Greenway Memberships linked to EDD Products
Go Round Rock
Waterloo Greenway Rentals Block
Wrapping Thing Up
As you can see, the possibilities of creating blocks with Advanced Custom Fields are endless. The integration that they have created has become a vital part of my workflow and has bridged the gap between the Gutenberg Block Editor and the PHP-based development I am familiar with.
Make sure to check out my other ACF Block Related posts like syncing your ACF color picker with your Gutenberg colors and setting your defaults ACF editor styles.