「WordPressの関数を試したいだけなのに、ローカル環境を作るところで止まってしまう」という声を、講座の受講者からよく聞きます。2026年9月、WordPress公式のCode Reference（関数リファレンス）に載っているPHPコード例を、ブラウザ上でそのまま実行できる仕組みが公式サイトに入りました。裏側で動いているのが「WordPress Playground」です。この記事では、Playgroundとは何かを運営者・学習者向けに、Code Referenceの実行機能の仕組みと活用法を開発者向けに解説します。

結論から言うと、WordPress Playgroundは「サーバーもレンタルサーバー契約も不要で、ブラウザだけでWordPressを起動して試せる公式ツール」です。2026年9月4日の公式発表により、WordPress 7.1のCode Referenceに初めて「Run」ボタン付きのコード例が2つ搭載され、7.2ではさらに増える予定です。学習・プラグイン検証・お客様へのデモの3つの場面で、環境構築の手間をほぼゼロにできます。

WordPress Playgroundとは？ブラウザだけでWordPressが動く仕組み

WordPress Playgroundは、WordPress公式プロジェクトが提供する「ブラウザの中で動くWordPress」です。PHPをWebAssembly（ブラウザで動く実行形式）に変換し、データベースもブラウザ内で完結させることで、サーバーが一切なくてもWordPressが起動します。公式ドキュメントでも「すべてクライアントサイドで動作し、認証もバックエンドも不要」と説明されています。

使い方は簡単で、https://playground.wordpress.net/ を開くだけです。数秒〜十数秒でログイン済みの管理画面が表示され、テーマやプラグインのインストール、記事の投稿、設定の変更など、普通のWordPressとほぼ同じ操作ができます。

Playgroundで何ができる？サイト運営者・学習者向けの使いどころ

開発者向けと思われがちですが、サイト運営者にも使いどころがあります。

気になるプラグインやテーマを本番に入れる前に試す：URLに ?plugin=プラグイン名を付けるだけで、そのプラグインが入った状態のWordPressが起動します
特定のPHP・WordPressバージョンでの動作を確認する：?php=8.3 のようにバージョンを指定できるため、サーバー更新前の下見に使えます
学習用のお試し環境：壊しても消すだけで済みます
お客様へのデモ：制作会社なら、提案時に「こう動きます」をURLひとつで見せられます

私はUdemyで18時間超のWordPressプラグイン開発講座を公開していますが、受講者が最初につまずくのは、コードそのものではなく「ローカル環境の構築」です。Playgroundは、この最初の壁を「ブラウザを開く」だけに下げてくれます。

Playgroundの制限｜データは消える・本番の代わりにはならない

便利な一方で、本番サイトとは異なる制限があります。ここを知らずに使うと「作ったサイトが消えた」という事故につながります。

項目	Playgroundの挙動
データの永続化	基本は一時環境。ブラウザストレージへの自動保存は最大5件で、確実に残したい場合はZIPでエクスポートが必要
起動時間	素のWordPressで5〜10秒、大きなプラグイン（WooCommerce等）を含めると30〜60秒程度。スマホはさらに遅い
WP-CLI	ブラウザ環境のため、完全なWP-CLIコマンドは使えない
公開・本番利用	あくまで実験・検証用。実サイトのホスティングには使わない

Playgroundは「試す場所」であって「本番の代わり」ではありません。本番サイトで安全に更新・検証を行う手順は、安全なアップデート手順の記事にまとめています。

ここまでのまとめ

Playgroundは「ブラウザだけで動くWordPress」で、プラグインの下見・学習・デモに向き、データは残らない前提で使う。ここからは、公式Code Referenceに入った「コード実行機能」の仕組みと活用法を開発者向けに解説します。

Code ReferenceのPHPコード実行はどう動いている？

