WordPress高速化するのため、PHPのキャッシュ機能パッケージであるOPcacheとAPCuをインストールする。

因みに、サーバの設定とかせずにVPSやクラウド上のWordPressサイトを高速化したい場合は、「KUSANAGI」というCMS高速化に特化した実行環境がある。

インストール前後のPage Speed Insightsスコア比較

OPcacheとAPCuをインストールする前と後のPage Speed Insightsスコア。

OPcacheとAPCuインストール前

OPcacheとAPCuインストール後

スコアが劇的にアップしたわけではないが、体感的にもインストール後の方が表示速度は早くなったと感じられた。

OPcacheとAPCuをインストール

OPcacheとAPCuをインストールしていく。

環境は、さくらのVPS、CentOS 7、Nginx 1.17、PHP7.4。

以下のコマンドでインストール。

yum -y install --enablerepo=remi,remi-php74 php-opcache php-pecl-apcu

インストールが完了したらphp -vで確認。

php -v
PHP 7.4.7 (cli) (built: Jun  9 2020 10:57:17) ( NTS )
Copyright (c) The PHP Group
Zend Engine v3.4.0, Copyright (c) Zend Technologies
    with Zend OPcache v7.4.7, Copyright (c), by Zend Technologies

上記のように、with Zend OPcache v7.4.7となっていればOK。

php-fpmとnginxの再起動して有効化

php-fpmとnginxを再起動するため、以下のコマンドを入力。

systemctl restart php-fpm
systemctl restart nginx

環境は以下

• さくらのVPS
• CentOS 7
• Nginx 1.17
• PHP 7.4
• MariaDB

※VPSでなくレンタルサーバーサービスならコントールパネルといった管理画面から簡単に入れられると思う。

zipモジュールは、php-pecl-zipを入れればよい。

yum --enablerepo=remi,remi-php74 install php-pecl-zip

最後に、php-fpmを再起動。

systemctl restart php-fpm

WordPressの管理画面に戻って、テスト通過されていることが確認できればOK。

環境は以下

• さくらのVPS
• CentOS 7
• Nginx 1.17
• PHP 7.4
• MariaDB

※VPSでなくレンタルサーバーサービスならコントールパネルといった管理画面から簡単に入れられると思う。

perlコマンドを使えるようにするため、php-pear php-develをインストール。

yum install --enablerepo=remi,remi-php74 php-pear php-devel

次に、imagickをインストール

pecl install imagick

/etc/php.d/の下に30-imagick.iniというiniファイルを作成し編集していく。

vi /etc/php.d/30-imagick.ini

そして、ファイルへ以下の記述をする。

; Enable imagick extension module
extension=imagick.so

最後に、php-fpmを再起動。

systemctl restart php-fpm

WordPressの管理画面に戻って、テスト通過されていることが確認できればOK。

さらに、子テーマを配置してカスタマイズ変更を行っている。

なぜ子テーマを使うか

基本的なことだが、なぜ子テーマを使用するのかについて。

親テーマを編集しているとテーマのアップデート時にその編集内容がすべて吹っ飛んでしまうためである。

サブディレクトリ以下のPHPファイルも子テーマで変更制御したい

親テーマのスタイルシート（style.css）を上書きしたい場合は、子テーマディレクトリ直下に同ファイル名のスタイルシート（style.css）配置して、それを編集すればよい。

しかし、親テーマディレクトリのinc/template-tags.phpの内容を子テーマが側で変更しようと、子テーマディレクトリへ同ファイル名のinc/template-tags.phpを入れて編集しても変更内容が反映されない。

このような場合は、子テーマのfunctions.phpへ変更したいソースコードを書く。

例えば、親テーマディレクトリのinc/template-tags.php内のfunction twentyseventeen_time_link()という関数の内容を上書きしたい場合、その該当ソースコードだけを子テーマディレクトリのfunctions.phpにコピペして、変更したい箇所だけ修正すればいよい。

変更例として、投稿日が更新日より新しい日付の場合は更新日を表示させないというカスタマイズ変更をやっていく。

まず、子テーマディレクトリのfunctions.phpにfunction twentyseventeen_time_link()の内容を貼り付ける。

子テーマのfunctions.phpの編集

function twentyseventeen_time_link() {
    $time_string = '<time class="entry-date published updated" datetime="%1$s">%2$s</time>';
    if ( get_the_time( 'U' ) !== get_the_modified_time( 'U' ) ) {
        $time_string = '<time class="entry-date published" datetime="%1$s">%2$s</time><time class="updated" datetime="%3$s">%4$s</time>';
    }

    $time_string = sprintf(
        $time_string,
        get_the_date( DATE_W3C ),
        get_the_date(),
        get_the_modified_date( DATE_W3C ),
        get_the_modified_date()
    );

    // Wrap the time string in a link, and preface it with 'Posted on'.
    return sprintf(
    /* translators: %s: Post date. */
        __( '<span class="screen-reader-text">Posted on</span> %s', 'twentyseventeen' ),
        '<a href="' . esc_url( get_permalink() ) . '" rel="bookmark">' . $time_string . '</a>'
    );
}

この中の、

if ( get_the_time( 'U' ) !== get_the_modified_time( 'U' ) ) 

