Browse: Home / Block Editor Handbook / Getting Started / Create a Block Tutorial

Create a Block Tutorial Edit

Let’s get you started creating your first block for the WordPress Block Editor. We will create a simple block that allows the user to type a message and style it.

The tutorial includes setting up your development environment, tools, and getting comfortable with the new development model. If you are already comfortable, try the quick start below, otherwise step through whatever part of the tutorial you need.

Prerequisites

The first thing you need is a development environment and tools. This includes setting up your WordPress environment, Node, NPM, and your code editor. If you need help, see the setting up your development environment documentation.

Top ↑

Table of Contents

The create a block tutorials breaks down to the following sections.

  1. WordPress Plugin
  2. Anatomy of a Gutenberg Block
  3. Block Attributes
  4. Code Implementation
  5. Authoring Experience
  6. Finishing Touches
  7. Share your Block with the World