This project is experimental and under active development.
Explore, experiment, and play—no setup required
For users, designers, and educators, WordPress Playground is a flexible tool that lets you:
- Try plugins and themes in a live virtual environment
- Experiment with an anonymous WordPress website
- Embed a real WordPress site in your tutorial or course
Demo WordPress Playground now.
Build next-level apps with client-side WordPress
Unlock the full potential of WordPress Playground by integrating it with your codebase. Here are just a few examples of what you can build:
- Single-click website clones to experiment with design updates and plugins
- WordPress programming tutorials in the browser without any local setup
- Zero-setup website builders
- PHP and WordPress versions switchers—helpful for testers
- Bug reports that include a real reproduction
- Single-click development environments for reviewing code, onboarding new developers, or debugging failed tests directly in the CI (imagine visiting WordPress.org, pressing a button, and starting your first PR right there)
And that’s just a small glimpse of the many possibilities!
Use WordPress tech stack in your browser
WordPress Playground brings key platform dependencies into the browser. Here’s a quick breakdown of how it works:
- PHP runs as a WebAssembly binary
- MySQL is replaced for SQLite via a WordPress plugin
- Web server is implemented with the Service Worker API
Dig into the WordPress Playground documentation to learn more about these concepts.
Integrate WordPress Playground into your project
⚠️ This is an experimental project – it might break or change without a warning.
The easiest way to integrate is to link to the demo (like this tutorial on Learn WordPress). If you’re looking for more control, you can choose to embed WordPress Playground directly on your site, or host your own.
Embed WordPress Playground on your website
A contextual WordPress website can be more helpful than an external link. Embedding can simplify things like:
- Calls for testing of your project
- Showcasing your plugin or theme
- Adding practical elements to your WordPress course
The latest version of WordPress Playground is available at https://wasm.wordpress.net/wordpress.html. You can embed it on your website via the <iframe>
HTML tag:
<iframe
style="width: 800px; height: 500px;"
src="https://wasm.wordpress.net/wordpress.html?mode=seamless"
></iframe>
Notice the URL says mode=seamless
. This is a configuration option that turns off the “browser UI” and gives WordPress the entire available space. You can see more examples and learn about other configuration options in the available documentation.
Host your own WordPress Playground
If you need more flexibility with your build, hosting a WordPress Playground can help with:
- Using specific WordPress or PHP versions
- Customizing a WordPress installation
- Shipping additional PHP extensions
Start by creating a local development build of WordPress Playground:
git clone https://github.com/WordPress/wordpress-playground
cd wordpress-playground
npm install
npm run dev
Now you can customize the WordPress build script, the PHP build script, and any other part of WordPress Playground.
Get involved and make an impact on the project
WordPress Playground is a collective effort, and it benefits the most from passionate and talented people like you. By contributing, you can help evolve the project to solve all kinds of challenges.
Best of all, you don’t need to know WebAssembly to contribute to WordPress Playground! This project is primarily built with JavaScript and that’s all you need to make major, meaningful contributions. Here are some quick ways to get started:
- Add issues or pull requests to the WordPress Playground GitHub repository
- Find more details in the project documentation
- Join the conversation in the #meta-playground channel on Making WordPress Slack
Anyone can contribute, even if you’re not a developer. Your feedback, questions, feature requests, and ideas help move things forward. Even sharing the joy of WordPress Playground with your network can help more people discover the project.