という箇所を以下のように変更する。

if ( get_the_time( 'U' ) < get_the_modified_time( 'U' ) ) 

これで投稿日が更新日より新しい日付の場合は更新日を表示できないよう反映できた。

こうすることで、親テーマincサブディレクトリ内のファイルも汚さずに、子テーマ側でカスタマイズ変更がすることができる。

最終更新日を表示には？

最終更新日を表示させるには、CSSを編集するだけ。

そもそも最終更新日は画面上に出力されているのだが、CSSのdisplay: noneで非表示にされている。

以下のCSSを追加すればよい。

style.css

time.updated:not(.published) {
    display: inline;
    margin-left: 1em;
}

※CSSを追加するなどWordPressテーマのカスタマイズをする場合は、子テーマを作成してファイルの上書きをすることをオススメする。そうしないと、WordPressテーマを更新するとカスタマイズした内容がすべてふっとんでしまう。

そうすると投稿日の右に最終更新日が表示される。

予約投稿すると投稿日より更新日が昔になってしまう問題

とりあえず最終更新日を表示することはできた。

しかし、予約投稿した場合、投稿日は予約投稿日に設定した日になるが更新日は記事を作成した日になるため、投稿日より更新日が昔になってしまう、なんとも気持ち悪いことになる。

これを解決するには、WordPressテーマフォルダにある「template-tags.php」を編集する必要がある。

template-tags.phpを開いて、function twentyseventeen_time_link()内を変更していく。

template-tags.phpの変更を子テーマ側でしたい場合は、style.cssで変更する場合とやり方少し異なるので以下の記事を参照。

https://blog.pop-web.net/programming/child-theme-directory-overwrite/

blog.pop-web.net

template-tags.php

if ( get_the_time( 'U' ) !== get_the_modified_time( 'U' ) ) {

の部分を

if ( get_the_time( 'U' ) < get_the_modified_time( 'U' ) ) {

とする。

これで更新日が投稿日より昔の場合には表示されないようになる。

また、初投稿した記事の場合、投稿日と更新日が同じ日として表示される。

記事を更新していないのに、更新日として表示されるのが嫌だって場合は、先ほど修正したtemplate-tags.phpの内容を以下のようにif文のif(get_the_date() == get_the_modified_date())を追加する。

    if ( get_the_time( 'U' ) < get_the_modified_time( 'U' ) ) {
        $time_string = '<time class="entry-date published" datetime="%1$s">%2$s</time><time class="updated" datetime="%3$s">%4$s</time>';
        if(get_the_date() == get_the_modified_date()){
          $time_string = '<time class="entry-date published updated" datetime="%1$s">%2$s</time>';
        }
    }

つまり、日付が同じ場合は投稿日だけ表示させるロジックをさらに追加しているのだ。

これで、投稿日と更新日が同じ日の場合には更新日が表示されなくなる。

WordPressのサイトが「現在メンテナンス中のため、しばらくの間ご利用いただけません。」としか表示されなくなってしまった。

解決方法

解決方法としては、サーバにある「.maintenance」を削除するだけ。

「.maintenance」のある場所

WordPressを設置しているサーバへFTPツールで接続し、WordPressファイル群がある公開ディレクトリ直下に移動。

そこに「.maintenance」がある。

環境は以下

• さくらのVPS
• CentOS 7
• Nginx 1.17
• PHP 7.4
• MariaDB

※Webサーバ環境構築については、【さくらVPS】CentOS7+Nginx+PHP7+MariaDBの環境構築を参照。

原因について

調べてみると、管理画面の「設定」→「パーマリンク設定」で共通設定を基本以外を選択しているとエラーがでるが、基本にするとちゃんと投稿される。

これはNginxのデフォルトの設定だと、パーマリンクのURL変更が出来ないこと原因らしい。

Nginxの設定を変更することで解決

Nginxの設定ファイルである/etc/nginx/conf.d/default.confを以下のように変更することで解決できる。

※各自default.confの設定が異なる場合があるので、以下の内容を使用する場合は、各自の環境に合わせていく必要がある。

server {
    listen 80;
    server_name { ドメイン名 };
    root /home/www/{ ドメイン名 }/wordpress;
    index index.php

    charset utf-8;

    location / {
        try_files $uri $uri/ @wordpress;
    }

    location ~ \.php$ {
        try_files $uri @wordpress;
        fastcgi_index index.php;
        fastcgi_split_path_info ^(.+\.php)(.*)$;
        fastcgi_pass  127.0.0.1:9000;
        fastcgi_param SCRIPT_FILENAME  /home/www/{ ドメイン名 }/wordpress$fastcgi_script_name;
        include       fastcgi_params;
    }

    location @wordpress {
        fastcgi_index index.php;
        fastcgi_split_path_info ^(.+\.php)(.*)$;
        fastcgi_pass  127.0.0.1:9000;
        fastcgi_param SCRIPT_FILENAME /home/www/{ ドメイン名 }/wordpress/index.php;
        include       fastcgi_params;
    }

    error_page 404 /404.html;
    location = /40x.html {
    }

    error_page 500 502 503 504 /50x.html;
    location = /50x.html {
    }
}