Joomla Playground: shared PHP tools beyond WordPress

Can the technology behind WordPress Playground help other PHPPHP PHP (recursive acronym for PHP: Hypertext Preprocessor) is a widely-used open source general-purpose scripting language that is especially suited for web development and can be embedded into HTML. https://www.php.net/manual/en/index.php projects run in the browser?

Joomla contributor Herman Peeren is exploring that with Joomla Playground, an early community project that runs Joomla in a browser tab. You can explore its administrator and frontend without installing a local PHP server or setting up a database.

For me, the interesting part is what this brings back to the shared tools. Joomla introduces different queries, workloads, and assumptions, revealing compatibility and performance lessons that contributors can investigate together.

What Joomla Playground shares with WordPress

The project builds on two components from the WordPress ecosystem.

The first is PHP.wasm. Joomla Playground uses the @php-wasm packages developed in the WordPress Playground repository to run PHP as WebAssembly in the browser. Joomla’s files and database also operate locally. The second is wordpress/mysql-on-sqlite. A Joomla-specific adapter connects its MySQLMySQL MySQL is a relational database management system. A database is a structured collection of data where content, configuration and other options are stored. https://www.mysql.com driver to this library, allowing MySQL queries to execute against SQLite. You can inspect that connection in the database adapter.

The browser architecture follows a familiar pattern: a worker runs PHP, a service worker routes requests, and an iframeiframe iFrame is an acronym for an inline frame. An iFrame is used inside a webpage to load another HTML document and render it. This HTML document may also contain JavaScript and/or CSS which is loaded at the time when iframe tag is parsed by the user’s browser. displays the CMS. Joomla adds its own startup logic, configuration, and Blueprint steps around that foundation.

Exploring Joomla without a local setup

Open Joomla Playground in a recent Chromium browser, such as Chrome or Edge. It starts a temporary site and automatically signs you in to the administrator. The toolbar lets you switch between the administrator and the public site. The project’s guide documents Joomla 6.2 and 5.4, with PHP 8.3, 8.4, and 8.5. It also describes controls for saving a site in your browser, importing and exporting ZIP files, and inspecting captured email without delivering it. Project guide

I suggest exploring the multilingual Heritage demo. A Joomla-specific JSONJSON JSON, or JavaScript Object Notation, is a minimal, readable format for structuring data. It is used primarily to transmit data between a server and web application, as an alternative to XML. blueprint prepares content in English, Dutch, German, French, and Spanish, using demonstration data from Clifford E Ford. If you are preparing a workshop or demonstration, pay attention to persistence. Temporary sites disappear when you reload the page or close the tab. Saving keeps the site in that browser; exporting gives you a copy you can move elsewhere.

Lessons from running another CMS

Herman’s report provides concrete findings for contributors to explore. His tests included PHP.wasm 3.1.60 and MySQL-on-SQLite 3.1.1, so these observations are starting points for reproduction against current upstream code.

SQL compatibility

Joomla exercised SQL behavior that needed additional handling, including prepared statements, missing functions, server variables, and binary comparisons. One case affected login: session identifiers stored as binary values did not match the string comparisons Joomla used to retrieve them. Herman added local workarounds in the database adapter.

These cases could become regression tests for the shared database library. That is a practical benefit of testing another application: it exposes behavior that WordPress alone may not exercise.

Faster browser saves

Saving thousands of individual files to browser storage proved expensive. Herman switched to a shared base ZIP plus a snapshot of changed files, using Playground’s filesystem journal to track modifications. In his local measurements, saving dropped from 13 seconds to approximately 0.3 seconds. The implementation also replaces snapshots atomically and uses a per-site lock to prevent competing writers. Storage implementation

My reading is that this approach deserves testing with WordPress workloads. Those figures describe Herman’s Joomla tests; they do not establish the same improvement for WordPress Playground.

Making the site usable sooner

Two other findings involved requests sharing a single PHP worker. An unavailable network connection could leave a request waiting for minutes, blocking those behind it. Background search indexing also repeatedly entered the queue ahead of page navigation.

Herman enabled PHP networking through browser fetch and split indexing into smaller batches that yield between requests. Deferring indexing roughly halved the Heritage demo’s reported time to become usable, while the toolbar showed the remaining work. Report, sections 13, 18, and 24

For someone opening a demo, the practical question is simple: when can I start using the site? These findings give contributors specific cases to investigate around network failures and background Blueprint work.

Learning across the PHP ecosystem

Joomla Playground shows how this collaboration can work in both directions. Shared infrastructure makes another CMS easier to explore, and that CMS brings integration experience that can help improve the infrastructure. For educators and community organizers, there is also an immediate benefit: people can explore the software before spending time configuring an environment.

Try Joomla Playground, explore Herman’s source code, and share reproducible findings in the issue tracker. Thank you to Herman, Milana, and the contributors across these projects for making this exchange possible.

Which PHP application would you like to explore in the browser, and what would you test first? Please go to the Playground Channel and share with the team.

X-post: WordPress Contributor Toolkit 2.0: A redesigned app, in your language

X-post from +make.wordpress.org/core: WordPress Contributor Toolkit 2.0: A redesigned app, in your language

Test WordPress emails in Playground with the new Email tool

Did your contact form generate the notification you expected? Was the right welcome message generated for a new user? WordPress Playground now gives you a way to inspect those emails while you test a site in your browser. Open Dev Tools → Email to see messages generated by the current Playground, without setting up a mail server or checking a real inbox.

The Email tool starts empty and shows messages generated by the current Playground.

How email capture works

When WordPress sends a message through its normal wp_mail() path, PHPPHP PHP (recursive acronym for PHP: Hypertext Preprocessor) is a widely-used open source general-purpose scripting language that is especially suited for web development and can be embedded into HTML. https://www.php.net/manual/en/index.php writes it to a sendmail-compatible program. Playground captures that message in the browser instead of delivering it. The website parses the captured message and adds it to the Email panel for the current site. You can select a message to check its subject, sender, recipient, time, and body, including an HTMLHTML HTML is an acronym for Hyper Text Markup Language. It is a markup language that is used in the development of web pages and websites. preview when the message contains HTML.

