WordPressで遅延読み込みを適切に無効にする方法（ステップバイステップ）

遅延読み込みは通常、ユーザーがスクロールして画像を見るまで画像の読み込みを遅延させることで、ウェブサイトの読み込みを高速化するのに役立ちます。ただし、表示の問題を引き起こしたり、「ファーストビュー」のコンテンツの表示が遅くなったり、テーマのレイアウトと競合したりすることがあります。

これは、高品質の画像がすぐに読み込まれる必要がある写真ポートフォリオでよく見られます。この機能がユーザーエクスペリエンスを損なっている場合は、無効にする方法が必要です。

WPBeginnerでは、何千ものユーザーが画像のトラブルシューティングを安全に行うのを支援してきました。サイトを壊すことなく最もうまく機能する方法を正確に把握しています。

この記事では、WordPressで遅延読み込みを適切に無効にする方法を説明します。

遅延読み込みとは何ですか？

WordPressでは最初にWordPress 5.5で画像の遅延読み込みが導入されました。その後、iframe埋め込み（YouTube動画、Spotify、その他の埋め込みなど）にも遅延読み込み機能が拡張されました。

このプラクティスは、表示領域のコンテンツを最初に素早く読み込むことで、サイトのパフォーマンスとページ速度の向上に役立ちます。

より高速なウェブサイトは、ユーザーにとって良いだけでなく、検索エンジンが速度を重要なランキング要因と見なすため、ウェブサイトのランキングを向上させることもできます。

画像や埋め込み以外にも、コメントやGravatarを遅延読み込みすることで、ページの読み込み速度をさらに向上させることができます。

遅延読み込み機能が実際に動作していることを確認するには、画像の上で右クリックし、ブラウザで「検証」ツールを選択してください。

これによりブラウザ画面が分割され、HTMLソースコードが表示されます。ここで、「loading=lazy」属性が画像に追加されているのがわかります。

通常、遅延読み込みの全体的なメリットを考慮すると、無効にすることは推奨されません。WordPressウェブサイト。無効にすると、ウェブサイトの速度低下、コンバージョン率の低下、SEOランキングの低下につながる可能性があります。

ただし、遅延読み込みは一部のウェブサイトでユーザーエクスペリエンスを損なう可能性があります。

たとえば、画像がコンテンツの最も重要な側面である写真ウェブサイトを運営している場合、それらを遅延読み込みすると、顧客のユーザーエクスペリエンスが損なわれる可能性があります。

場合によっては、独自の遅延読み込みソリューションを備えたスタンドアロンのパフォーマンスプラグイン（WP Rocketなど）を使用しているため、競合を避けるためにデフォルトのWordPressの遅延読み込みを無効にしたい場合があります。

それを踏まえた上で、WordPressで遅延読み込みを簡単に無効にする方法を見ていきましょう。

このチュートリアルでは、コードによる方法とプラグインによる方法を紹介します。どちらかのオプションにジャンプするには、以下のリンクを使用できます。

方法 1: WPCode を使用して WordPress の遅延読み込みを無効にする (推奨)

カスタムコードをテーマのfunctions.phpファイルに追加することで、WordPressで遅延読み込み機能を無効にすることができます。

ただし、コードを追加する際にわずかなエラーが発生すると、ウェブサイトが破損してアクセスできなくなる可能性があることに注意してください。

そのため、WPCodeを使用してカスタムコードを追加することをお勧めします。サイトが壊れるのを防ぐためのエラー保護機能が組み込まれています。

これは市場で最高の WordPress カスタムコードスニペットプラグインです。さらに、ウェブサイトへのコードの追加を非常に簡単かつ安全に行えます。

デモサイトで徹底的にテストし、優れた結果を確認しました。詳細については、WPCodeの完全レビューをご覧ください。

まず、WPCodeプラグインをインストールして有効化する必要があります。詳細な手順については、WordPressプラグインのインストール方法に関するガイドを参照してください。

有効化したら、WordPressダッシュボードから コードスニペット » + スニペットを追加 ページにアクセスしてください。

ここから、「カスタムコードを追加 (新規スニペット)」オプションの下にある「スニペットを使用」ボタンをクリックします。

これにより、「カスタムスニペットの作成」ページに移動します。ここで、コードスニペットの名前を入力することから始めることができます。

これは、コードスニペットを識別し、その機能を知るのに役立つものであれば何でも構いません。私たちは「遅延読み込みを無効にする」と名付けました。

カスタムスニペットに名前を付けたら、画面右側の「コードタイプ」ドロップダウンメニューから「PHP スニペット」を選択します。

次に、次のPHPコードを「コードプレビュー」ボックスにコピーして貼り付けます。

// Disable native WordPress lazy loading 
add_filter( 'wp_lazy_loading_enabled', '__return_false' );

コードを貼り付けた後のコードは次のようになります。

その後、「挿入」セクションまでスクロールします。ここでは、「自動挿入」モードを選択するだけです。

