Create a custom WordPress block without setting up Node, npm or a build process. Enter your block details and attributes, and the tool generates the plugin file, block.json, editor script and, for dynamic blocks, a PHP render file. Save the files in a plugin folder, activate it, and your block appears in the editor.

Gutenberg Block Generator

Generate a working WordPress block plugin (block.json, PHP, JavaScript and optional render file) with no build step.

Input Section

Namespace

Block slug

Block title

Description

Result Section

File

Insights / Tips

Pick a file from the list, copy it, and save every file in one plugin folder, then activate the plugin.
Use dynamic rendering for content that changes often, such as latest posts or live data.
This starter runs without Node or a build step. For larger blocks, move to @wordpress/scripts and JSX.

Internal Links

Shortcode Builder Plugin Header Generator Widgets Generator

What you get

block.json: the block’s name, title, category, icon, keywords, attributes and supports.
Main plugin file: a plugin header and the code that registers your block.
index.js: the editor script with a settings panel for each attribute and a live preview.
index.asset.php: tells WordPress which editor scripts the block needs, so no build step is required.
render.php (dynamic blocks only): the PHP template that outputs the block on the front end.

How to use the block generator

Enter a namespace (usually your brand), a block slug and a block title.
Choose a category and dashicon, and add up to three keywords.
Pick Static if the content is saved in the post, or Dynamic if PHP should build the output each time the page loads.
Add attributes, one per line, in the form name:type:default. For example:
- heading:string:Hello world
- count:number:3
- showIcon:boolean:true
Turn on any supports you want: alignment, color, spacing or typography.
Click Generate Block, then choose each file from the list and copy or download it.
Create a folder in wp-content/plugins/ named after your block slug, save all the files in it, and activate the plugin.

Static or dynamic blocks

Static blocks save their HTML in the post content. They are fast, but changing the block’s markup later can make old posts show a validation error.
Dynamic blocks render with PHP on every page load. They suit content that changes, such as recent posts, prices or data from an API, and you can change the output without editing old posts.

What to do next

The generated block is a working starter. Open the files to change the markup, add your own CSS, and extend the editor controls. For larger projects, you can move to the official @wordpress/scripts tools and write the block in JSX.

Frequently asked questions

What is a Gutenberg block?

A block is a unit of content in the WordPress block editor, such as a paragraph, image or button. Custom blocks let you add your own components.

Do I need to know React or JavaScript?

Not to start. The generated code works as it is. To customize the editor experience you will need basic JavaScript.

Do I need Node.js or a build process?

No. The generated editor script uses the WordPress script globals directly, so it runs without compiling.

What attribute types can I use?

String, number and boolean. Each one gets a matching control in the block settings panel.

Which WordPress version do I need?

The generated block uses block API version 3, so use WordPress 6.3 or newer.

Why does my block not show up?

Check that all files are in the same plugin folder, the plugin is activated, and the block name in block.json matches the one in index.js. If you changed a file name, update the paths in block.json.