HEADLESS
教育関連のサイトで、管理画面と公開側を別々のドメインに分けた
更新が公開されるまで
BEFOREWordPress の標準
- 管理画面で更新する
- テーマがそのまま公開画面を描く
AFTER分けた構成
- 管理用の別ドメインで更新する
- 画像は公開側へ直接保存される
- 公開側の中継の窓口がデータを取りに行く
- 公開側のテンプレートが表示する
構成の違い
| BEFOREWordPress の標準 | AFTER分けた構成 | |
|---|---|---|
| 管理画面の場所 | 公開サイトと同じドメイン | 別のドメイン |
| 公開側の画面 | テーマとプラグインが描く | HTML と PHP |
| 画像の反映 | — | 保存した時点で公開側に入る(時間差なし) |
| 問い合わせの受付 | WordPress が直接受ける | 公開側の中継の窓口で受ける |
| 閲覧者から見える管理側の場所 | 見える | 見えない |
| 更新する方の画面 | WordPress のメニュー全部 | 「お知らせ・ブログ・更新管理」に整理 |
こまかな作り込み
分ける仕組み6項目
- 公開側に、同じドメインの中継の窓口を置く。閲覧者のブラウザから、管理側は直接呼ばない
- 窓口の名前も、管理側が分からない名前に
- 返すデータの中の画像の URL を、公開側のものへ書き換え
- 画像は、最初から公開側の場所に保存(同期の処理なし)
- 管理側のトップや記事の URL へ来たら、公開側へ転送
- 管理側から取れないときは、HTML の初期の内容を表示
更新する方の画面6項目
- 専用のメニュー「更新管理」。タブで、画像・実績・動画・料金を編集
- 実績と料金の表は、行の追加と削除で編集
- 動画は、埋め込みのタグを貼るだけ
- タグの欄や分類の追加など、使わないものは出さない
- 一覧の「表示」のリンクは、公開側の URL へ向ける
- 公開のときとほぼ同じ見た目の、確認用の画面
フォームと検索エンジン5項目
- 公開側の自前のフォームから、中継の窓口を通して、管理側の受付の処理へ
- 送信中・完了・エラーの表示と、二重の送信の防止
- 記事の本文は画面で描くが、タイトル・説明・構造化データはサーバー側で出す
- 料金の行から、料金の構造化データを自動で作る
- 中継の窓口と確認用の画面は、検索の対象の外に
引き渡し3項目
- 更新する方向けの運用の案内
- 同じ種類の案件で、最初に決める10項目のチェックリスト
- デザインのデータから実装までの、5段階の判断の手順



