画像表示不具合とPHPバージョンの変更

画像表示不具合とPHPバージョンの変更

しばらく前から画像表示が時々おかしくなっていた。
原因がわからないまま外部リンクを内部リンクに変えたりしていた。一番のショックは Featured Image from URLを更新するとトップページの表示がおかしなことになること。古いバージョンに戻して放置していたのだけれど、いつまでも更新しないわけにもいかない。

おかしいのはウィジェットの MH Custom Posts。サムネール画像が小さくならず、しかもタイトルも出ない。その分余計な空白になっている。テーマとプラグインの相性が悪いということだろうけれど、もはや自力修正はトライする気力すら出ない。

もうひとつおかしなことに気づいた。個別投稿記事ページの下部の丸いボタン画像が表示されていない。Cromeではこの部分は表示されているのに、ヘッダー画像が読み込まれていない。Edgeで見ると、こっちはまた別の箇所の画像が読み込まれていない。

ちょっとくらくらして翌日に持ち越し。日中落ち着いてダッシュボードにアクセスすると、PHPバージョンが古いので更新しろ、というメッセージに気づく。きっとこれもずいぶん前から出ていたに違いない。

検索すると、バックアップを取り、プラグインの対応を調べてから更新しろ、とある。バックアップを取るのは良いが、プラグインをチェックするプラグインを入れなければいけない。面倒なので不具合が出たらもう一度旧バージョンに戻すなり何なりすればいいや、と決行することにした。

wp-Xの管理画面から7.2に更新。するとウィジェットのサムネール以外の表示は、Firefoxの丸ボタンを除いて正常になった。

ウィジェットをにらんでいたら、MH Posts Lineup というのが目に留まった(こんなのあったっけ?)。カテゴリやタグでフィルタリングした投稿を、フィーチャー記事一個を大サイズのサムネール画像で取得し、概要は文字数でカスタマイズ、それ以下の記事はタイトルのみ取得する、というもの。

常々小サイズのサムネール取得に難があったし、リサイズが表示速度を遅くもしていた。なので、思い切ってトップページのカテゴリ記事リストを全てMH Custom Posts で取得することにした。背景カラーは黒で文字が白、というのが好みじゃないけど、CSSで変えればいいし。

が、ボーダーがCromeとEdgeで表示されず。どうやら border-bottom にスタイル、色、サイズを全て書くとCromeとEdgeでは表示されないようだ。それでひとつづつ、

border-bottom-color:#d1c4bb;
border-bottom-style:dotted;
border-bottom-width:2px;

と入れたら表示されるようになった。

最期に残った問題は、Firefox のボタン画像が出ないこと。pngがだめなのか、テーマファイルのphpの書き方が悪いのか…。でも他の箇所のpng画像は問題なく表示されている。よおく見くらべたら、imgタグが閉じられていなかった! なんという初歩ミス。でも以前は表示されてたんだよ。しかもCromeとEdgeで表示されれば、やっぱりFirefoxが悪いと思うよね。いやいや、一番最初に疑うべきは自分だったというオチ。

もうひとつ、以前から気になっていたことも、このたび解決した。WordPress Related Posts のサムネールが出ない件。

実はFeatured Image from URL の設定で、記事の最初の画像をサムネールにするようにしていた。投稿にアイキャッチを設定していない場合、プラグインが用意した画像がランダムに表示されるはずなのに、記事によって表示されない場合があって、これが謎だった。

表示されないのは、(まだ全てを検証していないけれど)記事のトップ画像が動画の場合だとあたりが付いた。動画を埋め込む場合はトップに画像を置くかサムネールを設定すれば大丈夫(なはず)。

懸案事項が解決したのはめでたいけれど、日々進化していくWordPressのケアー、いつまでできるのか不安でもあるなぁ。

2019.9.30

解決したと安心していたら、本日、また投稿記事ページの三つの丸ボタン画像が出ていないことに気づく。この間にしたことは、Featured Image from URL のマイナーアップデート。やーなかんじなのは、Chromeは出るのにFirefoxとEdgeがだめ。はぁ~。

  • トップへ戻る
  • カテゴリアーカイブ
  • HOME

コメント

メールアドレスが公開されることはありません。* は必須項目です。


*