WordPress の静的化で、書き出しプラグインを自社開発した理由
公開 有限会社カルフ 栗山
WordPress のサイトを静的な HTML に書き出すプラグインは、いくつか公開されています。サイトのページを順にたどって保存してくれるので、小さなサイトであれば手軽に静的化できます。
ただ、実際の企業サイトで試してみると、そのままでは公開できない問題がいくつも出てきました。そこで当社では、書き出し用のプラグインを自社で開発し、サイトごとに調整して使っています。この記事では、作業の中で気づいた点と、その対応をまとめました。
1. 何を書き出すかを、先に決める
汎用の書き出しは、リンクやサイトマップをたどって、見つかったページを片端から保存するのが基本です。試したところ、次のようなことが起きました。
- 使われていない一覧ページが大量に出る：作者別の一覧など、サイト上ではどこからもリンクしていないページまで書き出されます。
- 同じ内容のページが量産される：テーマによっては、一覧の2ページ目以降も1ページ目と同じ内容を返します。それが別のページとして何百も保存されます。
- 必要なページが漏れる：リンクされていないページは、たどれないので書き出されません。
そこで、書き出すページの種類（記事、固定ページ、カテゴリ一覧など）をサイトごとに宣言し、宣言したものだけを書き出す方式にしました。ページ送りは実際に取得して終わりを確かめ、内容が同じページは除きます。宣言にないページへのリンクが見つかったときは、自動で書き出さずに一覧にして報告し、出すかどうかを人が判断します。
作者別の一覧は、URL に管理者のログイン名が入ることがあります。初期設定のままでは出さないようにしています。
2. 「もっと見る」や検索のように、WordPress に問い合わせる機能
ページを開いた後に、ブラウザから WordPress にデータを問い合わせる機能は、そのままでは動きません。静的なサイトには、問い合わせに答えるプログラムがないためです。
「もっと見る」ボタン・絞り込み
ボタンを押すと、?page=2 のようなクエリ付きの URL で続きを読み込む作りがよくあります。静的なサイトでは、クエリによって中身を変えられません。
当社のプラグインでは、必要な組み合わせをあらかじめ別のファイルとして書き出し、各ページに小さなスクリプトを差し込んで、読み込み先の URL をそのファイルに読み替えます。テーマ側の JavaScript は書き換えずに済みます。ただし、絞り込みの組み合わせが非常に多い場合は、書き出すファイルが膨大になるため、別の作り方を相談します。
サイト内検索
WordPress の検索は、そのたびにデータベースを検索しています。静的化したサイトでは、書き出しのときに検索用の索引を作っておき、ブラウザの中で検索する仕組み（Pagefind）に置き換えます。
ここでも調整が必要でした。全記事に共通する文言やサイドバーまで索引に入ると、関係のない記事まで検索にかかります。日本語は単語の区切りを扱える設定にしないと、うまくヒットしません。索引に入れる範囲を記事の本文に絞るなど、サイトに合わせて設定します。
お問い合わせフォーム
フォームの送信先も別に用意する必要があります。詳しくは「WordPress を静的化すると、お問い合わせフォームはどうなる？」にまとめています。
3. URL を壊さない
静的化では、編集用の WordPress を別のアドレス（例：wp.example.co.jp）に移し、公開用のアドレス（www.example.co.jp）には書き出した HTML を置く構成がよく使われます。
書き出したページには編集用のアドレスが残っているため、置き換えが必要です。汎用のツールでは、アドレスを消して「/about/」のような相対的な書き方にするものがあります。ところが、検索エンジン向けの正規 URL（canonical）や、SNS で共有したときの情報（OGP）、構造化データは、完全なアドレスでないと正しく働きません。
そのため、アドレスは消さずに編集用から公開用へ置き換えます。JavaScript の中では https:\/\/ のようにエスケープされた形で書かれていることもあるので、その形も対象にしています。
4. 公開してはいけないファイルを出さない
画像などを置く wp-content/uploads フォルダには、プラグインが作ったバックアップやログが置かれていることがあります。汎用のツールでこのフォルダを丸ごとコピーすると、データベースのバックアップのような、公開してはいけないファイルまで公開サイトに出てしまうおそれがあります。
当社のプラグインでは、HTML や CSS から実際に参照されている画像・ファイルだけを集めて書き出します。あわせて、書き出してはいけない場所をあらかじめ決めておきます。
5. 毎回同じ結果になるようにする
記事を更新するたびに書き出しをやり直します。そのとき、変わったファイルだけを公開サイトに反映し、WordPress で削除したページは公開サイトからも消すようにしています。
このためには、内容が変わっていないページは毎回まったく同じ HTML になる必要があります。ところが、ランダムに入れ替わるバナーや、閲覧数で変わる人気記事の一覧があると、書き出すたびに全ページが「変更あり」になります。こうした表示は、ブラウザ側で切り替える仕組みに変えることを相談します。
6. 既存のサイトと同居させる
長く運用しているサイトでは、公開フォルダに WordPress 以外のファイルが置かれていることがよくあります。過去のキャンペーンページや、別に作った小さなプログラムなどです。
書き出したファイルで公開フォルダを丸ごと置き換えると、これらを消してしまいます。当社のプラグインは自分が書き出したファイルだけを記録して管理し、それ以外のファイルには触れません。WordPress 以外の部分は、静的化とは別に扱いを決めます。
このほか、マルチサイトの構成では、サイトごとに分けて書き出します。編集用の WordPress にパスワードをかけている場合も、書き出しのときだけ認証して取得できるようにしています。
7. まとめ
汎用の書き出しプラグインが悪いわけではありません。ページ数が少なく、動きのある機能を使っていないサイトであれば、十分に使えます。
一方で、長く運用してきた企業サイトでは、「何を出すか」「動きのある機能をどうするか」「出してはいけないものを出さない」「毎回同じ結果にする」「既存のファイルと同居させる」の判断が、サイトごとに必要になりました。当社がプラグインを自社で開発し、サイトに合わせて調整しているのはこのためです。
なお、会員機能や EC のように、静的化に向かない機能もあります。導入前の調査で、どの機能をどう扱うかを整理してからご提案します。