The work arrived in stages: sendmail capture in PR #3996, forwarding captured messages to the website in PR #4103, and the Email viewer in PR #4000.

Try it in a fresh Playground

You can generate a sample message without installing a pluginPlugin A plugin is a piece of software containing a group of functions that can be added to a WordPress website. They can extend functionality or add new features to your WordPress websites. WordPress plugins are written in the PHP programming language and integrate seamlessly with WordPress. These can be free in the WordPress.org Plugin Directory https://wordpress.org/plugins/ or can be cost-based plugin from a third-party.:

  1. Open playground.wordpress.net and wait for WordPress to load.
  2. Select Dev Tools in the Dock, then Email. A fresh site shows No emails yet.
  3. Open Dev Tools → Terminal, select PHP, paste the snippet below, and select Run. The Terminal loads WordPress for you.
$sent = wp_mail( 'reader@example.invalid', 'Playground email test', 'Hello from WordPress Playground.' );echo $sent ? 'wp_mail() returned true' : 'wp_mail() returned false';
  1. Return to Dev Tools → Email and select Playground email test. Check the recipient, subject, and message body. The message appears in Playground; nothing is delivered to reader@example.invalid.

You can also test a WordPress action instead of running PHP. For example, create a user under Users with Send the new user an email about their account selected, then inspect the generated messages. Once a plugin is installed, perform the action that normally sends its message and check the same panel. The Terminal guide has more on running PHP against the active site.

Which plugins benefit?

The Email tool is useful wherever a plugin sends messages through WordPress’s usual mail path:

  • Forms: Submit a contact or lead form and check the notification’s recipient, subject, and submitted fields.
  • Registration and membership: Check welcome, approval, invitation, and account messages after a user action.
  • Commerce, bookings, and events: Inspect order, reservation, and confirmation emails while testing a workflow.
  • Email templates and notifications: Compare generated text or HTML across settings, themes, and WordPress versions.

Plugin developers can offer a Playground demo that lets testers complete an action and inspect its email in the same browser session. Contributors and documentation authors can also use it to reproduce WordPress notification behavior without supplying a working mailbox.

What the Email tool does not test

A captured email is not a delivered email. Even when wp_mail() returns true, that only shows the message was accepted for processing; it does not prove that an external recipient received it. The Email panel helps you inspect messages sent through Playground’s sendmail capture path. A plugin that sends through a separate SMTP connection or provider APIAPI An API or Application Programming Interface is a software intermediary that allows programs to interact with each other and share data in limited, clearly defined ways. may bypass that path, so use an appropriate delivery test for those integrations.

Messages in the Email panel belong to the current Playground runtime session. Reloading the Playground website tab or reopening a saved site clears the captured messages, even though the WordPress site itself can persist. Wait for Playground to finish loading before triggering a test action; messages sent during initial Blueprint setup may not appear.

Try the feature on WordPress Playground. If a message does not appear, report the steps in the Playground repository, including the plugin or WordPress action you tested and whether it uses wp_mail() or another mail service.

X-post: WordPress Contributor Toolkit 1.2: One app for your first Core or Gutenberg contribution

X-post from +make.wordpress.org/core: WordPress Contributor Toolkit 1.2: One app for your first Core or Gutenberg contribution

Explore the WordPress Playground Terminal with the new Dev Tools Dock

WordPress Playground has shipped two new features: an integrated Terminal for PHPPHP PHP (recursive acronym for PHP: Hypertext Preprocessor) is a widely-used open source general-purpose scripting language that is especially suited for web development and can be embedded into HTML. https://www.php.net/manual/en/index.php and WP-CLIWP-CLI WP-CLI is the Command Line Interface for WordPress, used to do administrative and development tasks in a programmatic way. The project page is http://wp-cli.org/ https://make.wordpress.org/cli/, and a group for developer tools options on the Dock. The compact Dock keeps the everyday actions in view while giving developers a direct path to the tools for inspecting and changing a site.

From the Terminal, you can inspect content, check configuration, test a WordPress APIAPI An API or Application Programming Interface is a software intermediary that allows programs to interact with each other and share data in limited, clearly defined ways., or make a quick change without setting up a local environment or leaving playground.wordpress.net. It runs against the active Playground, so a command reads or changes the same WordPress site visible behind the panel.

The New group for Developer Tools in the Dock

Visit playground.wordpress.net and wait for WordPress to start. The Dock at the bottom of the screen shows New, Playgrounds, Site Settings, Export, and Dev Tools. In its compact state, it hides the developer-facing buttons to give people exploring WordPress a simpler toolbar.

Select Dev Tools next to Export to expand the Dock. It reveals Blueprint, Database, Terminal, Files, Logs, and Email. Then select Terminal to open the runner for the current site.

The expanded Dock puts Terminal alongside the other developer tools.

Playground remembers whether the developer tools were shown or hidden across page reloads. Collapsing them keeps an unfinished Terminal or Blueprint draft, so you can reopen the tool and continue.

The other new feature is Terminal, which opens with two modes:

  • PHP runs short PHP snippets with WordPress already loaded.
  • WP-CLI runs WordPress command-line commands against the active site.

Each mode keeps its own input, results, and command history, so you can move between PHP and WP-CLI without losing your place.

Explore WordPress with PHP

PHP mode provides a syntax-highlighted editor with line numbers and a few ready-to-run examples. You can select examples such as Versions, Site URLURL A specific web address of a website or web page on the Internet, such as a website’s URL www.wordpress.org, List posts, Create post, or Active plugins, edit the code, and select Run.

PHP mode runs a snippet against the active WordPress site and displays the result in the same panel.

WordPress is loaded for you, and the opening <?php tag is optional. For example, this snippet lists the titles of the site’s posts:

foreach ( get_posts() as $post ) {
	echo $post->post_title . "\n";
}

You can also inspect versions and configuration:

echo 'WordPress ' . get_bloginfo( 'version' ) . "\n";
echo 'PHP ' . phpversion() . "\n";
echo 'Site URL: ' . get_site_url();

Each submission is evaluated independently. Variables from one run are not available in the next run, but changes made through WordPress APIs remain in the active Playground. For example, update_option() changes the site’s database just as it would when called by a pluginPlugin A plugin is a piece of software containing a group of functions that can be added to a WordPress website. They can extend functionality or add new features to your WordPress websites. WordPress plugins are written in the PHP programming language and integrate seamlessly with WordPress. These can be free in the WordPress.org Plugin Directory https://wordpress.org/plugins/ or can be cost-based plugin from a third-party..

