WordPressと静的HTMLを共存させる方法

こんにちは。mito（@mito_works）です。

本家のサイトはwordpress。本家サイトのLPを作った場合にURLをWordpressと揃えたいためにWordpressと同じ場所にLPを配置したいということ、ありませんか？

mito

今回は、WordPressがアップされているサーバー上に静的HTMLを共存させる方法をまとめます。

サイト構成

現行サイトの影響範囲を最小限にしたかったので、まず、サイトトップ配下に固定ページを新規作成。その配下に今回作成した静的HTML(index.html)を配置させました。

ファイル構成

ルートディレクトリ配下は以下の通り。

今回は夏向け商材のLPだったので、WordPress上で固定ページseason-itemを作り、その配下に今回のページを置くことにしました。

summerフォルダに今回作成したソース全てを配置。

momo

この配置だけではまだ表示されないよ〜

固定ページを表示するための設定

先頭フォルダのindex.phpを静的ファイルのディレクトリseason-itemにコピー

コピーしたindex.phpの編集

/** Loads the WordPress Environment and Template */
require( dirname( __FILE__ ) . '/wp/wp-blog-header.php' );

/** Loads the WordPress Environment and Template */
require( dirname( __FILE__ ) . '/../wp/wp-blog-header.php' );

mito

この状態でhttp://ドメイン名/season-item/にアクセスするとリダイレクトループになってしまいます。。

momo

今回は、この転送先がループしてしまっているのでソースの修正が必要だよ！

リダイレクトループを回避

リダイレクトループを回避するためにfunctions.phpに以下を追加。

remove_filter('template_redirect', 'redirect_canonical');

追加場所を間違えると、サイト自体が全く動かなくなるので注意が必要です。
どこに追加すべきか迷ったとき、こちらを参考にさせていただきました！

momo

function.phpは各テーマのフォルダ内にあるよ！

【初心者向け】Wordpressのフォルダ構成〜基本構造を理解する〜こんにちは！ 最近、「Wordpressのテンプレートを自作できるようになりたい！」 と学びはじめたmito（@mito_works...

ABOUT ME

mito

こんにちは！mitoです。 フロントエンド開発、デザイン全般をやっているクリエイターです。 学ぶことと教えることが好きです。 子育てをする中で、自分の生活に働き方を合わせたいと思うようになり、2020年4月からフリーランスになりました。 好奇心旺盛でやりたいこと多め、ワクワクすると止まれない性格です。 同じように一緒にチャレンジする人の背中そっと押せたり、励ましあえるようなブログになるといいなと思っています。