Create Gutenberg Blocks Without Writing JavaScript

1.2 Why Create Blocks Without JavaScript?

Hello, and welcome back to this Tuts+ course on creating Gutenberg blocks in WordPress without writing JavaScript. In this part of the course, I'm gonna give you an overview of Gutenberg and what it is. So WordPress Gutenberg is a new editing interface that was introduced in 2019 as part of WordPress core. Now, this gives you a different interface than the classic editor that you might be used to. So if I show you a page here, you'll be familiar with this if you're using an up to date version of WordPress. So instead of just typing in one editing pane like we used to with the classic editor, you use blocks instead. One of the beauties of Gutenberg is that you can create all sorts of blocks for different things. So there are predefined blocks that come with WordPress itself, but then also, there are lots of plugins that add blocks that you can use in your content. However, for a lot of WordPress developers, Gutenberg does pose a problem, and that's because it's written in JavaScript and not PHP and in order to code your own Gutenberg blocks, you need to learn JavaScript. But what if you don't have JavaScript skills, and you still want to create a block? Well, there is a way around that, and that's using the advanced custom fields plugin, which I'll show you shortly. But before I do that, I'll just show you some resources you can use, if you do decide you want to learn JavaScript. So in the WordPress codex, there is instructions on how to create a block type. And also on Tuts+, we have a variety of courses, and resources, and tutorials, that will show you how Gutenberg works. But if you don't have time to learn JavaScript before you create that plugin that you need a block for, or if you're simply not comfortable writing JavaScript and would rather use PHP, which may not be a long term, but it's certainly viable in the short term. You can use the advanced custom fields plugin to add Gutenberg blocks to your site. Now, ACF is a really popular plugin that gives you access to exactly what you'd expect, advanced custom fields. So the custom fields or metadata that come with WordPress are fairly limited in the scope of what you can do with them. If you wanted to format them, or change the way they were laid out, or the types of media or data they include, you'd have to do quite a lot of work yourself customizing those. ACF gives you that out of the box, now, there is a free version of ACF that includes lots of features, you need to use a standard type of advanced custom field on your site. But if you want to create Gutenberg blocks, you'll need the PRO version. So in this course, I'm gonna show you how to download and install that PRO version, and how to use the functions it provides to create your own Gutenberg blocks. So you'll need to decide whether you'd rather pay for a plugin that gives you that functionality to do it in PHP right now, or whether you want to invest the time learning JavaScript, so you can create Gutenberg blocks the way that WordPress wants you to. In the next part of the course, I'm gonna download and install the plugin and start setting up my own plugin that will register a block for call to action blocks. See you next time and thanks for watching.