Lessons: 4Length: 53 minutes
- Overview
- Transcript
1.1 Welcome to the Course
In this course you’ll learn how to create three useful custom blocks for WordPress Gutenberg. We’re going to take a few relatively complex patterns in web design and transform them into Gutenberg custom blocks. We’ll start with a simple pricing table, followed by a component for tabbed content, and finally one for toggle content.
We’ll begin with a design file for each component, then we’ll write the HTML, CSS, and JavaScript code and turn them into Gutenberg blocks using a free, easy-to-use plugin.
This is an intermediate level course in terms of difficulty because it requires some knowledge of WordPress, PHP, and front-end coding. With that said, let’s kick things off with the first block: the pricing table. See you in the next lesson.
1.Introduction
1.1Welcome to the Course01:32
2.Let’s Create 3 Custom Blocks
2.1Gutenberg Pricing Table Block23:43
2.2Gutenberg Tabbed Content Block17:51
2.3Gutenberg Toggle Content Block09:47
1.1 Welcome to the Course
Hello and welcome to Test Plus course, I'm Adi Purdila. And in this course you'll learn how to create three very useful custom blocks for WordPress Gutenberg. Now WordPress already has a few blocks out of the box, but they're very simple ones. If you want more complex custom ones, you need to create them yourself. So here's what we'll do. We'll take three relatively complex patterns in web design and transform them into Gutenberg custom blocks. We'll start with a simple pricing table, followed by a component for tabbed content, and finally one for toggle content. We'll start from a design file for each block, and then we'll write the necessary HTML, CSS, and JavaScript. And finally we'll use a free plugin to transform all of these into Gutenberg blocks. Now this course is an intermediate level in terms of difficulty because you do need some knowledge of PHP, WordPress, and front end coding to properly understand everything that's going on. But I'll do my best to explain everything as we're going along. So let's kick things off with the very first block, which is the pricing table. We'll do that in the next lesson.
