2020年7月8日 【WordPress】パターン別!実ファイル・物理ファイル・ディレクトリとの共存【応用編】 WordPress 検索する Popular tags 生成AI(Generative AI) Looker Studio BigQuery AlloyDB Google Workspace 事例紹介 Cloud SQL Category 技術開発 Author まるたけ SHARE Content こんにちは!まるたけです。 本記事では、WordPressと実ファイル(静的ファイル/物理ファイル)、実ディレクトリを共存させる際の、よくある応用パターン3選をご紹介します。 ・はじめに ・ケース1.サブディレクトリにWordPressをインストールする ・ケース2.実ディレクトリ配下でWordPressのページを表示する ・ケース3.トップページを静的HTMLにする ・まとめ はじめに URL・ファイルの例です。 セットアップ済みのWordPressを使って見て行きます。 ドメイン test.my-homepage.local パーマリンク設定 /%category%/%post_id%/ カテゴリスラッグ colors カテゴリURL test.my-homepage.local/colors/※上記パーマリング・カテゴリスラッグの設定で、 このようなURLが動的に生成されます 実ファイル/静的ファイル(トップページ用) index.html ケース1.サブディレクトリにWordPressをインストールする 【ケース】 ・ドキュメントルート直下に散らかってしまうので、WordPressを別の場所に置きたい ・WordPressのファイルを任意の場所に置き、ドメイン直下のURLでWordPressを動かしたい ・WordPressをサブディレクトリに置いて、動かせるの? 図1-1.WordPressをドキュメントルート直下に設置する場合 【手順1】WordPressインストールディレクトリにファイルを設置 サブディレクトリ「wp」を作って、そこにWordPressのファイル一式を置きます。 図1-2.サブディレクトリにWordPressファイル一式を設置 【手順2】WordPressアドレスとサイトアドレスを設定 図1-3.一般設定の画面 ※ここがポイント! ・WordPressアドレスはWordPressをインストールしたURLである 例)http://test.my-homepage.local/wp ・サイトアドレスはWordPressとして動かしたいURLである 例)http://test.my-homepage.local ・それぞれに末尾スラッシュ(トレイリングスラッシュ)は付けないこと 【手順3】ドキュメントルートに「index.php」「.htaccess」を設置する WordPressインストールディレクトリにある「index.php」「.htaccess」をドキュメントルートにコピーします。 図1-4.ファイルのコピー&ペースト 【手順4】「index.php」を編集する 「index.php」はWordPressのファイル「wp-blog-header.php」を呼び出しています。 今回の例では、WordPressインストールディレクトリを「wp」に変えたので、パスを以下のように修正します。 define('WP_USE_THEMES', true); /** Loads the WordPress Environment and Template */ require( dirname( __FILE__ ) . '/wp/wp-blog-header.php' ); index.phpの修正例 ブラウザでトップページ「/」にアクセスします。 ここでは、例として「test.my-homepage.local/」をトップページとします。 あらかじめ用意したトップページが表示されればOKです! 図1-5.トップページの表示例 ケース2.実ディレクトリ配下でWordPressのページを表示する 【ケース】 ・静的ページをWordPressに移したいが、URL構造をそのままに保ち、ページを移行したい ・WordPressで作ったサイトに 実ディレクトリ/物理ディレクトリを作成したら、WordPressのページが表示されなくなった ・WordPressのメディアディレクトリ「uploads」に画像ファイルを置かず、 任意のディレクトリに画像ファイルを置いてページを表示させたい 【手順1】ディレクトリとファイルの設置 カテゴリ一覧「colors」と同名のディレクトリを作成します。 その中に、あらかじめ用意した画像ファイル一式を「images」ディレクトリへアップします。 図2-1.ディレクトリの例 この時点では「/colors/」を見てもページは表示されません。 それは、WordPress内では、実ディレクトリ(物理ディレクトリ)が優先されるためです。 ※詳細な実例は、【WordPress】どちらが優先?実ファイル・実ディレクトリとの共存のケース3をご参照ください。 【手順2】実ディレクトリに「index.php」を設置 ケース1と同様に、/var/www/html/colors/ の下に、index.phpを設置します。 図2-2.ファイルのコピー&ペースト 【手順3】「index.php」を編集する ケース1と同じように「index.php」に書かれている「wp-blog-header.php」のパスを修正します。 WordPressインストールディレクトリ「wp」を例にしているので、パスを以下のように修正します。 define('WP_USE_THEMES', true); /** Loads the WordPress Environment and Template */ require( dirname( __FILE__ ) . '/../wp/wp-blog-header.php' ); index.phpの修正例 ブラウザでカテゴリ一覧ページにアクセスします。 ここでは、例として「test.my-homepage.local/colors/」をカテゴリ一覧ページとします。 WordPressのカテゴリ一覧が表示され、画像のパスが任意ディレクトリを参照できていればOKです! 図2-3.カテゴリ一覧の表示 ケース3.トップページを静的HTMLにする 【ケース】 ・トップページだけはWordPressに組み込まずに、静的ページとして直接置きたい ・サイトリニューアルでWordPressを導入したいが、トップページ以外から少しずつ移行したい ・トップ(ドキュメントルート)にindex.htmlを置いたらWordPressが動かなくなった 【手順1】ディレクトリとファイルの設置&編集 「index.php」「.htaccess」をドキュメントルートにコピーし、「index.php」内のパスを修正します。 ※あらかじめケース1の手順でご準備ください。 図3-1.ドキュメントルートにファイル設置 【手順2】静的ファイル(index.html)の設置 あらかじめ用意したトップページ用の「index.html」をドキュメントルートにコピーします。 図3-2.ドキュメントルートに静的ファイル設置 この時点では、トップページ「/」を見るとページは表示されますが、WordPressとしては動作しません。 サーバの設定にもよりますが、インデックスファイルの優先順が「index.html」>「index.php」の場合は、静的ファイルが表示されます。 【手順3】「index.php」を編集する ドキュメントルートにある「index.php」を編集します。 以下の条件を入れて静的ファイルと動的処理を分けてみます。 ※ここがポイント! ・トップページを表示したい場合は、URLを判別して静的ファイルを読み込む ・それ以外は、動的処理させる(WordPressの後続処理が動くようにする) if($_SERVER["REQUEST_URI"]==="/" ){ require_once("./index.html"); //静的ページを読み込む exit; }else{ define('WP_USE_THEMES', true); /** Loads the WordPress Environment and Template */ require( dirname( __FILE__ ) . '/wp/wp-blog-header.php' ); } サンプルコード ブラウザでトップページ「/」にアクセスします。 ここでは、例として「test.my-homepage.local/」をトップページとします。 あらかじめ用意した静的ページの内容が表示されればOKです! 図3-3.トップページの表示例 まとめ WordPressで実ファイル/物理ファイル・ディレクトリを共存させる応用パターンについてのまとめです。 ・WordPressの「ページURL」と「任意のディレクトリ名」が同じであってもWordPressのページは表示できる! ・任意のディレクトリを作りつつ、WordPressを動かしたい場合は、WordPressトップ用のindex.phpを使おう ・ディレクトリのパスに応じて、index.phpで読み込んでいる「wp-blog-header.php」のパスも修正しよう ・トップページだけ静的ファイルを表示することもできる! 「静的ファイルとWordPressが混在するケース」や、「徐々にWordPressページに切り替えるケース」、 「部分的にCMS化」などでお使いいただけますので、ぜひお試しください。 関連記事 【WordPress】対策済み?セキュリティ診断をしてみよう【チェック編】 by まるたけ on 2021年4月23日 【WordPress】どちらが優先?実ファイル・実ディレクトリとの共存 by まるたけ on 2020年6月22日 頂きましたご意見につきましては、今後のより良い商品開発・サービス改善に活かしていきたいと考えております。 良く分かった 分からなかった もっと知りたい 役に立った 興味が出た WordPressが好きになった Togetherしたい! 次回もよろしく Author まるたけ 株式会社システムサポート BSG事業部 2016年中途入社。 Webシステムの構築を得意とし、現在はプリセールス領域やビジネス検討で活動中。 お仕事の後は「カラオケ部長」になることも。 WordPress 2020年7月8日 【WordPress】パターン別!実ファイル・物理ファイル・ディレクトリとの共存【応用編】 Category 技術開発 前の記事を読む 【4コマ漫画】SEひつじは定時退社の夢を見る ~アラートメール~ 次の記事を読む 【GCP】日本初!GCVEの実力を検証♪(ウェビナーのお知らせ:2020/9/29) Recommendation オススメ記事 2023年9月5日 Google Cloud 【Google Cloud】Looker Studio × Looker Studio Pro × Looker を徹底比較!機能・選び方を解説 2023年8月24日 Google Cloud 【Google Cloud】Migrate for Anthos and GKEでVMを移行してみた(1:概要編) 2022年10月10日 Google Cloud 【Google Cloud】AlloyDB と Cloud SQL を徹底比較してみた!!(第1回:AlloyDB の概要、性能検証編) BigQuery ML ワークショップ開催のお知らせ 生成AI導入支援パッケージ Discovery AI導入支援パッケージ Google Cloud ホワイトペーパー 新着記事 2024年10月9日 イベント・セミナー 【参加無料】typeエンジニア転職フェア 出展のお知らせ(2024/10/12) 2024年10月4日 イベント・セミナー 【11/20開催】データ分析&活用ウェビナー(事例紹介付き) 2024年9月30日 Google Cloud 【Google Cloud】サーバレスでマネージドなサービス「Cloud Run」でアプリケーションを走らせよう! HOME 技術開発 【WordPress】パターン別!実ファイル・物理ファイル・ディレクトリとの共存【応用編】