Back

WordPress Playground – A New Tool You Need To Try Right Now

Last updated on

WordPress has been consistently rolling out remarkably innovative tools that not only facilitate but enthusiastically propel users towards achieving their goals with unparalleled proficiency. Among the latest additions is the captivating Playground, an ingenious tool meticulously crafted to instantaneously render a WordPress site available for dynamic testing, immersive learning, and inspired building endeavors.

Background On WordPress Playground

Playground operates seamlessly within your browser, offering a multitude of practical applications as outlined in the official WordPress documentation:

  1. Experiment with diverse blocks, themes, or plugins.
  2. Construct entire websites, save them, and host them effortlessly.
  3. Conduct comprehensive plugin tests across various WordPress and PHP versions.
  4. Incorporate a live, interactive WordPress site seamlessly into your tutorials or courses.
  5. Showcase plugins or themes directly on your website.
  6. Develop native applications powered by WordPress and distribute them through the App Store.
  7. Preview pull requests directly from your repository.

Moreover, there exists a WordPress Plugin named “Playground By WordPress Contributors,” which empowers users to clone their site into a private, in-browser Playground version.

This plugin facilitates the creation of an exact replica of a website within a Playground instance, enabling users to conduct various experiments such as plugin or theme testing. Crucially, any alterations made within the Playground instance remain isolated and do not impact the original website. Notably, the cloned site remains securely within the user’s browser, safeguarding privacy, and is not uploaded to any cloud service. The data remains exclusively within the user’s browser until the tab is closed, ensuring confidentiality and control over the testing environment.

Interview: Adam Zieliński, WordPress Playground Architect @ Automattic

I had a conversation with Adam Zieliński, the WordPress Playground Architect at Automattic, to delve into the essence of Playground and its potential benefits for both developers and everyday WordPress users.

My initial query was straightforward: What exactly is Playground, and why should individuals consider utilizing it? Additionally, what can users anticipate experiencing through its utilization?

According to Adam Zieliński, Playground represents WordPress at the click of a button. Gone are the days of cumbersome setup processes, web hosting accounts, and jargon-filled technical discussions.

It’s essential to note that Playground isn’t merely the website found at playground.wordpress.net. Rather, it embodies innovative technology that enables that site’s functionality while also fueling a wave of interactive, one-click WordPress solutions. These encompass interactive tutorials, quality assurance workflows, plugin previewers for “try before you buy” scenarios, collaborative tools, contribution workflows, and a plethora of other features.

Here are two instances showcasing the versatility of Playground:

  1. The platform hosted at playground.wordpress.net serves as more than just a website; it functions as a comprehensive quality assurance tool. Users can explore upcoming WordPress releases, assess plugin or theme compatibility with other plugins, and evaluate performance across various WordPress and PHP versions. This capability proved invaluable during the WordPress 6.5 release cycle, as well as during initiatives like the Font library call for testing, among others.
  2. Operating as a WordPress plugin, Playground offers the functionality to replicate an existing WordPress site entirely, including all content, plugins, and themes, within a private Playground environment. This feature provides users with a safe space to experiment with changes, test new plugins or updates, all without the need for separate hosting, and without impacting their live site.

Additionally, Playground extends its utility beyond standalone usage by offering the ability to embed it directly into websites. Some companies leverage this feature to showcase live versions of their plugins or themes by embedding a live WordPress Playground site within their own site. This approach proves immensely beneficial for potential customers, even those unfamiliar with Playground, as they can interact with the product in a real-world context.

In response to my inquiry about how he would explain Playground to someone familiar with WordPress but not the technical aspects, Adam Zieliński described it as a version of WordPress that operates directly on your device rather than on a web server. He emphasized its offline functionality, highlighting that users can access Playground on their phone even without an internet connection.

When asked about its utility for tasks like transitioning to a new template or testing plugin updates, Zieliński affirmed its effectiveness. He explained that users can duplicate their website using the Playground WordPress plugin and experiment with the new template or updated plugin in a safe environment, avoiding any potential disruptions to their live site. Additionally, he mentioned that the plugin facilitates this process by adding a “preview now” option to the plugin search in the wp-admin interface, enabling users to test plugins before installing them on their live site.

Zieliński then suggested the following resources for further exploration of Playground:

WordPress Playground: the ultimate learning, testing, & teaching tool for WordPress

When asked about Playground’s potential for helping regular WordPress users delve into site development, Adam Zieliński highlighted its effectiveness as a learning tool. He explained that users can easily access Playground at playground.wordpress.net and begin exploring WordPress functionalities, from creating their first post to experimenting with various plugins and constructing entire websites.

Zieliński emphasized the self-guided nature of the experience, which proves beneficial in educational settings such as classes, workshops, and meetups where instructors can offer guidance.

