Last update date: April 10, 2023
先日、久々にサーバーのメンテナンスを行いました。
去年の暮まで、何気なくWordPressとPHPのバージョンアップを繰り返していたのですが、幾つかのプラグインが動かなくなっている事に気が付きました。
他のプラグインも更に検証したところ、WordPressのテーマのプラグイン（ホームページビルダー20より提供された”social_buttons.php”）に記述されたJavaスクリプトにも時代遅れの記述が見つかりました。
⚙️ 旧「いいね！ボタン」の修正
上記画像は、ジャストシステム（日本IBMから移管）が提供するテーマのプラグイン「hpbダッシュボード」ですが、もう４年以上も更新がないため、テーマに関連するプラグインの不具合は、どうやら自分でメンテナンスするしか選択肢は無いものと思われます。
そこで、以下の通りそれらの問題に対処するための作業を実施しました。
先ずは、上記画像のFacebookの「いいね！」ボタンですが、テーマのプラグイン hpb Dashboard （”hpbtool”）からコールされるプログラム “social_buttons.php” に以下の Java スクリプトが記述されているのを確認しました。
バージョン1.0とあるので、この記述は旧ボタンという判定になります。Facebookによれば、旧ボタンは、2015年4月30日以降は動作保証しないそうなので、現在動いてはいるもののこの部分の修正は必要かと思います。
2022.07.25 更新 – URLの正規化に伴いコード修正
FacebookグラフAPIのバージョンを以下のように、最新のバージョン14のスクリプト（シェアボタンを有効に設定）に変更しました。最新バージョンは、 グラフAPIの更新履歴 に掲載されています。
URL の正規化に伴い、Facacebook の「いいね！」ボタンの表示部（v14）と OGP タグの表示部のスクリプトを修正しています。
“http://” の時代に書かれた古い記事は、og:url プロパティを旧URLで Facebook クローラーへ通知し、昔の「いいね！」数を維持させますが、トップページはこの処理から除外するというロジックになっています。
$fb_appid = get_option('hpb_social_facebook_app_id');
$STR_DATA_HREF = get_permalink();
if ( 20200206 >= intval(get_the_date('Ymd')) ) {
if ( $STR_DATA_HREF !== 'https://www.senris.com/' and $STR_DATA_HREF !== 'https://senris.com/' ) {
// TOPページ以外でなおかつSSL化前の記事だけ data-href のURLを古いURLに変更する
$STR_DATA_HREF = str_replace( 'https://', 'http://',$STR_DATA_HREF);
}
}
$STR_OGP_URL = $STR_DATA_HREF; // og:url
// Facebookいいね！ボタン表示
$facebook_like = '<div id="fb-root"></div>
<script async defer crossorigin="anonymous" src="https://connect.facebook.net/ja_JP/sdk.js#xfbml=1&version=v14.0&appId='.$fb_appid.'&autoLogAppEvents=1 nonce="********"></script>
<div class="fb-like" data-href="'.$STR_DATA_HREF.'" data-send="false" data-layout="'.$facebook_like_layout.'" data-width="'.$facebook_like_width.'" data-size="small" data-share="true"></div>'."\n";
$content_social .= $facebook_like;
・
・
// 以下は、再度、3～10行の処理を実行してから
// ↓
<meta property="og:title" content="<?php the_title(); ?> | <?php bloginfo('name'); ?>"/>
<meta property="og:url" content="<?php echo esc_url($STR_OGP_URL); ?>"/>
<meta property="og:image" content="<?php echo esc_url(hpb_get_thumbnail_url($id,'large')); ?>"/>
<meta property="og:image" content="<?php echo esc_url(hpb_get_thumbnail_url($id,'medium')); ?>"/>
・
・
function hpb_get_thumbnail_url( $id, $size ) {
// OGP用サムネイル画像のURL取得
$thumbnail_url = get_the_post_thumbnail_url($id, $size);
if ( !$thumbnail_url ) {
$query = 'post_parent=' . $id . '&post_type=attachment&post_mime_type=image';
$postImg = get_children($query);
if ( !empty($postImg) ){
$keys = array_keys($postImg);
$num = $keys[sizeOf($keys)-1];
$thumb = wp_get_attachment_image_src($num, $size);
$thumbnail_url = clean_url($thumb[0]);
} else {
$thumbnail_url = get_bloginfo('template_directory').'/screenshot.jpg';
}
}
return $thumbnail_url;
}
上記の修正は、以下のリンクに示す通り、本サイトのSSL化へ向けての一連の修正作業となります。
🔗 Successfully converted to SSL for WordPress sites and handed over Facebook likes! (Core Server)
2023.02.25 追記
social_buttons.php の最新のコードは、以下の記事に掲載しています。
*2020.11.26 追記
14行目の「nonce=”********”」に記述された値（*）は、 Facebook for Developers から取得した値を記入します。
nonce（number used once）とは、第三者による改竄を防止するためのパラメータです。nonceは、IDトークンが再利用されないために、IDトークンに付与する一時的な値として使用されます。
なお、参考までにですが、SSL化の処理と OGP タグの変更を必要としない場合、表示部は以下のコードでOKです。
$fb_appid = get_option('hpb_social_facebook_app_id');
$STR_DATA_HREF = get_permalink();
$facebook_like = '<div id="fb-root"></div>
<script async defer crossorigin="anonymous" src="https://connect.facebook.net/ja_JP/sdk.js#xfbml=1&version=v14.0&appId='.$fb_appid.'&autoLogAppEvents=1 nonce="********"></script>
<div class="fb-like" data-href="'.$STR_DATA_HREF.'" data-send="false" data-layout="'.$facebook_like_layout.'" data-width="'.$facebook_like_width.'" data-share="false"></div>'."\n";
P.S. ツイートボタンに関しては、IE11で表示が乱れる問題も確認しておりますが、そもそもTwitter社はIEのサポートは止める方針らしいので、このまま放置する事にしました。
2022.06.26 更新
Meta for Developers （旧： Facebook for Developers）へログインしたところ、上記画面の通知領域にグラフAPIへの使用状況を確認するためのアラートが届きました。
これは、グラフAPIにおいて、「データの使用状況の年次確認」と呼ぶものであり、これに応答しないとグラフAPIへのアクセスが停止されてしまいます。😨
Facebook開発者の声明 によると、コンプライアンスチェックを強化するため、データ保護の評価を完了する責任について、Facebookアプリ開発者に通知するというものでした。
これに伴い、このツールにログインし、FacebookのアプリIDの管理者情報（メールアドレス、アプリドメイン、プライバシーポリシーのURL、など）の確認と更新、ならびに、 本人確認書類 の提出も必要となりました。
以上の手続きを進めることで、 FacebookグラフAPI の最新バージョンが使用可能になるらしいです。
当サイトでは、本人確認書類を提出済みであるため、取りあえず、2022年5月25日にリリースされた最新バージョン v14.0 に更新しました。
更新にあたり、Meta for Developers の詳細設定タブの「APIバージョンのアップグレード」の設定が、「v14.0」になっていることを確認します。
FacebookグラフAPI（v14.0） のコードは、以下のように記述しました。
// Facebookいいね！ボタン表示
$facebook_like = '<div id="fb-root"></div>
<script async defer crossorigin="anonymous" src="https://connect.facebook.net/ja_JP/sdk.js#xfbml=1&version=v14.0&appId='.$fb_appid.'&autoLogAppEvents=1 nonce="********"></script>
<div class="fb-like" data-href="'.$STR_DATA_HREF.'" data-send="false" data-layout="'.$facebook_like_layout.'" data-width="'.$facebook_like_width.'" data-size="small" data-share="true"></div>'."\n";
⚙️ 「Native Emoji」が動作しなくなった問題への対処
Native Emoji とは、WordPressのビジュアルエディタを拡張できるプラグイン TinyACE Advanced と組み合わせる事で、グラフィック絵文字が簡単入力できる便利なプラグインです。
しかしながら、このプラグインは既に2年間更新が止まっているためか、残念ながら、WordPressの5.3（2019.11.12 リリース）へのアップグレードで動作しなくなっています。
ブロックエディタの刷新などの仕様変更の影響を受け、動作しなくなったものと思われます。
よって、他の代替プラグインを探してみたものの適当なものが見つからなかったので、当分の間、WordPressをダウングレードさせて運用する事にしました。
WordPressプラグイン WP Downgrade を新たにインストールし、WordPressのコアプログラムを”5.2.4″へのダウングレードを実施しました。
2020.06.10 更新
下記のニュースでお知らせしましたが、マイクロソフトから配信された新しい Chromium版「Edge」 において、絵文字入力がサポートされたため、Windows10での運用ならば、WordPressの絵文字入力のプラグインは不要になりました。
🔗 Google Translate for PrisnaGWT widget no longer works on Microsoft Edge and IE
⚙️ 「RSSフィード」にアイキャッチ画像が表示されなくなった問題への対処
RSSフィードにアイキャッチ画像（サムネイル画像）を出力できるプラグイン RSS Image Feed を導入していたのですが、以下の画像の通り、アイキャッチ画像が表示されなくなっていました。
調査したところ、2019年4月16日に実施したPHP5.6⇒7.1へのバージョンアップが原因と判明しました。
本件への対応としては、RSS Image Feedの動作を停止（またはアンインストール）させ、WordPressテーマの中のプログラム”functions.php”に以下のコードを追記する事で対処しました。
/* 【RSS】RSS フィードにアイキャッチ画像を表示 */
function rss_post_thumbnail($content) {
global $post;
if(has_post_thumbnail($post->ID)) {
$thumbnail_id = get_post_thumbnail_id($post->ID); // アイキャッチ画像の ID を取得
$thumbnail = wp_get_attachment_image_src( $thumbnail_id, 'medium' ); // medium サイズの画像情報を取得
$thumbnail_url = $thumbnail[0]; // URL を取得
$content = '<p><img src="'.$thumbnail_url.'" alt="'.get_the_title().'" /></p><p>'.$content.'</p>';
} else {
$content = '<p><img src="'.get_template_directory_uri().'/screenshot.png" alt="'.get_the_title().'" /></p><p>'.$content.'</p>';
}
return $content;
}
add_filter('the_excerpt_rss','rss_post_thumbnail');
add_filter('the_content_feed','rss_post_thumbnail');
*この記事を投稿後、IEで確認したところ、以下のようにアイキャッチ画像が表示されていました。
⚙️ 「Code Syntax Block」と「Highlighting Code Block」の追加
2020.3.30 更新
各種コードをカラフルにハイライトしてくれる便利なWordPressプラグイン「Crayon Syntax Highlighter」がブロックエディタ（Gutenberg）で動作しなくなったため、代わりのプラグイン Code Syntax Block をインストールしました。
また、同時に「Native Emoji」に代わるプラグイン Emoji Autocomplete Gutenberg をインストールし、プラグイン「WP Downgrade」を停止させ、WordPressのバージョンを最新バージョン(5.3.2)に上げました。
なお、WordPressを最新バージョンに上げた事で、記事中の「moreタグ」が機能しなくなっているのを確認しております。プラグイン Custom More Link Complete ならびにRSSフィードの表示は正常に機能しているようです。どうやら、テーマのプログラムが最新バージョンのWordPressと互換性が無くなったのが原因と思われます。現在のところ、記事中にmoreタグを挿入している部分はあまり無く実害は無いと思われますが、気持ちは良くないので、時間を見て原因を調査してみようと思います。
その後、テーマのプログラムを調査したところ、どうやら、single.phpやblog.phpで使用しているWordPressのインクルードタグ「comments_template()」がmoreタグに対応しなくなったようです。記事の中のデータを調べてグローバル変数「$more」を再設定し、「the_content()」関数から記事を出力すれば対応できたという報告もありますが、この問題は、今後のWordPressのバージョンアップで対応するようになるかもしれませんので、暫く静観する事にします。
2020.04.04 追記
「Crayon Syntax Highlighter」がPHP7.3で動作しないこと（修正パッチはある）と「Code Syntax Block」と共存しないことが判明したので、Crayon Syntax Highlighterで記述されたブログを全て、Code Syntax Blockに書き換えました。
そして、Crayon Syntax Highlighterをアンインストールし、サーバーのPHPのバージョンを7.3へ上げました。なお、本日の時点でWordPressのバージョンは5.4へ上げています。
2020.05.14 追記
Code Syntax Block での記述がインターネットエクスプローラーで正しく表示されない場合があるため、当該ページを同様のプラグイン Highlighting Code Block に置き換えました。
2023.02.21 更新
現在は、「 Code Syntax Block 」は非推奨とし、「 Highlighting Code Block 」ならびに、「 Code Block Pro 」を使用しています。なお、推奨プラグインは、 Code Block Pro Is.
詳細については、以下の記事を参照願います。
⚙️ 「Auto Limit Posts Reloaded」の追加
2020.3.30 追記
上記のWordPressのバージョンアップでmoreタグが動作しなくなったのを受け、自動で「続きを読む（moreタグ）」を挿入できるプラグイン Auto Limit Posts Reloaded をインストールしました。
このプラグインを有効化することで、ブログの一覧表示が見易くなりすっきりしました！
⚙️ その他WordPressプラグインの修正
最新のWordPressプラグインのメンテナンス状況については、 All recommended plugins for WordPress multilingual sites! の記事にまとめました。
2020.04.07 追記
WordPress5.4へのアップグレードで色々な不具合を確認しています。
その一つは、ブラウザ「マイクロソフトEdge」を使用している場合、メディアライブラリーからマルチアップローダーが起動しない事です。そしてもう一つは、WordPressとJetpackの接続が切れてしまう問題（Jetpackのバグ？）です。
この問題は、以下のWordPressフォーラムに投稿しておきました。
🔗 Unable to Upload Media Files in Microsoft Edge
🔗 Jetpack loses connection with WordPress in WordPress 5.4
なお、「moreタグ」が機能しない問題ですが、WordPress5.4のブロックエディタで作成された投稿は動作するようになったようです。
2020.05.02 追記
WordPress5.4で発生したバグは、修正パッチで対応しています。詳細は以下のブログに記載しています。
🔗 Solved the bug in WordPress 5.4 and the problem that the block editor could not be used in HPB custom posts.
2020.04.08 追記
PHPを7.1から7.3へアップグレードした後、HPBのダッシュボードをクリックしたら以下のエラーが発生しました。
WordPressをデバッグモードにして、実行ログを解析したところ、以下の致命的エラーを確認しました。
[07-Apr-2020 09:51:05 UTC] PHP Fatal error: Uncaught Error: Class 'XMLReader' not found in xxxxxxxxxx/wp-content/plugins/hpbtool/hpbtools.php:77
実際のエラーは、HPBのプラグイン「hpbtools.php」の77行目（以下）で起きています。
$xml = new XMLReader();
ネットで調べたところ、発生個所は、以下のようにサーバー側に原因があるとされています。
考えられるエラーの原因として、
xmlreaderはPHPでxmlを簡単に取り扱える関数群をまとめたPHPの拡張クラスです。一般的には最初からPHPにはこの拡張クラスは組み込まれていますが、何らかの原因でxmlreader拡張が含まれていない場合にこのエラーが起ります。
エラーの対処方法・修正方法
・PHPにxmlreader拡張モジュールをインストールする
・phpにxmlreader拡張モジュールを組み込むには下記のコマンドをos側で発行します
・sudo yum install php-xml
・sudo service httpd restart
よって、昨日、コアサーバーのサポートへこの件で問合せしたところ、本日、以下の回答が返ってきました。
ご連絡いただき誠にありがとうございます。
お問い合わせの件について案内させていただきます。
現状コアサーバーの「php73」に「XMLWriter」が導入されていないため、ご利用ができない状態となります。
また、この度は貴重なご意見をいただき、誠にありがとうございます。担当部門に申し伝え、検討させていただきたく存じます。
なお、すぐの対応は難しい状況でございますため、大変恐縮でございますがPHP7.1での運用をご検討いただけますと幸いでございます。
ご希望に沿える回答に至らず申し訳ございませんが、何卒ご理解賜りますようお願い申し上げます。
その他ご不明な点がございましたら、お気軽にお問い合わせください。今後とも弊社サービスをよろしくお願いいたします。
という事でした。
更に調査したところ、PHP7.3のパッケージには、画像操作ライブラリ”Image::Magick”の拡張モジュールもインストールされていない事も判明しました。
結局、当分の間は、 PHP7.1で運用する事にしました 😥
2020.05.21 追記
コアサーバーにおいて、PHP7.1でImageMagickを使用するためには、PHPの設定が必要となります。詳しい事は、以下の記事に書いております。
🔗 Solved the bug in WordPress 5.4 and the problem that the block editor could not be used in HPB custom posts.
2021.06.16 追記
以下の記事の通り、PHPのバージョンを7.4へ上げ、拡張モジュール XMLReader/XMLWriter をPHP7.4へ組込みました。今後、PHP8.0でも試験を行う予定です。
2022.07.24 追記
以下のお知らせの通り、コアサーバー V1 の新サーバーへのマイグレーションに伴い、 PHP 7.4 が標準サポートされ、拡張モジュール XMLReader/XMLWriter, ImageMagick もサポートされました。
