WordPress移动端移除YouTube视频以提升页面加载速度

完全可行，PHP可以在页面渲染前就移除YouTube视频的相关代码，从根源避免视频资源被加载，比单纯用CSS隐藏高效得多。以下是两种实用的实现方式：

方法一：全局过滤页面内容，移除YouTube iframe #

如果你的YouTube视频是通过iframe嵌入（包括WPBakery生成的），可以通过the_content过滤器在内容输出前检测设备并移除视频代码：

add_filter('the_content', 'remove_youtube_on_mobile');
function remove_youtube_on_mobile($content) {
    // 检测是否为移动设备
    if (wp_is_mobile()) {
        // 移除所有YouTube iframe标签
        $content = preg_replace('/<iframe[^>]*src="https?:\/\/(www\.)?youtube\.com[^>]*><\/iframe>/i', '', $content);
        // 可选：移除WPBakery生成的视频外层容器（根据你的页面结构调整）
        $content = preg_replace('/<div[^>]*class="vc_video_wrapper[^>]*>.*?<\/div>/is', '', $content);
    }
    return $content;
}

这段代码会直接剔除页面中的YouTube iframe，移动端页面不会加载任何视频相关资源。

方法二：精准过滤WPBakery视频模块 #

如果你的视频是通过WPBakery自带的「Video」模块添加的，可以针对该模块的短代码进行过滤，只移除YouTube视频：

add_filter('vc_shortcode_output', 'remove_vc_youtube_on_mobile', 10, 2);
function remove_vc_youtube_on_mobile($output, $tag) {
    // 只针对WPBakery的视频模块短代码
    if ($tag === 'vc_video' && wp_is_mobile()) {
        // 解析模块属性，检查是否为YouTube链接
        $atts = shortcode_parse_atts($tag);
        if (isset($atts['video_link']) && strpos($atts['video_link'], 'youtube.com') !== false) {
            return ''; // 返回空内容，彻底移除该模块
        }
    }
    return $output;
}

这种方式更精准，不会影响页面中其他类型的内容或视频。

注意事项 #

• 将代码添加到当前主题的functions.php文件，或使用自定义代码插件（如Code Snippets），避免主题更新导致代码丢失。
• wp_is_mobile()会识别所有移动设备（手机、平板），如果需要只针对手机，可以通过解析$_SERVER['HTTP_USER_AGENT']实现更精细的检测。
• 修改后记得清除WordPress缓存，确保修改立即生效。

内容的提问来源于stack exchange，提问作者Histoni