Use Ctrl+Enter or Command+Enter to run code from the keyboard. If the snippet is incomplete, it remains in the editor so you can finish it. Parse and runtime errors appear with concise messages, including a useful source position when available.

Manage the site with WP-CLI

Switch to WP-CLI when it’s the quickest way to inspect or change WordPress. Try a read-only command first:

wp option get blogname
WP-CLI mode accepts commands with or without the leading wp and shows their output below the prompt.

The leading wp is optional, so option get blogname works too. On the first WP-CLI run, Playground downloads the WP-CLI executable if it is not already available. Later commands reuse it.

Here are a few useful commands to try. Run each line separately:

wp core version
wp plugin list
wp post list --fields=ID,post_title,post_status
wp option get siteurl

You can also create content directly:

wp post create --post_title='Created from the Playground Terminal' --post_status=publish

The result reports Success: Created post followed by its ID. Run wp post list --fields=ID,post_title,post_status again to confirm the title and publish status. To view it in WordPress, close the Terminal and enter /wp-admin/edit.php in the Dock’s address field, then open the post from the Posts screen. Refreshing the welcome page alone will not display the new post. Each time you rerun the create command, it creates another post.

Set up real test scenarios

WP-CLI is especially useful for preparing a test site before you check the result in WordPress. You are building a plugin or want to check how a theme will behave in a specific screen. These examples run in a fresh Playground and use a terminal command to prep the test.

Test a WooCommerce cart and coupon

Start Playground with WooCommerce active. The plugin adds its own wp wc commands, and --user=admin gives them the permissions needed to manage store data. Create a published test product and a 10% coupon running those two commands separately:

wp wc product create --name="Playground Test Mug" --type=simple --status=publish --regular_price=19.99 --sku=playground-test-mug-01 --user=admin
wp wc shop_coupon create --code=PLAYGROUND10 --discount_type=percent --amount=10 --user=admin

Open the shop on the WordPress site, add Playground Test Mug to the cart, then apply PLAYGROUND10 under Add coupons. In a fresh Playground test, the product appeared at $19.99, and the coupon reduced the cart total to $17.99.

The commands create the fixtures; adding to cart and applying the coupon still happen in the browser. See the WooCommerce command reference for other store operations.

Prepare posts for CoreCore Core is the set of software required to run WordPress. The Core Development Team builds WordPress. or Themes testing

When a feature needs more than one sample post, generate twelve published posts in one command:

wp post generate --count=12 --post_type=post --post_status=publish

The generated posts appear in Posts. In the Playground test, they also fill the blog’s first page and expose a second page of posts, giving testers content for pagination, sorting, search, or bulk-action checks. See the WP-CLI post generation reference.

For a focused blockBlock Block is the abstract term used to describe units of markup that, composed together, form the content or layout of a webpage using the WordPress editor. The idea combines concepts of what in the past may have achieved with shortcodes, custom HTML, and embed discovery into a single consistent API and user experience.-editor smoke test, create a post with saved Paragraph block markup:

wp post create --post_title='Block smoke test' --post_status=publish --post_content='Block smoke test'

Use the post ID reported by the command to open /wp-admin/post.php?post=ID&action=edit, replacing ID with that number. The test post opened as a Paragraph block in the editor. For a plugin block, replace this example with that block’s actual saved markup: markup that does not match the block’s definition can trigger a validation warning. The block markup guide explains the format.

A command runner, not a full shell

The integrated Terminal focuses on PHP and WP-CLI. It is not a general-purpose shell, and it does not provide an interactive TTY.

Pass every required value as part of a WP-CLI command. Commands that wait for interactive input are rejected instead of interpreting unavailable input as an empty value. Long-running interactive commands such as wp shell and wp server are not supported.

This constraint makes browser-based execution more predictable. It also protects a command from unexpectedly changing WordPress after a failed attempt to read from standard input. The same fail-fast behavior now applies to the Blueprint wp-cli step, so Blueprint commands must also provide their required arguments explicitly.

A faster path from question to answer

The Terminal fills the space between clicking through wp-admin and building a local development environment. Plugin developers can check an option or active plugin list while reproducing a bug. Documentation authors and learners can run WordPress PHP examples in context. Contributors can inspect a test site before exporting it or sharing a reproducible Blueprint.

The Terminal arrived in pull request #3808, Add Terminal to the Dock, building on an earlier request to integrate WP-CLI into the Playground website. The Dev Tools Dock update made that growing set of tools easier to show or hide.

Thanks to Alex Kirk for developing the Terminal and to the contributors who built and refined the Dock controls.

Try it and share feedback

Open WordPress Playground, check the new features, and tell us what you think. If you find a bug or have an idea for the workflow, open an issue in the WordPress Playground repository or join the #playground channel in Making WordPress Slack.

WordPress Playground and WebMCP: bringing AI agents into your browser workflow

WordPress Playground gives AI agents a practical place to build, test, and explore WordPress: a running site in the browser that you can inspect as the work happens. With WebMCP, compatible agents can discover tools offered by Playground and use them alongside the interface you already know.

OpenAI now added support for these “Site tools” in the ChatGPT desktop app’s built-in browser. This creates another way to work with Playground through natural-language requests, from building a landing page to preparing a reproducible pluginPlugin A plugin is a piece of software containing a group of functions that can be added to a WordPress website. They can extend functionality or add new features to your WordPress websites. WordPress plugins are written in the PHP programming language and integrate seamlessly with WordPress. These can be free in the WordPress.org Plugin Directory https://wordpress.org/plugins/ or can be cost-based plugin from a third-party. demo. Availability depends on the model, workspace, and rollout. OpenAI’s Site tools guide

What is WebMCP?

WebMCP is a proposed browser APIAPI An API or Application Programming Interface is a software intermediary that allows programs to interact with each other and share data in limited, clearly defined ways. that lets web applications expose actions as tools with descriptions and structured inputs. It is currently a W3CW3C The World Wide Web Consortium (W3C) is an international community where Member organizations, a full-time staff, and the public work together to develop Web standards.https://www.w3.org/. Community Group draft, not an official W3C standard. WebMCP specification

