WordPressテーマ「JIN」のサイドバーに表示させるプロフ画像のimgタグにloading="lazy"を付与するプラグインを作りました。
もくじ
遅延読み込みしなくてPageSpeed Insightsでマイナス要素になる
本サイトもGoogleの公式ツールであるPageSpeed Insightsでの数値改善に取り組んできました。JINもwidht、height、loading要素を付与するなどのアップデートがあり、開発陣もこのあたり意識をしているようです。
でも、なぜかサイドバーに設置するプロフ画像には、width、height要素の付与のみで、loading要素がつきませんでした。
これだとPageSpeed Insightsで「オフスクリーン画像の遅延読み込み 」という項目でひっかかってしまいます。
なので、プラグインを導入するだけで、loading="lazy"を付与するプラグインを作りました。
よければ、本サイトのプロフィール画像のHTMLをChromeのデベロッパーツールなどで確認してみてください。
このプラグインを導入することで「オフスクリーン画像の遅延読み込み 」の項目もクリアできました。
ついでにprofileページがなければリンクしないようにした
ついでにこのプラグインにちょっとした機能を入れました。JIN側のバグを修正したとも言えるかもしれません。
前々から気になっていたのですが、JINは「profile」という投稿をしていると、プロフィール画像にその記事のURLに対してリンクされる仕様になっています。
でももし「profile」という投稿がない場合は、なぜか無関係の記事のURLがリンクされてしまいます。特にprofileという投稿をしない人は多いと思います。これはバグだと思います。
そういう人はおそらく、CSSやJavaScriptでプロフィール画像をクリックできないようにして、しのいでいるのではないでしょうか。私もこれまでそうでした。
読者から見ればそれで全然問題ないのですが、サイドバーからリンクされるということは、サイトの全ページからになるのですごい数のリンクになってしまいます。無駄な発リンクはおそらくGoogleのクローラーさんの混乱の元なので、SEO的にもよろしくないと考えました。
なので、もしprofileという投稿がなければ、どのページにもリンクしない(aタグを出力しない)仕様にしました。もしprofileという投稿があれば、これまで通りその記事にリンクします。
このプラグインを導入すれば適用されます。
zipファイルをアップロードしてインストール
通常のWordPressプラグインは、WordPressの管理画面でプラグインの新規追加画面で検索してボタン一つか二つ押すだけでインストールできます。しかし、このプラグインはまだ公式のWordPressプラグインとして申請していません。
なので、zipファイルになっているプラグインを入手していただき、それをWordPressの管理画面からアップロードしてインストールする、という方法になります。
zipファイルは以下のボタンから無料でダウンロードできます。
ダウンロードしたzipファイルをWordPressの管理画面からアップロードしてインストールします。プラグイン名は「Jin add loading prof img」です。詳しいやり方は次の記事をご覧ください。
JINバージョン: 2.650で動作確認。
スポンサーリンク
もしニーズが大きければ
そこまで機能変更があるプラグインでもないので、アップデートする機会はあまりないと思いますが、zipファイルでの手動インストールだと、アップデート時は面倒です。一度プラグインを削除してから、先ほどと同じ手順でインストールする必要があります。
公式のWordPressプラグインとして申請して認められれば、イントールも更新もボタン1つでできるようになります。
もしニーズが大きいようであれば、申請しようと思います。なので、利用してみて使い勝手が良ければ、ブログやSNSでこのプラグインについて紹介してください!
Twitterの場合は、以下の私のアカウントにメンション頂ければ気付きやすいので助かります。またこのプラグインをアップデートした際は、Twitterでお知らせするのでフォロー頂けたら嬉しいです。
https://twitter.com/tai_tantan
JIN専用のプラグイン他にも作ってます
JINで使える便利なプラグイン他にも作っていますのでご覧ください。
カッテネもおすすめ
ちなみに、3000サイト以上にご利用いただいているカッテネというWordPressプラグインも以前作りました。以下のような商品リンクを作るプラグインです。
こちらはJINはもちろん、それ以外のテーマにも対応しています。また、人気が出たので公式のプラグインとして申請したので、ボタン1つでインストールできます。無料なので使ってみてください。
増え続けるプラグイン問題への回答
プラグイン無しにはWordPressの運用はできないと思います。私のように、細かい追加機能を自分でプラグインとしてプラグラミングしてしまう人は当然ですが、そうでない人でも、管理画面のプラグイン一覧に数十個並ぶのも普通なのではないでしょうか。
そうすると、非常に見づらくなり、管理しづらくなります。そこで超役立つプラグインがPlugin Groupsというプラグイン。Pluginをグループに分けられ、グループごとに表示できます。例えば、私が作ったプラグインを複数使っている方なら、「WebFood」などとグループを作ってそれに入れてもいいかもしれません。ちなみに、タグのように複数のグループに所属させることが可能なので、柔軟に分類することができます。ちなみに、これは私の作ったプラグインではなく、公式の方法で簡単にインストールできます。