WordPress Development Without a Computer

You’re on the train, scrolling through your WordPress site on your phone, and you see an issue that you’d like to fix, for example improvement to the mobile view. Normally you’d make a (mental) note and deal with it when you’re back at your computer.

But what if you could just fix it right there?

With AI coding assistants that run in the browser—like Claude Code, OpenAI Codex, GitHub Copilot Workspace, or similar tools—combined with WordPress Playground for testing, you can now do WordPress plugin development without a computer.

Here’s how to set it up.

What You Need

  • Your plugin or theme in a GitHub repository,
  • A web AI coding assistant,
  • A way to tell the AI how to generate Playground test links that you can click.

The third part is where the Playground Step Library comes in.

Step 1: Create Your Blueprint

WordPress Playground uses blueprints: JSON configurations that describe what to install and how to set things up. You can install plugins, themes, configure settings, import content, and more. Writing these by hand is a little cumbersome, so I built the Step Library as a visual tool to assemble blueprints step by step.

The Step Library also provides more steps than Playground offers natively: that’s where the name comes from. It compiles these custom steps into the native steps that Playground understands. The native steps are powerful but require you to know how to combine them in clever ways; the Step Library’s custom steps it easier. Examples include addProduct for WooCommerce, addTemplatePart for block themes, a debug step to enable common debug settings and plugins, or disableWelcomeGuides.

Open the Step Library and add an “Install Plugin” step. Paste your GitHub repository URL. If you want to test a specific branch, add /tree/branch-name to the URL—but for now, just use your main branch. We’ll make the branch dynamic later.

Add any other steps your testing environment needs: maybe WooCommerce if your plugin integrates with it, or some test content, or specific WordPress settings.

Step 2: Generate AI Instructions

Once your blueprint is ready, open the “Copy/Share” dropdown and select “Generate AI Instructions”. This creates a markdown snippet you can add to your project’s CLAUDE.md, .github/copilot-instructions.md, or similar AI instruction file:

The generated instructions tell the AI to include a Playground testing link at the end of its responses. The branch name in your URL gets replaced with a BRANCH_NAME placeholder, so the AI knows to substitute the actual branch it’s working on.

Step 3: Add to Your Repository

Copy the generated markdown and add it to your AI instruction file. Commit it to your repository. Now any AI assistant that reads these instructions will include Playground links when it makes changes to your code.

Bonus: you can also instruct your coding assistant to add such a file to your repo!

The Workflow

Here’s what this looks like in practice:

  1. Open your AI coding assistant on your phone (or desktop),
  2. Connect to your GitHub repository,
  3. Describe what you want to change or fix,
  4. The AI makes the changes and pushes a branch,
  5. Tap the Playground link in the response,
  6. Test the changes in Playground—if it’s a private repo, you’ll authenticate with GitHub here,
  7. If it works, create a PR and merge it—you got to test before even opening the PR.

It’s a complete development loop. The AI handles the code, GitHub handles version control, and Playground handles testing. Your phone is just the interface tying it all together.

Private Repositories

Until recently, this workflow only worked with public GitHub repositories. I submitted a PR to WordPress Playground that adds GitHub OAuth authentication. Now when you load a plugin from a private repository, Playground prompts you to authenticate, and then it works just like public repos.

Beyond Mobile: Preconfigured Test Environments

The mobile workflow is a fun demo, but the same setup is useful on desktop too. The real power is in the preconfigured Playground environments through blueprints (which you can easily create with the Step Library).

Say your plugin integrates with WooCommerce. You can create a blueprint that installs WooCommerce, sets up a test product, and installs your plugin from the current branch. Now every Playground link the AI generates loads an environment where you can actually test the integration—not just whether your plugin activates without errors.

Or you want to test across different configurations: multisite vs single site, classic editor vs block editor, different PHP versions. Create a blueprint for each scenario, generate AI instructions for each, and you have a test matrix that’s one click away.

GitHub Actions

You can take this further with a GitHub Action that posts a Playground link “Try it in Playground” as a comment on every PR. That way anyone reviewing the PR can test the changes without setting up a local environment.

The Step Library is available as an npm package, so you can integrate it into your own tooling and CI pipelines.

Let AI Create Blueprints for You

Something often overlooked: the Step Library is also useful for getting AI to help you create blueprints in the first place. The native Playground steps are low-level—things like writeFile and runPHP—so AI assistants often don’t grasp what’s actually possible with blueprints. The Step Library’s high-level steps are more intuitive, and with a JSON schema that describes them, AI can easily understand what’s available and generate useful blueprints.

Other New Step Library Features

Some notable other things I added recently:

wp-env.json import: Drop your .wp-env.json into the Step Library and it converts your local dev environment config into a Playground blueprint.

GitLab, Bitbucket, and Codeberg support: Not everyone uses GitHub. The Step Library now recognizes repository URLs from these platforms.

Paste detection: Paste a plugin URL, some PHP code, or even an existing Playground URL, and the Step Library figures out what it is and creates the right steps.

Try It

The Playground Step Library is where you can create your blueprint and generate AI instructions.

I’ve found myself using this on the train, in waiting rooms, wherever I have a few minutes and an idea I want to try. It’s not how I imagined WordPress development would work, but it does.

Adapting Tools to Your Needs with AI

In past years, as a developer, for some features or the early stages of software, writing down the code felt like a chore. You knew what to do and you had to tediously spell it out. Of course, with AI tools like Claude Code (which I like in particular, the CLI approach appeals to me) this now is vastly better, and actually it’s quite easy to accidentally take it too far.

But here, I want to talk about something different: It happens that you search for a tool and then you come across something that almost does what you want, but not quite.

Before AI programming tools, you either had to be lucky to know the software stack, or it must be a really important problem to you that you would try to understand the codebase and make the modification you need.

Today, I can just use Claude Code to modify any tool how I like. So instead of turning away in frustration, I just ask Claude to help me fix what doesn’t work for me. How great is that?

A recent example for me has been transferring files to my Android Phone. OpenMTP exists but to me it has proven to be highly unrealiable, you need to remember to not have Preview open in macOS for it to work, and recently it didn’t complete a copy process but didn’t tell me about it. I only found out on the go that some files had not been copied.

So I realized, that I can use adb to push files to my phone using the debug mode. It’s very niche, I know, but it works. And then I realized a little UI would be nice, and I discovered darkhz’s adbtuifm. A tool written in Go but only tested on Linux, a file manager like Total Commander for the CLI that uses adb in the background.

And indeed, it didn’t really work well on macOS CLI. The left side appeared empty.

Hardly anything readable and the left side empty

But this is what it looks like today:

My updated version of adbtuifm

So I forked it and adapted it to my needs:

The most important change for me probably was the first one, and, ok, I could have probably just changed the hardcoded string myself.

But it was such a joy to continue and make the tool nicer to use! Also, I don’t think I could have fixed that hanging UI before wasting too much time.

You can try my version, and maybe fork it and add more things you like yourself? I could send back a PR but maybe I won’t do it this time because my changes are opinionated and the repo seems abandoned with the last change in 2022.