The agent discovers tools on the page and calls them within the live browser session. You can continue using the interface, inspect the result, and guide the next step. Explicit tools can reduce the need for the agent to infer an action from buttons, screenshots, or changing page layouts.

MCP and WebMCP provide different connection paths. MCP connects an AI application to a local or remote server. WebMCP exposes actions through an open webpage. Playground supports both: its MCP integration uses a local Node.js server and a WebSocket bridge, while its WebMCP integration works through the browser without that intermediary. Playground MCP integration, WebMCP integration

Within Playground, these integrations reuse shared tool definitions and the site management interface. The Site Manager API handles operations such as listing and saving sites, and provides access to the active Playground client for PHPPHP PHP (recursive acronym for PHP: Hypertext Preprocessor) is a widely-used open source general-purpose scripting language that is especially suited for web development and can be embedded into HTML. https://www.php.net/manual/en/index.php execution, requests, and filesystem operations. This is shared Playground infrastructure; MCP and WebMCP do not have an identical protocol API.

Getting started

Open WordPress Playground in a browser environment that supports WebMCP and wait for WordPress to load.

In the ChatGPT desktop app’s built-in browser, select Site tools in the address bar, then Available site tools. OpenAI currently recommends GPT-5.6 Sol or GPT-5.6 Terra; its documentation says Site tools are unavailable with GPT-5.6 Luna and in Enterprise or Edu workspaces. Check the current setup guidance as availability changes.

Playground’s built-in WebMCP tools currently include:

PurposeTools
Site managementplayground_get_website_url, playground_list_sites, playground_rename_site, playground_save_in_browser
PHP and requestsplayground_execute_php, playground_request
Navigation and informationplayground_navigate, playground_get_current_url, playground_get_site_info
Filesystemplayground_read_file, playground_write_file, playground_list_files, playground_mkdir, playground_delete_file, playground_delete_directory, playground_file_exists

This list reflects the WebMCP registration code and shared tool definitions checked on September 5, 2026. Plugins can add their own tools through the proxy described below.

From the browser to a virtual WordPress

Playground runs WordPress locally in your browser using PHP compiled to WebAssembly. Its WordPress interface appears inside a nested iframeiframe iFrame is an acronym for an inline frame. An iFrame is used inside a webpage to load another HTML document and render it. This HTML document may also contain JavaScript and/or CSS which is loaded at the time when iframe tag is parsed by the user’s browser.. Here, “local” means the browser’s WordPress runtime, rather than a separately installed PHP server on your computer. Playground project documentation

That nesting creates a discovery problem. A plugin might register a useful WebMCP tool inside WordPress, but an agent looking at the outer Playground page cannot necessarily see it. OpenAI’s built-in browser currently discovers tools on the top-level page, not inside iframes. Site tools limitations

The WebMCP proxy, merged on September 3, bridges this gap. It advertises the embedded site’s registered tools on the outer Playground page and forwards calls back into WordPress.

The proxy makes a plugin’s registered tools discoverable outside the WordPress iframe, while their execution remains inside the site. No separate WebMCP server is needed for this path.

Imagine a plugin that offers an action to create a draft event. When that plugin registers a WebMCP tool, Playground carries its description and input schema up to the outer page. The agent can discover the action and send its inputs down through the proxy. The plugin executes the action inside WordPress, and the result returns along the same path.

The proxy also follows changes to the active page and site, removing tools that are no longer registered. Proxy implementation

WordPress abilities and WebMCP tools are related but distinct. A plugin can wrap a WordPress ability in a WebMCP tool; registering an ability alone does not automatically make it appear through this proxy. Agents can also use Playground’s existing playground_request tool to discover and invoke abilities exposed through the WordPress Abilities REST APIREST API The REST API is an acronym for the RESTful Application Program Interface (API) that uses HTTP requests to GET, PUT, POST and DELETE data. It is how the front end of an application (think “phone app” or “website”) can communicate with the data store (think “database” or “file system”) https://developer.wordpress.org/rest-api/. Current request-tool guidance

Three workflows to try

The space for creativity is open; the Playground team has tested Playground with WordPress, and the results are interesting. I will l st three examples that you can try right now.

Build a landing page

One experiment I repeated was asking an agent to build a landing page directly in Playground. An event, a football supporters’ site, or a tourism page gives the agent a concrete design task and a live WordPress environment in which to work.

Try this prompt:

Create a polished, responsive tourism landing page that welcomes visitors to Lagos, Portugal, and positions the city as one of the Algarve’s must-visit destinations.

Use the site-building tools available in the browser to build the page directly in WordPress Playground. Create a complete, visually engaging page—not just a written proposal.

This is the result:

Run it on Playground

Creating a testing dashboard

Another experiment was a dashboard for tracking compatibility across WordPress versions. Each version links to a reproducible Playground environment, making it easier to share testing work with a team.

Build a polished, responsive WordPress AI Plugin Compatibility dashboard using Site Tools and WordPress Playground.

The dashboard must manage compatibility results dynamically instead of hardcoding version statuses. Create a simple editable data source for WordPress versions, where each record includes:

- WordPress version
- Status: Supported, Not supported, or Needs testing
- Short compatibility note
- Test date
- WordPress Playground test URL

Display the records as version cards in a responsive grid. Include summary counts for supported, not supported, and pending versions. Make it easy to add, remove, or update versions and their status without changing the page layout.

Each card should provide a button to open its associated reproducible WordPress Playground test. Design the interface as a focused, modern developer compatibility lab, with clear visual distinction between supported, unsupported, and untested states.

Turn plugin features into interactive demos

A plugin developer can also create a page linking to Playground demos of individual features. Visitors can try the plugin without installing it on their own site: each Blueprint prepares a fresh Playground instance with the plugin and example content.

Playground also has an Email panel for inspecting messages captured from the running site. This can help you check what a form generates without treating local capture as proof of delivery to an external inbox. Captured-mail forwarding, Email viewer

Run it on Playground

These examples show how Playground can support a shared workflow: the agent builds or configures something, and you inspect it in the same browser session. The WebMCP proxy extends that workflow to actions provided by plugins inside WordPress.

