サポート » 使い方全般 » アイキャッチ画像のloading属性を削除する方法

  • 解決済 echizenya

    (@echizenya)


    【質問の主旨】

    各ブログ記事のアイキャッチ画像として表示したタグの中にある、loading=”lazy”プロパティを削除するためにはどうすればよいでしょうか?

    【質問の補足】

    1.
    自分のブログサイトでは必ず記事(ページ)の先頭には、WordPressのアイキャッチ画像の機能を使って、jpgかpngの画像ファイルを表示することになっています。

    現在、質問の対象となるページは、GoogleのLighthouseを使ってページの機能評価をさせると「Largest Contentful Paint image was lazily loaded」という警告が出されます。なお質問の対象となっている記事以外の記事でも同様の警告が出されます。

    2.
    SEO関連の情報を確認すると、最初に表示されるimgタグに付属している、loading=”lazy”プロパティを削除するとこの警告が削除されるような気がします。

    ですが”Largest Contentful Paint image WordPress”というキーワードを使って、Google検索をしましたが、自分が疑問に思っていることについて解決につながるような投稿は見つけることができませんでした。

    3.
    現在、画像ファイルの遅延読み込みを実行するプラインは使っていません。

    4.
    質問の対象としているブログサイトにおけるWordPressはGitHubで公開しています。

    以上、よろしくお願いします。

    ヘルプの必要なページ: [リンクを見るにはログイン]

2件の返信を表示中 - 1 - 2件目 (全2件中)
  • @echizenya さん

    こんにちは。

    WordPress5.5でネイティブLazy-Loadがサポートされ、記事コンテンツ内の画像や画像出力関数等にloading=”lazy”がつくようになりました。
    アイキャッチ画像にloading=”lazy”がついているのもその理由です。

    これは、以下のように無効にする事が出来ます。
    the_post_thumbnail( ‘media_size’, array( ‘loading’ => ‘eager’ ) );

    なお5.9では、おっしゃるようなLCP改善のため、「ページの最初のコンテンツ画像またはiframe」は遅延読み込みからスキップされるようになります。
    すぐに5.9にアップデートされる予定があるようでしたら、上記対応は行わず1/25の正式リリースを待てば良いかなと思います。

    参考:Enhanced lazy-loading performance in 5.9
    https://make.wordpress.org/core/2021/12/29/enhanced-lazy-loading-performance-in-5-9/

    トピック投稿者 echizenya

    (@echizenya)

    @wildworks さん。

    コメントありがとうございます。

    なお5.9では、おっしゃるようなLCP改善のため、「ページの最初のコンテンツ画像またはiframe」は遅延読み込みからスキップされるようになります。

    WordPressコアの解説ありがとうございます!
    5.9がリリースされ次第、今回の質問対象となっているブログサイトでも5.9にアップデートする予定です。
    アドバイスいただいた通り、自分からは特に対応をせず、WordPressの標準機能で問題を解消してもらうようにします。

    今後ともどうぞよろしくお願いします。

2件の返信を表示中 - 1 - 2件目 (全2件中)
  • トピック「アイキャッチ画像のloading属性を削除する方法」には新たに返信することはできません。