WordPressで動画の遅延読み込みを簡単に追加する方法

動画はサイトのユーザーエンゲージメントを高めるのに最適です。しかし、動画を埋め込むとサイトの読み込みが遅くなり、訪問者にとっては良いことではありません。

これを解決する一つの方法は、動画に遅延ローディングを使うことです。

レイジーローディングは、動画が表示されたときにのみ動画を読み込むことで、サイトの読み込みを高速化します。つまり、すべての動画を一度に読み込むことでページが停滞することはありません。サイトのパフォーマンスを向上させる簡単なトリックです。

このガイドでは、WordPressで動画の遅延読み込みを簡単に追加する方法を紹介します。

レイジーローディングとは何か、動画のレイジーローディングはどのように機能するのか？

レイジーローディングとは、ウェブページ上の必要でない要素の読み込みを、それらが必要になるまで遅らせるテクニックのことです。動画の場合、表示されたときにのみ読み込まれます。

サイトに動画を埋め込むと、外部のスクリプトやファイルを読み込む必要があります。この余分な負荷は、サイトのパフォーマンスに悪影響を及ぼす可能性があります。

動画の遅延ローディングは、埋め込まれたYouTubeやVimeoの動画をクリック可能なプレビュー画像に置き換えることで役立ちます。訪問者が画像をクリックすると、動画がロードされ再生されます。

画像は動画よりもはるかにサイズが小さいため、遅延ローディングのテクニックはページ速度を大幅に向上させます。

それでは、WordPressでYouTubeやVimeoの動画を遅延ロードする方法を見ていきましょう。

動画チュートリアル

Subscribe to WPBeginner

文書による指示がお好きな方は、このまま読み進めてください。

WordPressで動画の遅延読み込みを追加する方法

動画の遅延ロードを追加するには、まずLazy Load for Videosプラグインをインストールして有効化する必要があります。

このプラグインは箱から出してすぐに使えるので、jQueryスクリプトやコードを編集する必要はありません。

遅延ローディングが機能しているかどうかを確認するには、YouTubeやVimeoの動画を含む投稿やページを表示するだけです。動画のサムネイルと再生ボタンが初期設定のプレーヤーを置き換えていることに気づくでしょう。

画像をクリックすると動画が読み込まれ、再生される。

動画がロードされるときに、一瞬の遅れに気づくかもしれませんが、これはまったく普通のことです。ご心配なく。遅延ロードは問題なく機能しています。

このプラグインはすぐに使えるが、ニーズに応じて設定できることがある。投稿エディター画面では、YouTube動画埋め込み用のサムネイル画質を選択することができる。

サムネイルの画質以外にも、さらなるカスタマイザー設定が可能だ。

設定 ” Lazy Load for Videosでこれらのオプションをチェックし、再調整することができます。

一般/スタイリング’タブでは、動画のサムネイルの外観をカスタマイズすることができます。レスポンシブモードを有効化したり、再生ボタンのスタイルを選択したり、カスタム CSS を使用したり、schema.orgマークアップを有効にしたりすることもできます。

このプラグインはYouTubeとVimeoの両方をサポートしています。プロバイダー固有の設定はそれぞれのタブをクリックしてください。

YouTube」タブでは、プログレスバーの色を選択したり、Cookieを無効化したり、注釈を非表示にしたりすることができます。YouTube動画の遅延ロードを無効化することもできます。

同様に、Vimeoの設定タブでは、コントロールカラーを選択したり、動画タイトルを非表示にしたり表示したり、Vimeo動画の遅延ロードを無効化したりすることができる。

これらの設定を変更した場合は、下にある「変更を保存」ボタンを忘れずにクリックして、進行状況を失わないようにしてください。

ボーナスのヒントWordPressで動画をアップロードしない

WordPressサイトへの動画のアップロードを避けるべき理由を説明する前に、アップロードと埋め込みとの違いを明確にしましょう。

動画をアップロードするということは、WordPressのメディアライブラリに画像を保存する方法と同じように、動画ファイルをサイトに直接保存するということです。私たちは、この方法を強くお勧めしません。

一方、動画の埋め込みでは、まずYouTubeのようなサードパーティサイトに動画をアップロードします。その後、あなたのブログに動画を埋め込み、他の場所に保存されている間、あなたのサイトで表示できるようにします。可能な限り動画を埋め込むことを強くお勧めします。

WordPressに動画をアップロードする代わりに埋め込むことの利点についてさらに詳しく知りたい方は、WordPressに動画をアップロードしてはいけない理由をご覧ください。

この投稿がWordPressで動画の遅延ロードを追加するのにお役に立てば幸いです。次に、WordPressのスピードとパフォーマンスに関する究極のガイド、またはWordPress CDNソリューションをセットアップしてサイトのスピードを上げる方法をご覧ください。

If you liked this article, then please subscribe to our YouTube Channel for WordPress video tutorials. You can also find us on Twitter and Facebook.