What are you creating with WordPress Playground and WebMCP? Share your examples in the comments or join the conversation in the WordPress SlackSlack Slack is a Collaborative Group Chat Platform https://slack.com/. The WordPress community has its own Slack Channel at https://make.wordpress.org/chat/ #playground channel.

X-post: Runnable code examples are now live in the Code Reference

X-post from +make.wordpress.org/core: Runnable code examples are now live in the Code Reference

Run Any Era of WordPress in Playground

Everyone started in a different phase of WordPress; some started with 5.0 when GutenbergGutenberg The Gutenberg project is the new Editor Interface for WordPress. The editor improves the process and experience of creating new content, making writing rich content much simpler. It uses ‘blocks’ to add richness rather than shortcodes, custom HTML etc. https://wordpress.org/gutenberg/ was released. I personally started with version 2.5, and I can’t remember what the internet was like. WordPress Playground is the fastest way to open a modern WordPress site in the browser. It’s becoming something broader: a version-spanning WordPress lab. Now you are able to see how WordPress worked at the time that you started to use it.

WordPress 2.5 running on Playground

Recent Playground updates make it possible to boot legacy WordPress releases in the browser, including versions that predate the blockBlock Block is the abstract term used to describe units of markup that, composed together, form the content or layout of a webpage using the WordPress editor. The idea combines concepts of what in the past may have achieved with shortcodes, custom HTML, and embed discovery into a single consistent API and user experience. editor, the REST APIREST API The REST API is an acronym for the RESTful Application Program Interface (API) that uses HTTP requests to GET, PUT, POST and DELETE data. It is how the front end of an application (think “phone app” or “website”) can communicate with the data store (think “database” or “file system”) https://developer.wordpress.org/rest-api/, modern PHPPHP PHP (recursive acronym for PHP: Hypertext Preprocessor) is a widely-used open source general-purpose scripting language that is especially suited for web development and can be embedded into HTML. https://www.php.net/manual/en/index.php syntax, and many assumptions baked into today’s development tools. That changes what Playground can do. It is no longer only a quick sandbox for the latest WordPress. It can also be a place to investigate old compatibility reports, compare admin experiences across releases, and preserve the behavior of earlier WordPress eras.

This work brings together three pieces:

  • PHP 5.2.17 compiled to WebAssembly.
  • Browser boot support for WordPress 0.7 through 6.2.
  • UIUI UI is an acronym for User Interface - the layout of the page the user interacts with. Think ‘how are they doing that’ and less about what they are doing. and compatibility fixes that make old versions practical to explore.

The result is a smoother way to move across WordPress history without installing old PHP runtimes, configuring a database, or keeping a collection of local server stacks alive. This is not a contribution to WordPress history, but it also improves WordPress Playground Compatibility.

What changed

The most visible change is in the Playground settings panel. A new Include older versions option expands the WordPress version picker to show older releases. The checkbox is under the WordPress version; once selected, Playground shows older versions of WordPress.

When older versions are visible, Playground handles the PHP pairing automatically:

WordPress version rangeRuntime behavior
WordPress 0.7-4.9PHP locks to 5.2
WordPress 5.0-6.2PHP locks to 7.4
WordPress 6.3 and newerPlayground uses the modern default flow

That automatic locking matters. A WordPress version that expects PHP 5.2 doesn’t benefit from a modern PHP 8.x runtime. Conversely, mid-modern WordPress releases can fail in surprising ways on current PHP versions even though they are not ancient. Playground chooses the runtime that gives each era the best chance to boot and behave like itself.

The picker also shows release code names, so contributors can move through versions by both number and WordPress history. Testing WordPress 2.8 “Baker” or WordPress 6.9 “Gene” becomes a browser setting rather than a local environment project.

Why it matters

Legacy support is not about recommending old software for production. It is about making old software observable.

That is useful for several kinds of work.

Reproduce old compatibility reports

PluginPlugin A plugin is a piece of software containing a group of functions that can be added to a WordPress website. They can extend functionality or add new features to your WordPress websites. WordPress plugins are written in the PHP programming language and integrate seamlessly with WordPress. These can be free in the WordPress.org Plugin Directory https://wordpress.org/plugins/ or can be cost-based plugin from a third-party. and theme developers often receive reports that mention an old WordPress version but do not include a full reproduction environment. Historically, testing those reports meant building an old stack: an old WordPress zip, an old PHP runtime, a database, and enough local configuration to keep everything running.

Playground can now remove most of that setup. Open a legacy version, install or load the plugin, and check whether the report reproduces. If it does, you can compare the same steps against a newer release and decide whether you are looking at a plugin bug, a WordPress behavior change, or an environment-specific problem.

Validate support decisions

Dropping support for an old WordPress version should be a product decision, not a guess. Playground makes it easier to verify what actually breaks.

A contributor can test a plugin on a legacy release, confirm whether activation works, visit the admin screen, create a post, and inspect any fatal errors or editor failures. That is much more useful than relying on assumptions about what “probably” still works.

Compare editor and admin behavior

WordPress changed significantly between the classic admin era, the REST API era, and the block editor era. Running old versions in Playground gives contributors a quick way to see those differences directly.

That can help with documentation, contributor onboarding, migrationMigration Moving the code, database and media files for a website site from one server to another. Most typically done when changing hosting companies. planning, and support work. Instead of describing how a workflow used to behave, you can open it.

Preserve WordPress history

WordPress is more than the current release. Old admin screens, editor flows, database assumptions, and plugin APIs are part of the project’s history.

Running those versions in the browser creates a lightweight preservation tool. It gives contributors, educators, and historians a way to inspect earlier WordPress releases without maintaining obsolete local infrastructure.

How it works

The feature looks simple in the UI, but it required several layers of runtime and compatibility work.

PHP 5.2.17 in WebAssembly

WordPress 1.0 through 4.9 expects a PHP era that modern development machines usually do not provide. Playground now includes PHP 5.2.17 WebAssembly builds for browser and Node runtimes, across the supported async modes.

Getting PHP 5.2 into that environment required more than changing a version number. The build needed legacy compiler support, compatibility shims, PHP source adjustments, runtime wiring, and safeguards for extensions that do not make sense in the old runtime.