2026年9月4日のMake WordPress Coreの発表によると、WordPress 7.1の時点で実行可能なコード例が2つ搭載され、7.2でさらに追加される予定です。ローカルのWordPress 7.1のソースを確認したところ、対象は WP_HTML_Processor::class_list() と WP_HTML_Tag_Processor::class_list() の2つで、それぞれのDocBlock（関数の直前のコメント）に、通常の「php」ではなく「php interactive」という言語タグ付きのコード例が書かれていました。

/**
 * ...
 * ＜php interactive コードフェンス開始＞
 * <?php
 * require '/wordpress/wp-load.php';
 * $p = WP_HTML_Processor::create_fragment( "<div class='free &amp;lt;egg&amp;gt;\tlang-en'>" );
 * $p->next_tag();
 * foreach ( $p->class_list() as $class_name ) {
 *   var_dump( $class_name );
 * }
 * ＜コードフェンス終了＞
 * ＜expected-output コードフェンス開始＞
 * string(4) "free"
 * string(5) "<egg>"
 * string(7) "lang-en"
 * ＜コードフェンス終了＞
 */
public function class_list() {

/**

* ...

* ＜php interactive コードフェンス開始＞

* <?php

* require '/wordpress/wp-load.php';

* $p = WP_HTML_Processor::create_fragment( "<div class='free &lt;egg&gt;\tlang-en'>" );

* $p->next_tag();

* foreach ( $p->class_list() as $class_name ) {

* var_dump( $class_name );

* }

* ＜コードフェンス終了＞

* ＜expected-output コードフェンス開始＞

* string(4) "free"

* string(5) "<egg>"

* string(7) "lang-en"

* ＜コードフェンス終了＞

public function class_list() {

つまり、コアのソースに「interactive」と印を付けたコード例を書くと、developer.wordpress.org がそれを実行可能なブロックとして表示する仕組みです。期待出力もソース側にあるため実行前から結果が分かり、実行後はPlaygroundの実際の出力に置き換わります。公式サイト側のHTMLを確認すると、該当ページには php-snippet というカスタム要素が埋め込まれ、playground.wordpress.net から php-code-snippet.js を読み込んでいました。この php-snippet は2026年5月に公開されたWebコンポーネントで、誰でも自分のサイトに埋め込めるものです。

php-snippetを自分のサイトで使うには？

技術ブログやプラグインのドキュメントに「その場で実行できるPHPコード例」を置くなら、必要なのはスクリプト1行とカスタム要素だけです。

<script type="module" src="https://playground.wordpress.net/php-code-snippet.js"></script>

<php-snippet name="hello.php">
  <script type="application/x-php">
<?php
require '/wordpress/wp-load.php';
echo get_bloginfo( 'version' );
  </script>
</php-snippet>

<php-snippet name="hello.php">

<?php

require '/wordpress/wp-load.php';

echo get_bloginfo( 'version' );

</script>

</php-snippet>

読者がRunボタンを押すと、初回だけ非表示のiframe内でPlaygroundが起動し、結果がコードの下に表示されます。PHP・WordPressバージョンと初期設定（Blueprint）が同じスニペットは1つの実行環境を共有するため、例を何個置いてもその都度WordPressが起動し直すことはありません。主な属性は次のとおりです。

php／wp：実行に使うPHP・WordPressのバージョンを指定。純粋なPHPだけ試すなら wp=”none”
blueprint：複数のスニペットで共通の前準備（ヘルパー関数の配置など）をJSONで指定
auto-prepend-script：エディタに見せたくない前処理（wp-load.php の読み込みなど）を隠して自動実行
readonly／runnable=”false”：編集不可・表示のみにする

厳しいContent Security Policyを設定しているサイトでは、playground.wordpress.net からのスクリプトとiframeを許可する必要があります。また、.phpテンプレートに直接書く場合はPHPの開始タグをエスケープしないとサーバー側で解釈されてしまいます。

Blueprintでプラグインを試せるURLを作るには？

Playgroundの真価は、「この状態のWordPress」をURLひとつで再現できることです。簡単なものならクエリパラメータだけで足ります。

https://playground.wordpress.net/?plugin=contact-form-7&amp;php=8.3&amp;url=/wp-admin/

1 2	https://playground.wordpress.net/?plugin=contact-form-7&php=8.3&url=/wp-admin/

「プラグインを入れて、テストデータを投稿して、特定の画面を開く」まで再現したいときは、Blueprint（JSON形式の手順書）を使います。

{
  "landingPage": "/wp-admin/edit.php",
  "preferredVersions": { "php": "8.3", "wp": "latest" },
  "steps": [
    { "step": "login", "username": "admin", "password": "password" },
    { "step": "installPlugin",
      "pluginData": { "resource": "wordpress.org/plugins", "slug": "contact-form-7" } },
    { "step": "runPHP",
      "code": "<?php require '/wordpress/wp-load.php'; wp_insert_post( array( 'post_title' => 'テスト投稿', 'post_status' =>; 'publish' ) );" }
  ]
}

{

"landingPage": "/wp-admin/edit.php",

"preferredVersions": { "php": "8.3", "wp": "latest" },

"steps": [

{ "step": "login", "username": "admin", "password": "password" },

{ "step": "installPlugin",

"pluginData": { "resource": "wordpress.org/plugins", "slug": "contact-form-7" } },

{ "step": "runPHP",

"code": "<?php require '/wordpress/wp-load.php'; wp_insert_post( array( 'post_title' => 'テスト投稿', 'post_status' =>; 'publish' ) );" }

]

}

このJSONを公開URLに置いて ?blueprint-url= で指定するか、Base64にしてURLのハッシュに埋め込めば、誰が開いても同じ状態のWordPressが立ち上がります。runPHP でWordPressの関数を使うときは、先に wp-load.php を読み込む点だけ忘れないでください。GitHubのリポジトリから直接読み込むリソース指定もあり、ZIPを作らずに開発中のブランチを試せます。

私自身、独自プラグインを150個以上開発してきましたが、お客様への提案時に「実際に動く画面」をお見せできるかどうかで、話の進み方が大きく変わります。デモ用サーバーを用意していた場面が、Blueprint入りのURLを1本送るだけで済むのは、制作側にとって小さくない変化です。

まとめ｜WordPress Playgroundは「試す」ハードルを下げるツール

WordPress Playgroundは、サーバーなしでWordPressを起動できる公式ツールで、2026年9月からは公式Code ReferenceのPHPコード例をそのまま実行する土台にもなりました。仕組みはコアのDocBlockに「php interactive」と書かれた例を php-snippet というWebコンポーネントが実行するもので、同じ部品を自分のサイトにも埋め込めます。データが残らない前提で、関数の挙動確認・PHPバージョン別のプラグイン検証・Blueprint付きURLでの提案共有に使うのが正しい付き合い方です。実行例はまだ2つですが7.2以降で増える予定なので、「公式ドキュメントで読んで、その場で動かす」が当たり前になっていくはずです。フックをこれから学ぶ方は、アクションフックとフィルターフックの解説記事も合わせてどうぞ。

「本番サイトにこのプラグインを入れて大丈夫か判断してほしい」「自社向けのプラグインを作ってほしい」「開発チームに相談できる相手が欲しい」という場合は、カスタマイズ・プラグイン開発や、いつでも技術相談ができる顧問エンジニアサービスで承っています。自分で作れるようになりたい方には、Udemyのプラグイン開発講座もご用意しています。まずは無料相談からお気軽にどうぞ。

この記事を書いた人

矢部敦合同会社Edel Hearts 代表

WordPress専門の開発会社を経営。プラグイン開発・カスタマイズ・保守を専門とし、18時間におよぶUdemyのWordPress講座を開講。出典付きで回答するAIチャットボット「Edel AI Hybrid Chat」開発者。著書『WordPress はじめての最小プラグイン』（Kindle）。本ブログの記事は、実際の開発・運用で得た一次情報をもとに執筆しています。会社情報はこちら