How to Create a Blocks Theme from Scratch (Using Pootlepress and Full Site Edition FSE)

In spanish

Jamie Marsland has made available to us, at Pootlepress, a free tool to create a block theme from scratch.

For this, InstaWP as a development environment.

The tool is called WordPress Theme Builder and I explain it to you in the video (in spanish).

Pootlepress pairs nicely with Munir Kamal, which we described in our article Gutenberg Hub relaunches online page builder app.

InstaWP provides a development environment

If you have a server, you can create a development environment yourself, by installing WordPress on a subdomain or an additional domain. Or you can also use the Local app (in spanish) on your mobile device or laptop.

However, InstaWP provides that to you on the fly without you having to spend any effort or resources.

In Pootlepress InstaWP has been encapsulated, and with one click you can start the process of creating and configuring the development environment transparently.

To re-enter, you receive your username and password by email, plus the corresponding URL associated with your development site which, in the free version, expires after 48 hours.

InstaWP is a very interesting solution for the purpose of creating preconfigured WordPress environments. Jamie Marsland, on his YouTube channel, creates ready-made InstaWP scenarios to test what he explains in his videos. By clicking the link in the descriptions, the user creates an instance of that scenario and can test it. The Pootlepress theme generator is based on the same idea.

About the starter theme

The development environment set up in InstaWP is based on the Bricksy.

Bricksy is a block theme that is considered a starter because it has a blank template and others that can be easily modified. It is not mandatory to use Bricksy if you choose your own server. You can use Twenty Twenty Two or any other such as Blockbase (in spanish), etc.

The good thing about the solution proposed in Pootlepress is that Bricksy has been pre-configured to make it even easier to start designing your own theme. For example, the front-page template is not the original one and there is a home page created and associated with that template. If you install Bricksy in an initial WordPress you will have to make all that.

Summary of the process to create a block theme from scratch

  1. Go to the special Pootlepress page and click on the big blue button that says “Click here to build your theme”. When you click the button, you’ll be taken to a fresh WordPress installation of InstaWP, with everything ready to customize the layout.
  2. Design the new site using the full site edition. Change page templates, fonts, layouts, colors, menu layout, anything you want using Gutenberg.
  3. Export your new theme. Once you’re happy with your new design, click the options icon (top right on the full site edit screen) and then select export.
  4. Rename the theme and upload a new thumbnail. Unzip the downloaded zip file when exporting, open the style.css file and rename the theme. Finally, replace the screenshot.png file with another with the new theme thumbnail. Compress the folder again and rename it.