The important user-facing result is simple: Playground can run the PHP generation that early WordPress expects, without asking contributors to install it locally.

Legacy WordPress boot flow

Modern Playground boot logic assumes a relatively recent WordPress. Legacy WordPress versions need different handling.

The legacy boot flow accounts for older package formats, older PHP syntax expectations, database assumptions, and WordPress source quirks across the early release line. It also covers the mid-modern range where WordPress 5.0 through 6.2 behaves more reliably on PHP 7.4 than on the newest PHP runtimes.

This is why the version picker can expose a broad set of releases while keeping the PHP selector locked to a compatible runtime.

SQLite compatibility

Playground uses SQLite instead of a traditional MySQLMySQL MySQL is a relational database management system. A database is a structured collection of data where content, configuration and other options are stored. https://www.mysql.com server. Modern WordPress support already depends on SQLite integration, but older WordPress releases introduce additional compatibility issues.

Recent work patches the SQLite integration path for PHP 5.2 compatibility and adjusts legacy boot behavior so older WordPress versions can reach a usable installed state in the browser. For contributors, this means the site can boot, load the admin, create content, and activate plugins without requiring a separate database service.

Classic editor compatibility

Legacy WordPress support also needs the editor to load. In older versions, TinyMCE initialization can be sensitive to how inline editor CSSCSS CSS is an acronym for cascading style sheets. This is what controls the design or look and feel of a site. is serialized into JavaScriptJavaScript JavaScript or JS is an object-oriented computer programming language commonly used to create interactive effects within web browsers. WordPress makes extensive use of JS for a better user experience. While PHP is executed on the server, JS executes within a user’s browser. https://www.javascript.com.

Playground now escapes the CSS it inlines into TinyMCE’s content_style path. That prevents characters from Dashicons and other editor styles from breaking the classic editor initialization script. The legacy test coverage now checks real browser editor boot behavior, including older new-post screens.

That detail may sound small, but it is the difference between “WordPress boots” and “WordPress is useful enough to inspect.”

Real scenarios

Investigate a plugin activation issue

A user reports that a plugin fails on WordPress 4.9. Open Playground, enable older versions, select WordPress 4.9, and let Playground lock PHP to 5.2. Install the plugin and try the activation path.

If activation fails, you have a fast reproduction environment. If it works, compare it against WordPress 5.0 or 6.2 to see whether the issue depends on a specific WordPress era.

Check a classic editor regression

Some support reports are really editor reports: a button disappears, TinyMCE fails to initialize, or old metaboxMetabox A post metabox is a draggable box shown on the post editing screen. Its purpose is to allow the user to select or enter information in addition to the main post content. This information should be related to the post in some way. behavior changes. With legacy WordPress available in Playground, contributors can open a pre-block-editor release and inspect the classic editing flow directly.

That is especially useful when debugging migration issues from classic editing workflows to block-editor workflows.

Audit a support policy

Before changing a plugin’s minimum supported WordPress version, test the versions near the proposed cutoff. Does the plugin still activate? Does the settings screen load? Does the admin flow produce fatal errors?

Playground will not answer every support question, but it gives you a quick first pass that is much more concrete than guessing.

Teach WordPress evolution

For educators and contributors onboarding new people, being able to open WordPress 1.x, 2.x, 3.x, 4.x, and modern WordPress side by side is valuable. It makes the project’s evolution tangible: admin navigation, writing flows, media handling, plugin screens, and editor behavior all become visible.

Limits and expectations

Legacy support in Playground is a compatibility and exploration tool. It does not make old WordPress or old PHP versions suitable for production.

Expect a few boundaries:

  • Old WordPress versions may still expose historical bugs, missing APIs, and outdated assumptions.
  • Plugin and theme code written for modern WordPress may not run on older PHP syntax or older WordPress APIs.
  • Browser-based compatibility is not identical to every historical hosting environment.
  • The goal is to make old versions boot and behave usefully enough for testing, inspection, education, and preservation.

That boundary is important. Playground gives contributors a controlled lab, not a recommendation to keep obsolete stacks alive in production.

A broader Playground story

This update fits a broader direction for Playground. The project is moving from “run WordPress in the browser” toward “make WordPress environments portable, inspectable, and automatable.”

Running legacy versions is part of that story. It means Playground can help with current development, future compatibility, and historical understanding. A contributor can open the latest WordPress release, switch to an old classic release, compare behavior, and learn from both without leaving the browser.

For a project with more than two decades of history, that is a meaningful shift.

References

These recent upstream changes provide the technical foundation for this post:

Props to @janjakes for reviewing the post.

Meet the new WordPress Playground interface

WordPress Playground has a new interface for its web instance. A customizable Dock brings tools that were previously spread across sidebars, modals, and popovers into one consistent toolbar at the bottom of the screen.

The redesign addresses a discoverability problem. Playground can already save sites in the browser, switch between multiple sites, run Blueprints, edit files, inspect the database and logs, import complete sites, and export work in several formats. However, many of those features were easy to miss. Some users even assumed that every Playground was still temporary.

From exploration to a shared design

The new interface grew out of work at the WordPress Playground table during Contributor DayContributor Day Contributor Days are standalone days, frequently held before or after WordCamps but they can also happen at any time. They are events where people get together to work on various areas of https://make.wordpress.org/ There are many teams that people can participate in, each with a different focus. https://make.wordpress.org/support/handbook/getting-started/getting-started-at-a-contributor-day/ at WordCampWordCamp WordCamps are casual, locally-organized conferences covering everything related to WordPress. They're one of the places where the WordPress community comes together to teach one another what they’ve learned throughout the year and share the joy. Learn more. Europe 2026 in Kraków.

Before the event, Adam Zieliński used AI tools to explore more than 400 interface variations. Those experiments were not production-ready designs, but they helped the team identify promising directions. At Contributor Day, designers and other contributors sketched alternatives, discussed how different audiences use Playground, and narrowed the proposals to the Dock interface.

The goal was not only to refresh the visual design. The team wanted to reduce the space used by Playground controls, distinguish them from WordPress controls, and give every tool a predictable home. The Dock makes those capabilities visible without competing with the WordPress admin bar or taking space away from the site. It can appear as a compact toolbar, collapse to a minimal control, or expand into a full-width sticky bar.