Furthermore, he mentioned ongoing efforts to enhance Playground’s educational value by introducing interactive and guided tutorials. He envisioned a scenario where users visiting WordPress.org could click on topics like “Building my first WordPress site” and receive clear instructions along with an interactive WordPress environment to practice on. This vision, he assured, is not distant but actively being pursued.

In the present, Zieliński introduced the Playground Block, a tool that enables anyone to create interactive learning experiences effortlessly. By simply embedding the Playground Block into WordPress content, users can offer hands-on learning opportunities. He encouraged exploration of this feature by visiting the plugin page and utilizing the Live Preview option, which is also powered by WordPress Playground.

Regarding compatibility with popular WordPress website builders, Adam Zieliński mentioned that while he hasn’t personally tested Divi, Elementor generally functions well with Playground. However, he noted a technical issue within the Elementor onboarding process that requires attention from the Elementor team for full functionality.

On the topic of Playground’s feature called Blueprints, which involves configuration setting files, I inquired how Adam would describe them and their usefulness to users.

Adam Zieliński explained that Blueprints serve as guidelines for Playground to create a WordPress site according to your specifications. He likened Blueprints to puzzle pieces and described an innovative approach at WCEU 2024 where physical puzzle pieces representing site configuration steps would be used. Attendees could collect and scan these pieces with an app, which would then load Playground with the corresponding configuration they assembled.

Regarding their usefulness, Zieliński highlighted two aspects. Users can either utilize a Playground site created based on an existing Blueprint or craft a new Blueprint themselves. For those simply interested in utilizing Playground-based tools, understanding Blueprints isn’t necessary; they’ll only encounter a button that opens a WordPress site preconfigured for various tasks like theme testing, documentation contribution, or creating presentations.

However, for users interested in crafting new Blueprints, Zieliński acknowledged the need for some familiarity with JSON code currently. He mentioned resources like Blueprints 101 and Technical Introduction to Playground to guide users through this process. Additionally, examples are available in the Blueprints Gallery. Notably, efforts are underway to develop a visual tool that would allow users to assemble Blueprint steps without requiring coding knowledge.

Is this a way to create a site and then save or share the demo?

Yes, according to Adam Zieliński, Playground offers several options for saving and sharing demo sites. By default, Playground sites are temporary, but users can save them for future access. On playground.wordpress.net, users can utilize a settings button to instruct Playground to save the site in their web browser. Once saved, refreshing the page will restore the site to its saved state. Additionally, users can synchronize the site with a directory on their computer, allowing all Playground changes to be reflected locally. Furthermore, users have the option to export the site as a zip file or to GitHub.

When it comes to sharing sites with others, Zieliński outlined two methods. The first involves creating a Blueprint, which entails documenting the step-by-step instructions for Playground to recreate the site. This Blueprint can then be shared with others via a link. While powerful, Blueprints might not always be the most convenient option. Hence, there’s a second method: exporting the Playground site as a zip file. Users can host this zip file, for instance, on GitHub, and create a Playground link to load it, thus providing an alternative means of sharing the site.

In the WordPress developer community, there’s a common practice among site builders to offer ‘starter sites,’ which closely resemble blueprints. These starter sites typically come with premium themes and plugins. Similarly, in Drupal, there are ‘Distributions,’ which are essentially pre-configured starter sites often tailored to specific niches.

Picture this: a preconfigured installation of core, a theme, a membership plugin, and a payment setup (pending gateway API keys). If you’re looking to set up a membership site, you simply install this package and begin adding your content. The same goes for setting up a preconfigured help desk system or any other specific functionality.

So, the question arises: Is the vision for Blueprints to provide something akin to this?

Adam Zieliński highlights the versatility of Blueprints. For instance, he points to live previews in the WordPress plugin directory as a prime example. Each time you access one, you’re presented with an identical site pre-configured for a specific plugin. These previews consistently install a fresh WordPress instance along with the latest versions of all accompanying plugins and themes.

You have the option to prepare a Blueprint tailored to your specific setup and interact with it directly in your browser. Additionally, the Playground CLI tool allows you to work with these starter sites on your local computer. There’s also ongoing work on a PHP library aimed at enabling web hosts to support Blueprints. This advancement could potentially make template sites a common feature in the WordPress hosting landscape.

WordPress Playground

The WordPress Playground is akin to a designated space meant to foster and encourage activities. It’s tailored for users of all levels within the WordPress community. Engaging with Playground not only expands your understanding but also cultivates problem-solving skills, broadens perspectives, and enhances competitiveness and business acumen. It’s highly recommended that anyone involved with WordPress explore Playground, as its benefits are manifold and invaluable for personal and professional growth.

Original news from SearchEngineJournal