概要説明
WordPressページをhtmlに変換。Movable Type(ムーバブルタイプ)の再構築と同じように事前に作成したhtmlファイルを使用してWordPressページを表示を高速化させるカスタマイズ。html作成の除外設定も行えるためプログラム実行が必要なページは現在のWordPressにてページを表示させることも可能。
~ 目次 ~
- 1 WordPressをhtmlに変換することでDBへのアクセス、プログラム処理が実行されない
- 2 WordPressのページをhtmlに変換する
- 3 ドキュメントルートにhtmlファイル用のディレクトリを作成
- 4 絶対パスにて出力するように設定
- 5 htmlファイル作成ディレクトリを設定
- 6 変換させないページを指定
- 7 設定が完了したらhtmlファイルの作成
- 8 htmlファイルを作成しファイルが存在すればキャッシュファイルとして利用
- 9 通常の一般的なWordPress用のリダイレクト設定
- 10 静的なファイルが存在するかどうかの判定処理を追記
- 11 トップページはWordPress
- 12 htmlファイルの表示に切り替わっているかを確認
- 13 htmlファイル参照を解除したい場合
- 14 htmlに変換したうえでランダム表示などを行う場合
- 15 html変換処理が途中で動かなくなった場合
- 16 長時間html作成に時間がかかる場合はローカル環境で変換がオススメ
- 17 実行してもログエリアに何も表示されない場合
- 18 robots.txtに静的htmlのディレクトリを追加
- 19 スマートフォン実機でアクセスした時の表示速度がぜんぜん違う
WordPressをhtmlに変換することでDBへのアクセス、プログラム処理が実行されない
WordPressでコンテンツを作成して静的HTMLにてサイトを公開は効果的な手法です
ローカル環境やhtml作成用の別環境でhtmlを作成してFTPにてコンテンツを設置という使い方が一般的。セキュリティー面はこれが最強です
WordPressのページをhtmlに変換する
Simply Static html変換プラグイン
今回はサーバー上にhtmlファイルを作成して、表示させているページに該当するhtmlファイルが存在する場合はhtmlファイルを表示させるという内容の説明です
ドキュメントルートにhtmlファイル用のディレクトリを作成
絶対パスにて出力するように設定
htmlファイル作成ディレクトリを設定
変換させないページを指定
wp-json
wp-login.php
sitemap
contact
wp-content
wp-includes
archives
プログラムを実行したいページの除外したり、まずはお試しで一部のページだけ変換したいと行った場合に上記の設定を行います
設定が完了したらhtmlファイルの作成
htmlファイルが完成したら https://サイトドメイン/public_static/ にアクセスすることで静的htmlを確認できます
htmlファイルを作成しファイルが存在すればキャッシュファイルとして利用
静的なhtmlだけでも使用できますがURLを変更したり、apache,nginxにてドキュメントルートの設定変更が必要となります。今回は新しく作成したディレクトリにhtmlを作成しそのディレクトリ内に対応するhtmlがあればURLはそのままで表示させるファイルだけリダイレクトさせるようにします
.htaccessにて静的htmlが存在すればhtmlファイルを表示 存在しない場合はWordPressページを表示
通常の一般的なWordPress用のリダイレクト設定
<IfModule mod_rewrite.c> RewriteEngine On RewriteRule .* - [E=HTTP_AUTHORIZATION:%{HTTP:Authorization}] RewriteBase / RewriteRule ^index\.php$ - [L] RewriteCond %{REQUEST_FILENAME} !-f RewriteCond %{REQUEST_FILENAME} !-d RewriteRule . /index.php [L] </IfModule>
静的なファイルが存在するかどうかの判定処理を追記
%{DOCUMENT_ROOT}/public_static に静的htmlを出力する場合
<IfModule mod_rewrite.c> RewriteEngine On RewriteCond %{REQUEST_FILENAME} !-f RewriteCond %{DOCUMENT_ROOT}/public_static%{REQUEST_URI}/index.html -f RewriteRule . /public_static%{REQUEST_URI}/index.html [NC,L] </IfModule> <IfModule mod_rewrite.c> RewriteEngine On RewriteRule .* - [E=HTTP_AUTHORIZATION:%{HTTP:Authorization}] RewriteBase / RewriteRule ^index\.php$ - [L] RewriteCond %{REQUEST_FILENAME} !-f RewriteCond %{REQUEST_FILENAME} !-d RewriteRule . /index.php [L] </IfModule>
トップページはWordPress
検索処理やランダム表示などトップページでは複数の機能が動いている場合が多いのでトップページのhtml表示は今回は対象外にしています
htmlファイルの表示に切り替わっているかを確認
管理バーを表示させている環境の場合はhtmlページ表示になっていると管理バーが表示されないので判断できます。
public_static/内の対象のファイルを直接編集してFTPでアップロードすることで変更内容が表示されればhtmlを使用していることが確認できます。
htmlファイル参照を解除したい場合
.htaccessの記述をもとに戻すか public_static ディレクトリをリネームまたは削除することでhtml表示を解除することが出来ます
htmlに変換したうえでランダム表示などを行う場合
該当箇所をphpではなくjavascriptの制御に変更することで対応することが出来ます
html変換処理が途中で動かなくなった場合
実行時間が長くなってしまう場合は途中で止まることがあります
リロードして大丈夫なのでリロードで処理を再開できます。
長時間html作成に時間がかかる場合はローカル環境で変換がオススメ
サーバーに長時間負荷を与えることになるので、コンテンツボリュームの多いサイトはローカル環境でhtml作成を行い作成したhtmlをサーバーにアップするようにしましょう。
実行してもログエリアに何も表示されない場合
他のプラグインやセキュリティー関連の対応にて必要な制御が無効になっている可能性があります
<Files ~ "^admin-ajax.php$"> allow from all </Files> <Files ~ "^admin-post.php$"> allow from all </Files>
wp_admin/.htaccess に上記内容を反映してみて動きが変わるかを確認
上記の対応で変化がない場合は設定を元に戻しておきましょう
robots.txtに静的htmlのディレクトリを追加
User-agent: * Disallow: /wp-admin/ Allow: /wp-admin/admin-ajax.php Disallow: /public_static/ Sitemap: https://functions.fs-create.net/sitemap.xml
スマートフォン実機でアクセスした時の表示速度がぜんぜん違う
プログラム処理やDB接続がない状態の静的htmlページをスマートフォンで確認した時の表示スピードはびっくりするくらい早くなりました