The goal of this change

Beyond the visual aspect, the goal was to use less space and differentiate from the WordPress admin bar. The new UI lists all main options as icons for the user:

  • New: Start a Playground from a searchable Blueprint gallery, a Blueprint URLURL A specific web address of a website or web page on the Internet, such as a website’s URL www.wordpress.org, Blueprint JSONJSON JSON, or JavaScript Object Notation, is a minimal, readable format for structuring data. It is used primarily to transmit data between a server and web application, as an alternative to XML., a pull request preview, a GitHubGitHub GitHub is a website that offers online implementation of git repositories that can easily be shared, copied and modified by other developers. Public repositories are free to host, private repositories require a paid subscription. GitHub introduced the concept of the ‘pull request’ where code changes done in branches by contributors can be reviewed and discussed before being merged by the repository owner. https://github.com/ repository, or a previously exported ZIP file.
  • Playgrounds: Switch between sites and manage recent autosaves and permanently saved Playgrounds. You can rename, save, reopen, or delete a site from its Actions menu.
  • Blueprint: Inspect or edit the current site’s blueprint.json recipe and export it for reuse.
  • Site Settings: Choose the WordPress version, PHPPHP PHP (recursive acronym for PHP: Hypertext Preprocessor) is a widely-used open source general-purpose scripting language that is especially suited for web development and can be embedded into HTML. https://www.php.net/manual/en/index.php version, and language, or rename the Playground. Changing the WordPress or PHP version creates a fresh Playground instead of silently changing the current site.
  • Database: Inspect or export the SQLite database with Adminer or phpMyAdmin. Both tools continue to open in a new tab to provide more working space.
  • Files: Browse, create, upload, edit, and download files from the WordPress instance. Desktop users can also drag files into the file manager; mobile users can use the upload control.
  • Logs: Review messages from PHP, WordPress, and Playground in one place.
  • Export: Download the current site as a ZIP file, copy a link to its original Blueprint setup, or export selected files to GitHub.

The new UI provides a consistent experience, with all functionality available in modals on desktop and slide panels on mobile. It took the best of the UI and made all options available at the bottom. It provides easy access for mobile users to navigate across all options with a single thumb.

Existing capabilities, fewer clicks

This release is primarily a navigation redesign, not a new set of Playground capabilities. Existing workflows now have a consistent entry point, and the autosave experience, file browser, and Blueprint editor received refinements. The New panel is one example. Workflows that previously lived in different parts of the interface now appear together. You can start with a Blueprint, preview a WordPress or GutenbergGutenberg The Gutenberg project is the new Editor Interface for WordPress. The editor improves the process and experience of creating new content, making writing rich content much simpler. It uses ‘blocks’ to add richness rather than shortcodes, custom HTML etc. https://wordpress.org/gutenberg/ pull request, import from GitHub, or restore a Playground ZIP without searching through separate menus.

The Playgrounds panel also makes persistence easier to understand. Saved sites and recent autosaves appear in separate groups, with preview thumbnails and recognizable names that help you find earlier work.

New Your Playgrounds panel

Built with the community

Community collaboration helped to shape the Dock from early sketches through the final feedback cycle. The challenge remains the same: make advanced tools useful to developers without overwhelming people who only want a quick, safe place to explore WordPress. The Dock gives the team a more flexible foundation for serving both groups.

Thank you to @ashfame for co-leading the Playground table at Contributor Day; @berislavgrgicak and @zieladam for gathering and shaping the ideas; @corazondejaguar, @feedmymedia, @tibibuzdugan, and @maxtudio for the prototypes and design feedback; and @sufmitsingh and @muryam for helping with testing.

Contributor Day WordCamp Europe 2026

Share your feedback

Try the new interface on both desktop and mobile. If you find a bug or an unclear workflow, add it to the New Dock UI review issue. Helpful reports include:

  • Your device, operating system, and browser.
  • The steps you followed.
  • What you expected and what happened instead.
  • A screenshot or short recording, when possible.

#ui

One Playground, three workflows: Consistent agent guidance across surfaces

WordPress Playground is not a single interface. A developer may use the Playground CLICLI Command Line Interface. Terminal (Bash) in Mac, Command Prompt in Windows, or WP-CLI for WordPress. for local work, a Blueprint to describe a reproducible site, or playground.wordpress.net to create and share a browser-based demo. An AI agent needs to know which surface owns each part of a request.

PR #56 in the WordPress agent-skills repository updates the wp-playground skill around that idea. Instead of keeping CLI commands, Blueprint advice, browser links, and debugging notes in one long procedure, the skill becomes a small routing layer with focused references.

The result gives agents a clearer model of the whole Playground ecosystem. In this post, we are going to cover the main updates on the WordPress Playground agent skill, which is present in the WordPress repository. If you want an introduction post, I do recommend reading the previous post about the Playground agent skill.

What changes for Playground users

  • A developer starting a pluginPlugin A plugin is a piece of software containing a group of functions that can be added to a WordPress website. They can extend functionality or add new features to your WordPress websites. WordPress plugins are written in the PHP programming language and integrate seamlessly with WordPress. These can be free in the WordPress.org Plugin Directory https://wordpress.org/plugins/ or can be cost-based plugin from a third-party. locally gets the current start workflow and a check that the plugin is active.
  • A reviewer receiving a demo link gets correct encoding, public hosting and CORS requirements, and a fresh-browser verification step.
  • A mixed request can move from Blueprint authoring to local execution and browser sharing without one skill pretending to own every concern.

The headline benefit is consistency across surfaces: the answer changes with the workflow, while the underlying model of Playground stays coherent.

Why the previous skill reached its limit

The previous 101-line SKILL.md put local execution, Blueprint guidance, browser sharing, and debugging in one procedure. That created three failure modes:

  • Browser support was too shallow to explain the Query API, persistence, or the difference between window.playgroundSites and the active window.playground client.
  • Blueprint guidance existed in both wp-playground and the dedicated blueprint skill, creating two sources of truth.
  • The common plugin and theme workflow still led with server --auto-mount after the Playground CLI documentation had moved the typical development loopLoop The Loop is PHP code used by WordPress to display posts. Using The Loop, WordPress processes each post to be displayed on the current page, and formats it according to how it matches specified criteria within The Loop tags. Any HTML or PHP code in the Loop will be processed on each post. https://codex.wordpress.org/The_Loop to start.

