Open10

@wp-now/wp-now

hidetaka okamotohidetaka okamoto
yarn wp-now start
yarn run v1.22.19
$ /Users/hideokamoto/sandbox/wordpress/node_modules/.bin/wp-now start
You are running Node.js version 16, but this application recommends at least Node.js 18 and isn't guaranteed to work on lower versions. Please upgrade your Node.js version.
Starting the server......
directory: /Users/hideokamoto/stripe/sandbox/wordpress
mode: playground
php: 8.0
wp: latest
Downloading WordPress latest...
Downloading SQLite...
hidetaka okamotohidetaka okamoto

プラグインも入れれる。

これは~/.wp-now/配下に保存される。

$ ls -la ~/.wp-now/wp-content/playground/plugins/
total 16
drwxr-xr-x   7 hideokamoto  staff   224  6  9 09:33 .
drwxr-xr-x  10 hideokamoto  staff   320  6  9 09:33 ..
drwxr-xr-x  16 hideokamoto  staff   512  6  9 09:31 akismet
drwxr-xr-x  13 hideokamoto  staff   416  6  9 09:33 health-check
-rw-r--r--   1 hideokamoto  staff  2578  6  9 09:31 hello.php
-rw-r--r--   1 hideokamoto  staff    28  6  9 09:31 index.php
drwxr-xr-x   2 hideokamoto  staff    64  6  9 09:31 sqlite-database-integration
hidetaka okamotohidetaka okamoto

プラグイン開発

空ファイルを置いておくと、勝手に認識してくれる。

% touch hello-wp-now.php

hello-wp-now.php

<?php
/*
Plugin Name: Hello wp-now
*/
hidetaka okamotohidetaka okamoto

雑に壊したら、ちゃんと壊れた。

<?php
/*
Plugin Name: Hello wp-now
*/

throw new Error("dummy");

hidetaka okamotohidetaka okamoto

おぉー

<!DOCTYPE html>
<html>
	<head>
		<title>WordPress Playground</title>
	</head>
	<body>
		<iframe id="wp" style="width: 1200px; height: 800px"></iframe>
		<script type="module">
			import { startPlaygroundWeb } from 'https://unpkg.com/@wp-playground/client/index.js';

			const client = await startPlaygroundWeb({
	            iframe: document.getElementById('wp'),
				remoteUrl: `https://playground.wordpress.net/remote.html`,
				blueprint: {
					landingPage: '/wp-admin/',
					preferredVersions: {
						php: '8.0',
						wp: 'latest',
					},
					steps: [
						{
							step: 'login',
							username: 'admin',
							password: 'password',
						},
						{
                            step: 'installTheme',
                            themeZipFile: {
                                resource: 'wordpress.org/themes',
                                slug: 'lightning',
                            },
                        }
					],
				},
			});
		</script>
	</body>
</html>
hidetaka okamotohidetaka okamoto

上のHTMLページにアクセスすると、iframeで指定したテーマを適用したWordPressが立ち上がる。

hidetaka okamotohidetaka okamoto
						{
							step: 'installPlugin',
							pluginZipFile: {
								resource: 'wordpress.org/plugins',
								slug: 'vk-all-in-one-expansion-unit',
							},
						}

でプラグインも入れれる

hidetaka okamotohidetaka okamoto

デモサイト用にWP立てる必要なくなったのでは。
こいつをPRサイト・販売サイトにiframeで埋め込めば終わる。