STEP 03までのLPは、サーバーへ置いたHTMLをそのまま返す静的サイトでした。WordPressでは、アクセスされたURLに応じてPHPがテーマとデータベースを使い、HTMLを生成します。
WordPressがページを表示する流れ
WordPressは、テーマだけでなくデータベースやプラグインの情報も組み合わせてページを作ります。
ブラウザからURLへアクセスがあると、Webサーバー上のWordPressがURLに合う内容をデータベースから取得します。その内容をテーマのテンプレートへ組み込み、完成したHTMLをブラウザへ返します。
静的サイトでは作成済みのHTMLを返すのが基本でした。WordPressでは、投稿本文や設定とテンプレートを組み合わせてHTMLを生成するため、管理画面から内容を更新できます。
- ブラウザがWordPressサイトへHTTPリクエストを送る
- WordPressがURLの種類を判断する
- 必要な投稿や設定をデータベースから取得する
- テーマのPHPファイルでHTMLを生成する
- 生成したHTMLをHTTPレスポンスとして返す
ファイルとデータベースに保存されるもの
WordPressサイトは、ファイルだけでもデータベースだけでも動きません。両方がそろって初めて、同じ内容と見た目を再現できます。
次の図では、「ファイルとデータベースに保存されるもの」の仕組みや関係を確認できます。
- ファイル：WordPress本体、テーマ、プラグイン、アップロード画像
- データベース：投稿本文、固定ページ、ユーザー、メニュー、各種設定
- 設定ファイル：データベースへの接続情報など
管理画面から登録した画像の実体はファイルとして保存されますが、画像のタイトルやURLなどの情報はデータベースにも保存されます。公開時に両方を移行する理由はここにあります。
WordPress本体・テーマ・プラグインの役割
WordPress本体は、管理画面、投稿の保存、ユーザー管理など、サイトを動かす土台です。テーマは表示するHTMLやCSSを担当し、プラグインはお問い合わせフォームなどの機能を追加します。
次の図では、「WordPress本体・テーマ・プラグインの役割」の仕組みや関係を確認できます。
WordPress本体のファイルを直接編集すると、更新時に変更が消えたり、サイト全体が動かなくなったりします。制作する見た目はテーマへ、追加機能は必要に応じてプラグインへ分けます。
投稿と固定ページの違い
投稿は、お知らせやブログのように継続して追加し、一覧やカテゴリーで整理する内容に使います。固定ページは、会社概要やお問い合わせのように単独で配置する内容に向いています。
次の図では、「投稿と固定ページの違い」で押さえる違いを左右で比較しています。
どちらも本文を保存できますが、用途に合う種類を選ぶと、一覧ページやURLを管理しやすくなります。制作前に、各ページを投稿と固定ページのどちらで管理するか決めてください。
制作で変更する範囲を決める
この教材ではWordPress本体を直接編集しません。オリジナルテーマの中へPHP、CSS、JavaScript、画像を置き、投稿内容は管理画面から登録します。
このレッスンで確認すること
- WordPressがデータベースの内容とテーマを組み合わせてHTMLを作ること
- サイトの復元にはファイルとデータベースの両方が必要なこと
- 本体・テーマ・プラグインの役割が異なること
- 更新する内容に応じて投稿と固定ページを使い分けること