Documentation

We’ve built the plumbing so you can quickly build WordPress plugins.

Setup

npx create-block-plugin

When you run the command above you’ll be asked a series of questions that we will use to autofill plugin details such as the plugin name, plugin author, & plugin description.

Additionally, you’ll be asked a few other very important questions that will turbocharge your block development workflow.

Starter Templates?

The plugin template(s) you'd like to use:

The very first question you’ll be asked is what plugin template(s) you’d like to use.

Currently, we’re offering 1 starter template:

Each template can be used individually, or can be bundled to create the ultimate block editor plugin.

CSS Framework?

Would you like to use a css framework?

We love using CSS frameworks for building blocks. If you know a framework well, or if you’re willing to invest the time to master it, it can supercharge your block development workflow.

You can choose from Tailwindcss, Bootstrap, or None – to roll your own styles. Regardless of which framework you choose, everything will be setup and ready to use once your plugin code is generated.

We’ve also baked in all the tooling you need for writing SASS if you need to write any custom CSS. Don’t worry, we’re also huge fans of good old CSS, so you can write that too.

Development Server?

We’ve baked in the official WordPress env package that makes it a breeze to fire up a local Docker development server with WordPress, the TwentyTwenty theme, and your brand new generated plugin all installed.

Would you like a development server?

If you decide not to fire up a server at plugin creation, no worries, we’ve included all the scripts and tooling you need to fire it up later. Learn more about all the available commands here.

Github Repository?

Would you like to create a repository on github?

If you’re building a plugin for just about any reason at all, we’d recommend setting up a github repository. That way if you accidentally delete it on your computer, or just want to pull it down on another computer, it’s safe and sound on Github.

When you’re creating your plugin we’ll ask you to generate a Github token and enter it in the command line. Once entered, you’ll never have to enter it again and you can spit out a remote repository on Github any time you want to generate a new plugin!

Furthermore, once you’re ready to start publishing your plugin in the WordPress directory, we’ve baked in some very convenient and timesaving github actions that allow you to EASILY publish and release updates of your plugin to the WordPress plugin directory.

Start Building

Once your plugin code is generated you’ll simply:

cd my-pluginnpm start

A new tab will open at localhost:3000 and you’ll see WordPress with the TwentyTwenty theme & your plugin installed.

Auto-reloading the browser

We’re all about building as fast as humanly possible. So we should note that we’ve also baked in Browsersync for auto-reloading the browser when you edit any php files. We’ve also included a bs-config.js file so you can customize this file if you’d like, but you won’t need to touch it otherwise.

Hot Module Replacement

Finally, now that you can instantly fire up a bunch of block editor plugins, build with the most popular CSS frameworks in the world, launch a development server on the fly, and reload the browser on every save, we’ve also baked in our very own @blockhandbook/block-hot-loader package.

With Hot Module Replacement for building WordPress blocks, any edits you make to plugin Javascript files will instantly show up in the browser, without a page refresh. Even an automatic page refresh can take a few seconds. Without page reloads, you can only imagine how much faster you can bring your plugin to life.

wpplugin

The Fastest way to
Learn, Build, & Publish WordPress plugins.