如何在WordPress的Visual Composer中为视频元素添加mute属性

我之前帮不少开发者处理过这个问题，毕竟现在浏览器的自动播放政策卡得很严，必须静音才能触发自动播放。针对Visual Composer（现在也叫WPBakery Page Builder）没有内置静音开关的情况，给你三个实用方案，按需选择就行：

方案一：用自定义HTML嵌入视频（最简单快捷） #

如果不想折腾原模块的样式，直接用Visual Composer的自定义HTML模块替换掉原来的视频模块，自己写标准的<video>标签，把静音和自动播放属性加上：

<video autoplay muted loop width="100%" poster="你的视频封面图URL">
  <source src="你的视频文件URL" type="video/mp4">
</video>

这样写出来的视频完全符合浏览器的自动播放规则，还能灵活控制尺寸、封面等细节。

方案二：用JavaScript给现有视频模块加静音属性（保留原样式） #

要是你想保留Visual Composer视频模块的原有样式和设置，只需要加一段小脚本就能批量处理所有视频：

1. 进入WordPress后台，打开外观 > 自定义 > 额外代码（不同主题可能叫“自定义JS”或“自定义脚本”）
2. 粘贴这段代码：

document.addEventListener('DOMContentLoaded', function() {
  // 定位Visual Composer视频模块里的video元素
  const vcVideos = document.querySelectorAll('.wpb_video_wrapper video');
  vcVideos.forEach(video => {
    video.muted = true; // 强制添加静音属性
    video.autoplay = true; // 开启自动播放（原模块已开启的话可忽略，但加了更保险）
  });
});

这段代码会在页面加载完成后，自动给所有Visual Composer插入的视频加上静音属性，不用逐个修改模块。

方案三：修改模块模板文件（进阶，适合懂PHP的用户） #

如果你熟悉PHP代码，可以直接修改Visual Composer视频模块的输出模板，实现一劳永逸：

1. 找到插件目录下的视频模块文件：wp-content/plugins/js_composer/include/templates/shortcodes/vc_video.php
2. 找到输出<video>标签的行，手动添加muted属性，比如把原代码里的<video改成<video muted
3. 👉 注意：插件更新后这个修改会被覆盖，所以最好用子主题或者自定义插件来重写这个模板，避免更新后丢失改动。

额外提醒 #

• 现在Chrome、Safari等主流浏览器都要求自动播放的视频必须静音，所以muted是硬性要求，仅开启autoplay无法生效
• 修改后记得清空浏览器缓存，有时候旧缓存会让你看不到改动效果

内容的提问来源于stack exchange，提问作者Raymond the Developer