WordPressでiframeの遅延読み込みを無効にする方法

最終更新日:

WordPressでiframeの遅延読み込みを無効にする方法をご紹介します。特定のiframeだけ無効にしたいなどソースコード付きで説明しています。

iframeの遅延読み込みとは?

WordPressでは、WordPress 5.7からiframeの遅延読み込みがデフォルトで有効になりました。

iframeタグに「loading=”lazy”」が自動的に追加されます。

iframeの遅延読み込みを無効にする

テーマ内のfunctions.phpに下記のコードを追加します。

iframeだけ無効にする

コンテンツ内すべてのiframeの遅延読み込みをデフォルトで無効にする場合は、下記のフィルターを使用します。

function disable_post_content_iframe_lazy_loading( $default, $tag_name, $context ) {
    if ( 'iframe' === $tag_name && 'the_content' === $context ) {
        return false;
    }
    return $default;
}
add_filter(
    'wp_lazy_loading_enabled',
    'disable_post_content_iframe_lazy_loading',
    10,
    3
);

特定のiframeだけ無効にする

特定のiframeの遅延読み込みをデフォルトで無効にしたい場合は、下記のフィルターを使用します。

下記のコードはYouTubeだけ遅延読み込みを無効にする例です。コード内の「youtube.com」を適宜変更ください。

function skip_loading_lazy_youtube_iframes( $value, $iframe, $context ) {
    if ( 'the_content' === $context && false !== strpos( $iframe, 'youtube.com' ) ) {
        return false;
    }
    return $value;
}
add_filter(
    'wp_iframe_tag_add_loading_attr',
    'skip_loading_lazy_youtube_iframes',
    10,
    3
);

画像とiframeを無効にする

画像とiframeの両方とも遅延読み込みをデフォルトで無効にする場合は、下記のフィルターを使用します。

add_filter( 'wp_lazy_loading_enabled', '__return_false' );
go to top