これにより、スニペットをアクティブ化すると、カスタムコードがWordPressサイトのどこでも自動的に実行されるようになります。

次に、ページの上部までスクロールし、「Inactive」スイッチを「Active」に切り替えるだけです。

最後に、「スニペットを保存」ボタンをクリックして、コードスニペットを保存して実行することを忘れないでください。

これで、WordPressサイトでデフォルトの遅延読み込みが無効になります。

テストする前に、ブラウザキャッシュとWordPressキャッシュをクリアしてください。その後、画像の上で右クリックして、ブラウザメニューから「検証」を選択できます。

これをテストするには、画像の上で右クリックし、ブラウザメニューから「検証」を選択します。

画像のHTMLコードでは、「loading=lazy」属性が消えているはずです。

方法 2: プラグインを使用して WordPress の遅延読み込みを無効にする

サイトにコードを追加したくない場合は、プラグインを使用して WordPress の遅延読み込みを無効にすることができます。

Disable Lazy Load プラグインをインストールして有効化するだけです。詳細については、WordPressプラグインのインストール方法に関するステップバイステップガイドを確認してください。

このプラグインはすぐに使用でき、設定は不要です。有効化すると、ウェブサイトのデフォルトの遅延読み込み機能を自動的に無効にします。

動画チュートリアル

文章での説明がお好みでない場合は、ビデオチュートリアルをご覧ください。

ボーナス：サイトの速度とパフォーマンスを向上させる

遅延読み込みを無効にすると、ウェブサイトの速度とパフォーマンスに悪影響を与える可能性があります。

その場合は、サイトのパフォーマンスを向上させ、ページの読み込み時間を短縮するための他のヒントを試すことができます。たとえば、サイトの画像を圧縮したり、JPEGまたはPNGファイル形式を使用したりして最適化できます。

さらに、常に最新バージョンのWordPressを実行し、ホームページで抜粋を使用し、コメントをページに分割し、ウェブサイトでSEO最適化テーマを使用する必要があります。

それ以外にも、WP RocketやWP Super Cacheのようなキャッシュプラグインを使用して、サイトの速度をさらに向上させることもできます。

さらに詳しいヒントについては、WordPressの速度とパフォーマンスを向上させる方法に関する初心者向けガイドをご覧ください。

遅延読み込みの無効化に関するよくある質問

読者から、遅延読み込みがウェブサイトのパフォーマンスにどのように影響するか、またいつ無効にすべきかについてよく質問を受けます。ここでは、最も一般的な質問に対する回答を紹介します。

1. 遅延読み込みを無効にすると、SEOランキングに悪影響がありますか？

遅延読み込みをグローバルに無効にすると、すべての画像が一度に読み込まれるため、ウェブサイトの速度が低下する可能性があります。ページの速度はGoogleのランキング要因であるため、サイトが遅くなるとSEOに悪影響を与える可能性があります。

ただし、最初の画像（Largest Contentful Paint）のみ遅延読み込みを無効にすると、Core Web Vitalsスコアが実際に向上する可能性があります。

2. 特定の画像のみ遅延読み込みを無効にできますか？

はい、特定の画像（ロゴやヘッダー画像など）の遅延読み込みを無効にできます。これを行うには、手動でloading="eager"属性を追加します。

WordPressのコンテンツエディタで、画像ブロックを選択し、ツールバーの3点メニューをクリックして「HTMLとして編集」を選択すると、属性を追加できます。

これは、ブラウザにその特定の画像をすぐに読み込むように指示し、WordPressサイトの他の部分の遅延読み込みはアクティブなままにします。

3. WordPressは背景画像を遅延読み込みしますか？

いいえ、WordPressのデフォルトの遅延読み込み機能は、<img>タグとiframe内の画像にのみ適用されます。CSSを使用して背景要素として追加された画像は、コアのWordPressソフトウェアでは遅延読み込みされません。

4. 遅延読み込みを無効にするには、プラグインとコードのどちらを使用するのが良いですか？

スニペットを貼り付けることに抵抗がない場合は、WPCode を使用するのがより良い方法です。これにより、サイトが軽量に保たれます。ただし、設定なしで簡単な修正を行いたい場合は、Disable Lazy Load プラグインは初心者にとって安全で効果的な選択肢です。

追加リソース

この記事で、WordPressで遅延読み込みを正しく無効にする方法を学べたことを願っています。これらの追加リソースも参照することをお勧めします。

• Webパフォーマンスのために画像を最適化する方法（ステップバイステップ）
• WordPressの速度とパフォーマンスを向上させるための究極のガイド
• WordPress画像圧縮プラグイン比較
• WordPress で一般的な画像の問題を修正する方法
• 画像 SEO の初心者ガイド – 検索エンジンのための画像を最適化する

この記事が気に入った場合は、WordPressのビデオチュートリアルのために、YouTubeチャンネルを購読してください。また、TwitterやFacebookでも私たちを見つけることができます。