WSLにWordPress載せてCloudflare Pagesで公開してみた

Cloudflareについて調べている流れでCloudflare PagesやヘッドレスCMSについて知り、GatsbyやHugoのスターターを試してみていて、ふとWSLでDBとか動かせばローカルでWordPress使えるだろうし、そこから静的ページ出力可能ならCloudflare Pagesで公開ってのもできるのかな?と思いついて。

調べたらCloudflareで解説ページがあったりしたので試してみました。その備忘録。
WordPress触るの○○年ぶりだわ。

LinuxやWebサーバーの仕組みについてある程度知っている事前提のメモ。

WSL

WLSにWordPressをインストール。
もともとWSL環境はあった。Ubuntuでしました。

WordPressの公式ドキュメントを参考にしたりしました。
https://ja.wordpress.org/support/article/before-you-install/

あとはこちらのページを参考に8ステップ目くらいまでしました。

WordPressをWindowsにインストールしてテスト環境を作る (WSL2.0使用)
https://note.com/hope_yes_joy/n/n5663deb8d871

適当に必要なパッケージは適宜 apt や snap でいれる。
必要に応じて sudo で実行。

MySQLのDBやユーザー、パスワードは適当に名称変更して作成、生成。
無事インストールできました。

WordPress

REST APIのエラーが解消されない

Apacheインストール時に rewrite mod が有効になってなかった。
→有効にした。

エラーが直らない。

apache2.conf で該当フォルダの AllowOverride が有効になっておらずWordPres制御下の .htaccess が利用されていなかった。
こちらを有効にして解消しました。

これでエラー解消されました。
あとは順調。

Simply Static(WordPressのプラグイン)

最初はお試しって意味もありこんな流れでウェブ公開してました。

  1. Simply Staticで静的ファイル化したブログをZIP保存。
  2. Cloudflare PagesのプロジェクトにZIPファイルをぽいっとドロップ。
  3. アップロードと回答を待つ。まぁまぁ待つ。
  4. 処理が終わったら「保存してデプロイ」を押す。押さないといけない。

(3)の待ちと(4)でボタンを押すのが面倒くさいのでGitHubと繋げてpushしたらデプロイまでは自動化したくなった。
あとこの方法だとads.txtとか上手く公開できなかったので。

このあたりが素人なのでこの形が正しいのかはわからないけれど以下のような感じでやりました。

Simply Staticのテンポラリフォルダと公開フォルダを分けました。
よくわからず最初同じパスを指定していたら毎回フォルダ内を全削除→再生成していて、こちらがWordPress介さず準備したものが消されてしまってたので。

Simply Staticの設定内容

General

Replacing URLs:Offiline Usage

Deploy

Deployment Settings:Local Directory
Local Directory:/aaa/bbb/public-html/

※この時gitは /aaa/bbb/.git/ って状態でした。

Misc

Temporary Files:TEMPORARY FILES DIRECTORY: /aaa/tmp/

※どうもこのパスに指定している中身が毎回消されてるぽい。

GitHub

/aaa/bbb/
で git add . やら push やら操作してました。

Cloudflare Pages

プロジェクト作成してGitHubと接続。
該当アカウントの該当リポジトリを指定して

ビルド コマンド: (空欄)
ビルド出力ディレクトリ: /
ルート ディレクトリ: /public-html/

としました。

Cloudflare Pagesでカスタムドメインの割当

使うにはネームサーバーをCloudflareのにしないといけないってんでちょっとビクビクしながらやりましたが無事動作してます。

ドメインを指定すると現状のDNS設定値が「ある程度コピー」されました。
全部じゃなかったので抜けたものを確認して必要に応じて設定追加。

もろもろ終わるとネームサーバー名が表示されるので、それをドメインレジストラ側でNSとして設定。
これでいけましたん。