The current high-level workflow is:

cd <plugin-or-theme-root>
node -v
npx @wp-playground/cli@latest start

The server command remains useful when an agent needs explicit mounts, a disposable environment, CI behavior, or fine-grained runtime control. The important change is teaching the agent to choose, not treating one command as the answer to every local workflow.

Route by intent, then load the detail

The new wp-playground wrapper starts by classifying the request:

Request typeOwnerExpected outcome
Write or review Blueprint JSONJSON JSON, or JavaScript Object Notation, is a minimal, readable format for structuring data. It is used primarily to transmit data between a server and web application, as an alternative to XML.blueprint skillCurrent schema, supported steps, and valid resources
Run a plugin, theme, or Blueprint locallywp-playground → CLI referenceAppropriate command, mount strategy, and verification
Debug Xdebug or a stuck CLI runwp-playground → debugging referenceRelevant logs, flags, and worker guidance
Create a browser link or automate a browser sitewp-playground → website referenceCorrect URLURL A specific web address of a website or web page on the Internet, such as a website’s URL www.wordpress.org or APIAPI An API or Application Programming Interface is a software intermediary that allows programs to interact with each other and share data in limited, clearly defined ways. surface with browser constraints
Combine authoring, local execution, and sharingWrapper composes the routesOne staged workflow with clear ownership

Mixed requests can use more than one route. For example, “write a Blueprint, run it locally, and give me a reviewer link” uses blueprint for the JSON, the CLI reference for local execution, and the website reference for sharing.

This is progressive disclosure in practice. The entry file drops from 101 to 52 lines. The complete bundle grows because it documents more capability, but an agent loads that depth only when the request needs it.

Browser sharing becomes a first-class route

The website reference distinguishes three control surfaces:

  1. URL setup through Query API parameters, Blueprint fragments, and blueprint-url.
  2. Browser site management through the Sites API at window.playgroundSites.
  3. Runtime interaction through the JavaScript API client exposed as window.playground.

That distinction prevents several common mistakes. playgroundSites manages site records, persistence, and the active site. The Playground client reads and writes the WordPress virtual filesystem, runs PHPPHP PHP (recursive acronym for PHP: Hypertext Preprocessor) is a widely-used open source general-purpose scripting language that is especially suited for web development and can be embedded into HTML. https://www.php.net/manual/en/index.php, makes requests, and navigates the visible site. URL parameters configure a site before it boots.

The reference also documents boundaries that matter when an agent generates a share link:

  • Small inline Blueprints should be encoded once with encodeURIComponent(JSON.stringify(blueprint)).
  • Larger JSON files and ZIP bundles should use ?blueprint-url=<public-url>.
  • Hosted files must be public and allow cross-origin loading.
  • A browser Playground cannot read an arbitrary local filesystem path.
  • The final URL should be checked in a fresh browser session.

These details turn “make a Playground link” from a plausible-looking string into a repeatable handoff. The official troubleshooting guide confirms that raw JSON in a fragment, double encoding, private URLs, and missing CORS headers are frequent failure modes.

At the same time, the blueprint skill now explicitly owns Blueprint JSON and bundles, and the debugging reference replaces stale worker advice with current flags. The router can therefore choose a source before the agent starts composing an answer.

What the benchmark showed

To measure the impact, I compared three configurations:

  • The new version.
  • The previous skill.
  • A control that answered from general model knowledge without consulting a skill.

The benchmark used the four scenarios added by the PR: CLI auto-mounting, website sharing, a mixed Blueprint/CLI/browser request, and current Blueprint schema authoring. Every configuration received the same prompts running on GPT 5.5 Sol. The two skill configurations could read only the files from their pinned revision, while the control could not read skill files or references.

On this four-scenario, 24-assertion regression suite:

ScenarioNew skillPrevious skillWithout skill
CLI auto-mount5/5 (100%)4/5 (80%)1/5 (20%)
Website share URL6/6 (100%)5/6 (83.3%)2/6 (33.3%)
Mixed Blueprint, CLI, and website workflow6/6 (100%)6/6 (100%)3/6 (50%)
Current Blueprint schema7/7 (100%)7/7 (100%)6/7 (85.7%)
All assertions24/24 (100%)22/24 (91.7%)12/24 (50%)

Six criteria inspect the execution trace rather than the final answer. Five explicitly require the agent to use or route through a skill, so they necessarily penalize the no-skill control. Removing all six produces a cleaner comparison of answer content:

Answer-content scoreNew skillPrevious skillWithout skill
Passed criteria18/18 (100%)16/18 (88.9%)11/18 (61.1%)

The final PR revision passed 24/24 checks: 100% on this four-scenario, 24-assertion regression suite. Only two content checks separated it from the previous skill:

  • It chose npx @wp-playground/cli@latest start for the common plugin-development workflow.
  • It required public, CORS-enabled hosting with Access-Control-Allow-Origin: * for Blueprint files, bundles, and referenced assets.

The Blueprint-only scenario did not distinguish answer quality; all three configurations passed its six content checks. That is evidence of preserved behavior, not improvement.

This is a focused regression suite, not a general model leaderboard. It uses one run per prompt, does not measure run-to-run variance, and grades guidance rather than live Playground execution.

Review improved the architecture

The pull request’s review history also shaped the final structure. Review feedback asked for an explicit routing procedure, top-level failure modes, stronger delegation to blueprint, and direct one-hop links from the wrapper to each reference.

The final revision removes reference-to-reference handoffs. A CLI or website reference now sends the agent back to the wrapper when the request changes direction. That keeps every focused file one hop from SKILL.md and makes the routing model easier to inspect.

Consistency across surfaces

The improvement is not merely a higher benchmark score. It is a more consistent developer experience across the CLI, Blueprints, and browser sharing. A request can move from a valid Blueprint to a local run and then to a reviewer link while each skill remains responsible for one concern.

PR #56 was merged on July 25, 2026. You can inspect the complete change set and use the four scenarios as starting points for testing real Playground tasks.