Building Gutenberg Blocks in WordPress. No JS required!

Focused View

John Hawkins

2:33:40

122 View

1 - Introduction

1 - Introduction.mp4

02:02

2 - Building Blocks

2 - Requirements Local Setup.mp4

06:32

3 - Creating Your First Block.mp4

13:51

3 - example-blocks-01.zip

4 - Adding Basic Styles.mp4

17:42

4 - example-blocks-02.zip

5 - Adding Default Style Options.mp4

11:08

5 - example-blocks-03.zip

6 - Using A Themes Default Colors.mp4

15:21

6 - example-blocks-04.zip

7 - Creating An ACF Field Group.mp4

12:06

8 - Cloned Field Groups.mp4

05:02

9 - Render ACF Fields In Your Block.mp4

10:17

10 - Adding Images To Blocks.mp4

19:27

10 - example-blocks-06.zip

10 - example-blocks-07.zip

11 - Using Repeater Fields In Your Blocks.mp4

12:52

11 - example-blocks-08.zip

12 - Customizing The Block Icon.mp4

05:33

12 - example-blocks-09.zip

12 - json encoder.zip

12 - the noun project.zip

12 - wordpress dashicons list.zip

13 - Block Categories.mp4

07:47

13 - example-blocks-10.zip

14 - Inner Blocks.mp4

13:13

3 - Wrapping Up

15 - In closing.mp4

00:47

Description

Using Advanced Custom Fields, you can can build custom blocks no matter your skill level

What You'll Learn?

Build custom Gutenberg blocks
Build blocks into a plugin for use on multiple sites
Add custom fields to blocks using Advanced Custom Fields Pro
Use several of the Advanced Custom Fields field types to build dynamic blocks

Who is this for?

Beginner to intermediate WordPress developers who want to build blocks easily.

More details

Description
The Gutenberg editor in WordPress is an absolute game changer. For users, it provides them an easy way to build out the content on their site in new and exciting ways. And, for developers, it's a powerful tool that can be used to provide clients custom blocks to match their every need.

IÂ don't know about you, but JavaScript is still outside of my comfort zone. So, when WordPress made the switch to the block editor (formerly called Gutenberg), I was really concerned about how it would limit my ability to build the things I need to build for myself and for my clients. But, once I found a way to build custom blocks without the need for JavaScript, I was very excited!
In this course, I'll walk you through the process of building custom blocks in WordPress without writing a single line of JavaScript.
The course will cover:
- What you need for local development
- Creating your first block
- Styling your blocks
- Adding custom fields to your blocks
- Rendering your blocks
- Building blocks with images
- Adding repeater fields to your blocks
- Customizations to make your blocks stand out
- How to add inner blocks to your blocks.
If you've struggled in the past to build Gutenberg blocks in WordPress, jump into this course and you'll be building blocks in no time!
Who this course is for:
Beginner to intermediate WordPress developers who want to build blocks easily.

User Reviews

Rating

average 0

Total votes0

Focused display

WordPress

John Hawkins

Instructor's Courses

I've been building things on the internet for over 25 years. For the past 17 years, I've been focused completely on WordPress. From small personal websites to incredibly intricate custom builds, I've done a bit of everything.When I'm not behind the keyboard developing, I can often be found at WordPress meetups where I teach others how to use WordPress to build their business.

Udemy

View courses Udemy

Students take courses primarily to improve job-related skills.Some courses generate credit toward technical certification. Udemy has made a special effort to attract corporate trainers seeking to create coursework for employees of their company.