多功能主题名声不佳，而且很大程度上是应得的。任何一位经验丰富的 WordPress 开发者询问“万能型”主题，你都会听到同样的说教：臃肿，样样通样样松，有上千个你永远不会碰的选项，加载缓慢，难以脱离。Bridge 主题就是其中之一，那种纯粹主义者喜欢吐槽的类型。所以让我先提出这个不受欢迎的观点，因为我实际上用这个主题搭建过网站：有时候一个“厨房水槽”式的主题恰恰是正确的选择，有时候则是你今年最糟糕的决定。关键在于搞清楚你处于哪种情况。

这是一篇详尽、诚实的讲解，介绍 Bridge 主题能为你带来什么、它真正擅长的领域、会让你付出什么代价，以及所有那些演示站点背后的开发者界面。我会展示重要的部分，跳过营销废话，并且直截了当地告诉你那些产品页不会提及的权衡。

Bridge 主题值得购买吗？支持与反对的诚实分析

让我先说明免责声明，因为我认为这是我能告诉你的最有用的东西。像 Bridge 这样的主题，由 Qode Interactive 开发并作为“创意多功能 WordPress 主题”销售，并不轻量，任何声称相反的人都是在向你推销东西。它附带一个完整页面构建器、一个幻灯片插件、一个图标库、数百个预建设计以及一大堆自定义内容元素。那是大量的代码。如果你想拥有最精简的网站，你肯定不会从这里开始。

那么，为什么 Bridge 不断被用于实际项目（包括我的一些项目）呢？因为对于特定类型的工作，从数学上来说是划算的。

Bridge 在什么情况下是正确的选择？ 你是一名自由职业者或一个小型代理机构。客户想要在两周内（而不是三个月）拥有一个精良的网站。预算不足以支撑定制设计和自定义主题。你需要选择一个起始布局，重新着色，替换文案和图片，然后交付一个看起来有设计感、而不是拼凑起来的东西。这正是这类主题的用武之地，而且它确实擅长此道。

Bridge 在什么情况下是错误的？ 你正在构建一个高流量内容网站，每 100 毫秒的加载时间都会让你损失广告收入或转化率。你有一名设计师、一名开发者以及一个真实的时间表。你想要完全控制标记。在这种情况下，功能繁多的主题就是累赘，一个轻量级起始主题加上你精心挑选的插件会更好地满足你的需求。

说实话，大多数项目都属于第一类。这就是为什么这类主题能卖出数十万份。错误不在于选择了一个多功能主题。错误在于选择了一个多功能主题，然后当它表现出多功能主题的特性时感到惊讶。

这是我在向任何人推荐之前所用的框架。

如果你落入了“是”的行列，那么本文的其余部分就是我希望在第一次接触 Bridge 项目时有人能给我的向导。

值得了解的关键特性

与其罗列营销页面上的所有内容，这里展示的是真正改变你日常工作方式的部分。

• 庞大的预建演示库。 这是重点。Bridge 提供了数百个完整的演示站点，涵盖商业、创意、作品集、博客、商店和单页类别。选择一个，导入它，你就有了一个真正的起点，而不是一张白纸。
• 捆绑的 WPBakery 页面构建器。 Bridge 的原生构建器是 WPBakery（前身为 Visual Composer）。它已包含在内，无需单独购买。Bridge 在其之上还叠加了数十个自定义元素。
• 真正深入的头部系统。 五个不同的导航位置、多种头部类型（常规、左侧垂直菜单、全屏等）、居中徽标布局、侧边区域以及独立的移动菜单。很少有主题能让你对页面顶部有如此多的控制。
• 完整的 WooCommerce 支持。 主题声明 woocommerce 支持产品相册灯箱、滑块和缩放，并附带一个完整的模板覆盖目录用于商店。它还添加了自己的产品列表元素。
• 捆绑的细分领域附加组件。 Qode 包含其目录/列表、LMS、会员和音乐附加插件。一个 Bridge 许可即可成为目录网站、课程网站、会员网站或乐队网站，无需为每个功能购买单独的主题。
• 包含 Slider Revolution 和 LayerSlider。 该主题附带两个高级滑块插件。如果您原本需要单独授权 Slider Revolution，它本身就具有很大的价值。
• 一个真正的选项框架。 Qode Options 面板提供对排版、颜色、头部、底部、博客、作品集等的全局控制，并具有导入/导出功能，便于在网站之间迁移设置。
• 开箱即用，支持翻译和 WooCommerce。 该主题专为与 WPML 等翻译工具配合使用而构建，其 bridge 文本域意味着字符串是可本地化的。

这些大多在你激活主题并安装其配套插件时就会出现。让我逐一介绍那些真正值得关注的功能，从真正让 Bridge 畅销的特性开始。

演示库才是真正的产品。

直截了当地说：大多数人购买 Bridge 不是看中它的代码，而是看中它的演示模板。这个主题包中最有价值的东西就是预建站点库，激活后你首先要看的就是它。

一旦安装了 Bridge Core（配套插件，稍后详述），你会在 导入 页面 admin.php?page=import 在WordPress管理后台中。它是一个可搜索、可按类别筛选的预建演示站点网格。顶部的筛选器让你按类型缩小范围：所有、企业、创意、作品集、博客、商店、单页、特殊和其他。每个演示卡片都显示设计缩略图，并且重要的是，显示它是由哪个构建器创建的（WPBakery、Elementor 或 Gutenberg），这样你在导入前就知道会遇到什么。

有多少个演示？Qode 宣称的数量是“600+”，我不打算假装一个一个数过。我可以告诉你的是，通过点击浏览，有数百个，涵盖了小企业或创意工作者可能需要几乎所有的站点类型。餐厅、健身房、律师事务所、摄影师、代理机构、在线商店、个人博客、应用落地页。广度就是关键。无论你的客户做什么，很可能都有一个接近的起始布局。

但有个问题，而且是个真问题。 一键演示导入并不总能成功，尤其是在一次性沙盒环境或严格限制的主机上。当你导入演示时，Bridge 会从 Qode 的服务器获取演示图片、内容和任何必需的插件。如果你的主机阻止出站连接，或者你测试用的沙盒无法访问那些服务器，导入过程就会停滞或中途失败。我在一个一次性测试环境中捣鼓 Bridge 时就遇到了这种情况：演示 库 加载完美，但演示媒体的实际导入无法完成，因为外部获取被阻止。

在正常、连接良好的主机上（即你的真实站点运行的环境），演示导入工作正常。所以如果看到导入在精简的测试箱上挂起，不要惊慌。这几乎总是环境中的连接问题，而不是主题的缺陷。

提示： 在将演示导入现有站点之前，请先备份。演示导入会引入页面、文章、菜单和主题选项，虽然 Bridge 对此很谨慎，但你肯定不想手动将演示内容与实际内容分开。请先在新安装的站点上导入，或者先在临时环境中测试。

注意： 导入演示并不会让你永远被其构建器锁定，但它确实意味着导入的页面是用该演示所使用的任何构建器构建的。如果演示卡片显示 Elementor，而你却使用 WPBakery（或相反），请选择一个与你偏好的构建器匹配的不同演示，而不是与导入的页面作斗争。

演示导入后，你可以像对待任何其他 WordPress 站点一样对待它。更换 logo，在选项面板中更改颜色，替换占位文本和图像，然后你就差不多完成了站点的大部分工作。对于按项目收费的自由职业者来说，这正是其全部价值所在。

一个授权，四种站点类型

关于 Bridge 有一点让我惊讶，从价值角度来看，这确实非常聪明。该主题不仅捆绑了页面构建器和滑块，还捆绑了一套 Qode 自己的附加插件，根据激活哪个插件，可以将 Bridge 变成完全不同类别的站点。

查看主题捆绑的插件，你会发现这些插件与 Bridge Core、WPBakery 和 LayerSlider 一同提供：

• qode-listing 用于目录和列表。
• qode-lms 用于课程和学习管理。
• qode-membership 用于会员站点。
• qode-music 用于乐队、DJ 和音乐项目。

想一想这在实际中意味着什么。

如果你运营一个目录网站 （比如本地商家查找、房地产列表网站、”最佳”指南），qode-listing 插件提供了列表文章类型、分类筛选和列表布局，无需使用独立的目录主题或第三方插件。

对于课程创建者，qode-lms 插件增加了课程内容类型，让你可以在用于营销页面的同一个 Bridge 安装上搭建学习网站。它不会取代专为严肃课程业务设计的 LMS 平台，但对于一个创意品牌下的小型课程目录来说，它正好适用。

如果你要建立一个会员区域，qode-membership 在 Bridge 环境中处理会员和受限内容。

对于音乐人或乐队，qode-music 添加了通用主题所没有的音乐专属元素（作品集、活动）。

我想公平地说：这些捆绑插件是便利性的选择，而不是专业插件的最佳替代品。如果你在建立一个严肃的会员业务，像 ARMember 这样的专用工具在结算逻辑和访问规则上每次都会比 qode-membership 更胜一筹。但这不是重点。重点是，一个 Bridge 授权可以让你本月接一个目录客户，下个月接一个课程客户，而无需购买四个不同的主题。对于一个代理机构来说，这种灵活性是真正有价值的。

开始使用：首次运行流程

安装 Bridge 主题的流程与大多数 ThemeForest 上的付费主题类似，但有一个小细节值得注意。以下是我遵循的步骤。

第1步：上传并激活主题。 转到 外观 » 主题 » 添加新主题 » 上传主题，选择 bridge.zip 文件，然后点击 立即安装，接着 激活。此外，Bridge 还附带了一个子主题作为单独的 bridge-child.zip 下载。如果你打算添加任何自定义代码，请安装并激活子主题而不是父主题，这样你的修改会在主题更新后保留。（更多关于为什么这一点很重要，请参阅常见问题解答。）

第 2 步：安装所需插件。 一旦 Bridge 激活，你会在管理后台顶部看到 TGM 插件激活通知，要求你安装主题捆绑和推荐的插件。核心体验实际需要的是 Bridge Core （内容类型和大多数自定义元素都在这里）， WPBakery Page Builder （页面构建器）和 Slider Revolution （用于滑块较多的演示）。点击并安装这些插件。

这里有个小细节：我测试用的演示沙盒屏蔽了标准的 WordPress 插件安装界面，但 TGM 通知仍然顺利安装了捆绑的插件，因为它们打包在主题内部，而不是从 wordpress.org 获取。在真实的服务器上，你也会通过同样的方式直接从 TGM 通知安装它们。Bridge 还列出了可选附加组件（Elementor、QI Addons for Elementor、QI Blocks、Envato Market、Qode WooCommerce 快速查看和心愿单插件）。对于标准的 WPBakery 构建，你不需要这些。

注意： Bridge 主题不依赖 Elementor。其原生页面构建器是 WPBakery。Elementor 的支持是可选功能，通过 Qode 的 QI Addons 和 QI Blocks 插件实现。如果您习惯使用 Elementor，也可以那样工作。但如果您完全忽略 Elementor，一切也不会出错。

步骤 3：注册主题（可选但推荐）。 Bridge 拥有自己的仪表盘，称为 Bridge 仪表盘，其中包含欢迎面板、通过 Envato 购买码注册主题、文档和支持链接，以及系统信息面板。

这个系统信息面板比看上去更有用。它会报告您的 PHP 内存限制和其他服务器值，而 Bridge 是一个资源消耗较大的主题。Qode 推荐较高的 PHP 内存限制（仪表盘显示如 512MB 限制），如果您的托管设置较低，演示导入和 WPBakery 编辑器可能会卡顿。如果感觉运行缓慢或加载失败，请先检查此面板。

步骤 4：打开 Qode 选项。 这是全局控制中心，位于 admin.php?page=qode_theme_menu 后台管理菜单中。左侧导航是一长串选项卡：General（常规）、Logo（标志）、Header（页眉）、Footer（页脚）、Title（标题）、Fonts（字体）、Elements（元素）、Sidebar（侧边栏）、Qode Slider（Qode 滑块）、Page（页面）、Search Page（搜索页）、Blog（博客）、Portfolio（作品集）、Vertical Split Slider（垂直分割滑块）、Social（社交）、404 Error Page（404 错误页）、Contact Page（联系页）、Parallax（视差）、Content Bottom（内容底部）、WPBakery、Performance（性能）、Panel Area（面板区域）、Maintenance Mode（维护模式）、Import/Export Options（导入/导出选项）和 Reset（重置）。

那么多选项卡，我也不装模作样说你需要都去动。在典型设置中最重要的是：

• General 设置全局字体和第一个主色（你的品牌色），还有像’禁用 Google 字体’这样的开关。下方滚动部分有设计样式、设置、自定义代码、SEO 和 Google 地图控件。
• Logo 即上传你的 Logo 的地方（以及不同页眉状态下的变体，比如深色页眉用的浅色 Logo）。
• Header 是重头戏，下面有专门一节来介绍。
• Footer 控制页脚列和底部栏。
• Fonts 让你对标题和正文进行精细的字体控制。
• 博客 和 作品集 控制你的文章和项目存档的显示方式。
• 导入/导出选项 让你将整个Qode Options配置保存到一个文件，并在另一个网站上加载。对于在多个项目中保持统一风格的机构来说，这非常实用。
• 重置 如果你把自己逼入困境，可以将选项恢复为默认值。

你可能想知道是否必须在启动之前配置所有这些。不需要。如果你导入了演示版，大部分设置已经匹配演示版，你只需调整少数几项（logo、颜色、字体）。完整的选项面板是为需要控制时准备的，而不是一个强制性清单。

各式各样的页眉

如果说 Bridge 在哪一个领域真正超越了大多数竞争对手，那便是页眉。它提供的页眉布局数量之多，几乎到了“多到过分”的地步——但这是好事。

在底层，Bridge 注册了五个独立的导航菜单位置：

• top-navigation （标准的水平顶部菜单）
• left-top-navigation （拆分顶部菜单的左侧）
• right-top-navigation （拆分顶部菜单的右侧）
• mobile-navigation （独立的移动端菜单，与桌面端分开）
• popup-navigation （全屏/弹出式页眉类型使用的菜单）

为什么这很重要？因为这意味着你不需要将一个菜单强行适配到每一种布局中。你可以拥有一个居中徽标的页眉，菜单项分列于徽标左右两侧；一个完全不同的全屏覆盖菜单；以及一个专门构建的移动端菜单——所有这些都来自同一个主题。

在 Qode Options 中， 头部 这个标签页让这一切活起来。

头部标签页包含一系列丰富的控件和子部分：头部位置（包括一个用于垂直侧边菜单的“切换到左侧菜单”开关）、头部类型、菜单位置、中心徽标和头部高度，以及专用面板，分别用于头部、菜单、Qode 搜索、侧边区域、全屏菜单、头部顶部（主头部上方的细条）、移动菜单和头部按钮图标。

简单来说，无需编写一行代码，你就可以构建以下内容：

• 经典顶部头部 徽标在左，菜单在右。
• 居中徽标的头部就像你在时尚和编辑类网站上看到的那样，菜单项分布在中央徽标的两侧。
• 左侧垂直菜单导航沿页面侧边垂直排列，而非横跨顶部。非常适合作品集和画廊网站。
• 一个全屏弹出菜单，点击汉堡图标会打开一个覆盖全屏的遮罩层。风格醒目，适合简约的单页网站。
• 一个头部顶部栏 用于显示电话号码、社交图标或主导航上方的一句话标语。
• 一个侧边区域，由图标触发滑出的面板，用于放置额外的小工具、二级菜单或联系方式。

它的亮点在于： 如果你搭建过很多网站，就会知道客户想在顶部“做点不一样的”有多痛苦。对于大多数主题，“不一样”意味着自定义 CSS 或一个头部插件。而在 Bridge 中，通常只是一个下拉选项。仅此一项就为我节省了大量时间。

可以预见，另一面就是选择过多。第一次打开 Header 选项卡时，你可能会盯着它看一分钟，试图弄清楚哪种开关组合能产生你想要的效果。我的建议是：导入一个你喜欢的头部样式的演示，然后逆向工程它的设置，而不是从零开始构建。

WPBakery 元素库

Bridge 的本地页面构建器是 WPBakery Page Builder，它与主题捆绑在一起，因此无需单独购买许可。如果你之前用过 WPBakery（ThemeForest 上很大一部分主题都使用它），那么你已经熟悉了拖拽行和列的工作流。

Bridge 的 WPBakery 不同之处在于其上层叠的自定义元素库。开箱即用，你就能获得数十个 Bridge 专属元素，这些元素在原版 WPBakery 中是不存在的。算上主题自身的元素扩展和 Bridge Core 插件，自定义元素总数超过 60 个。以下是其中一部分代表性元素：

• qode_pricing_table 和 qode_pricing_list 用于价格对比区块。
• qode_content_slider 用于全内容滑块（不仅仅是图片）。
• qode_elements_holder 用于将交互式块分组到网格中。
• qode_vertical_split_slider 用于实现机构网站上流行的分屏滚动效果。
• qode_in_device_slider 用于在手机或笔记本电脑框架内展示截图。
• qode_preview_slider 用于图片预览轮播。
• image_with_text 和 icon_text 用于核心的“图标+标题+段落”功能模块。
• counter 以及 countdown 用于动画数字计数器和活动倒计时。
• pie_chart 以及 progress_bar 用于统计数据和技能进度条。
• portfolio_list 以及 portfolio_slider 用于展示你的项目作品。
• blog_slider 以及 masonry_blog 用于轮播或瀑布流布局的博客文章列表。
• product_list_masonry （以及优雅/瀑布流变体）用于WooCommerce产品网格。
• qode_banner 和 qode_video_box 用于推广横幅和视频灯箱。
• qode_google_map 用于嵌入地图。
• qode_interactive_links 用于悬停显示链接列表。
• qode_parallax_layers 用于分层视差滚动区块。
• qode_carousel 和 qode_masonry_gallery 用于内容轮播和瀑布流画廊。

这只是部分列表，但足以让你感受到：它们是 Bridge 主题赖以闻名的精致机构和创意布局的构建模块。你只需将它们拖放到 WPBakery 行中，在弹出的设置窗口中配置，它们就会自动应用主题样式进行渲染。

实话实说： WPBakery 是一个有争议的页面构建器。许多开发者更喜欢 Gutenberg 或 Elementor，而 WPBakery 基于短代码的输出是一个真正需要长期考虑的问题（我会在单独的部分讨论锁定风险，因为这是该主题最大的陷阱）。但对于那些只想用预制区块来组装页面的可视化编辑器用户来说，Bridge 的元素库是你所能找到的最丰富的之一。

重复之前那个容易让人困惑的要点：如果你更倾向于使用 Elementor，完全没问题。Qode 的 QI Addons for Elementor 和 QI Blocks 插件为你提供了 Elementor 中的 Bridge 风格元素。Bridge 不会强制你使用 WPBakery，只是默认用它而已。

开发者参考

现在进入大多数主题评测完全忽略的部分。如果你是需要扩展或维护 Bridge 网站的开发者，以下是表面的实际样貌，并提前给出重要注意事项。

Bridge 是一个经典的 PHP 主题。 它没有 theme.json，没有全站编辑支持，也没有区块主题架构。你通过传统方式进行定制：子主题、模板覆盖、Qode Options 面板以及主题的动作和过滤钩子。如果你原本期待的是一个全站编辑/区块主题，那它并不是，考虑到其 WPBakery 基础，这是一个刻意为之的设计选择。

该主题没有注册自己的 REST 路由。 有一个值得注意的细节：捆绑的 Bridge Core 插件暴露了一个小型的 qode-api/v1 REST 命名空间（路由如 registration 和 theme-validation) 仅在 Bridge 后台中用于许可证注册和主题验证。那是底层机制，而非内容 API。因此，你真正的集成接口是 WordPress 钩子系统加上 WPBakery 的 vc_map 用于添加构建器元素。如果你需要无头站点或应用后端，你将依赖 WordPress 核心自带的 REST API，而不是 Bridge 为内容添加的任何东西。

内容类型存在于插件中，而非主题中。 这一点很重要。Bridge 主题本身没有注册任何自定义文章类型和任何分类法。Bridge 的所有内容类型都由 Bridge Core 配套插件注册。这就是为什么必须安装 Bridge Core，而且对可移植性也是好消息：因为内容类型存在于插件中而非主题中，你的作品集内容和客户评价不会在切换主题时消失（记录仍保留在数据库中）。Bridge Core 的五个文章类型是：

• portfolio_page (Portfolio)，带有 portfolio_category 和 portfolio_tag 分类法。
• testimonials，带有 testimonials_category。
• slides （Qode 滑块），带 slides_category。
• carousels （Qode 轮播），带 carousels_category。
• masonry_gallery （砌体相册），带 masonry_gallery_category。

动作钩子

Bridge 提供了一组特定于主题的动作钩子，用于在模板的关键位置插入标记。它们都是无参数的输出钩子，意味着你 echo 在回调函数中输出标记，而不是接收和返回数据。

最有用、也是在主题内部最常用的，是 bridge_qode_action_page_after_container它在主页面容器之后触发，因此是在全站页面底部附加内容的可靠位置。

add_action( 'bridge_qode_action_page_after_container', function () {
    if ( is_singular( 'post' ) ) {
        echo '<div class="my-post-cta">';
        echo '<a href="' . esc_url( home_url( '/subscribe/' ) ) . '">Subscribe for more</a>';
        echo '</div>';
    }
} );

bridge_qode_action_after_wrapper_inner 在内部包装元素之后触发，如果你需要将内容放在主包装内部，这是另一个结构化的插入点。

add_action( 'bridge_qode_action_after_wrapper_inner', function () {
    echo '<div id="my-sticky-banner" role="region" aria-label="Announcement"></div>';
} );

bridge_qode_action_header_meta 允许你将额外标签打印到 Bridge 控制的文档头部区域。方便用于验证元标签或自定义预连接提示。

add_action( 'bridge_qode_action_header_meta', function () {
    echo '<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>';
} );

而 bridge_qode_action_style_dynamic 是 Bridge 输出其动态行内 CSS（由你的 Qode Options 选择生成的样式）的地方。在此挂载以在同一块中添加你自己的动态样式。

add_action( 'bridge_qode_action_style_dynamic', function () {
    echo '.my-feature-box { border-radius: 12px; }';
} );

Bridge 还会触发 WordPress 核心的 wp_body_open，因此任何标准的 wp_body_open 集成（分析工具的 no-script 标签、可访问性跳转链接）都能按预期工作。

过滤器钩子

过滤钩子才是真正配置能力的所在。它们使用 bridge_qode_filter_ 前缀，并且是单值过滤器（你接收一个值并返回修改后的值）。

关闭 Google 字体。 如果你自己托管字体，或者出于隐私或速度考虑想减少外部请求， bridge_qode_filter_disable_google_fonts 返回 false 默认情况下。返回 true 以停止 Bridge 加载 Google 字体。

add_filter( 'bridge_qode_filter_disable_google_fonts', '__return_true' );

覆盖侧边栏布局 使用以下方式为特定上下文 bridge_qode_filter_sidebar_layout，它接收当前的布局字符串。

add_filter( 'bridge_qode_filter_sidebar_layout', function ( $layout ) {
    if ( is_singular( 'portfolio_page' ) ) {
        return 'no-sidebar';
    }
    return $layout;
} );

强制显示或隐藏页面标题区域 通过 bridge_qode_filter_show_title_area一个布尔过滤器。

add_filter( 'bridge_qode_filter_show_title_area', function ( $show ) {
    if ( is_front_page() ) {
        return false; // hide the title bar on the homepage
    }
    return $show;
} );

重写标题文本 本身通过 bridge_qode_filter_title_text。

add_filter( 'bridge_qode_filter_title_text', function ( $title ) {
    if ( is_404() ) {
        return 'We could not find that page';
    }
    return $title;
} );

注册你自己的图标包 通过 bridge_qode_filter_icon_packs它接收（并返回）一个图标包定义数组，从而使你的自定义图标出现在相关元素选择器中。

add_filter( 'bridge_qode_filter_icon_packs', function ( $packs ) {
    $packs['my_icons'] = array(
        'label'  => 'My Icons',
        'prefix' => 'mi',
    );
    return $packs;
} );

编辑原生（非 Google）字体列表 配合 bridge_qode_filter_native_fonts_list如果您自托管自定义字体并希望在 Qode 选项中选择它，这将非常有用。

add_filter( 'bridge_qode_filter_native_fonts_list', function ( $fonts ) {
    $fonts[] = 'Inter';
    return $fonts;
} );

调整 TGM 必需插件列表 使用 bridge_qode_filter_required_plugins它接收 Bridge 提示您安装的插件数组。如果您正在为客户打包托管构建并希望删除某个推荐，这里就是您需要操作的地方。

add_filter( 'bridge_qode_filter_required_plugins', function ( $plugins ) {
    return array_filter( $plugins, function ( $plugin ) {
        return $plugin['slug'] !== 'hubspot';
    } );
} );

将额外变量传递到前端 JavaScript 使用 bridge_qode_filter_js_global_variables它接收 Bridge 传递给其前端脚本的全局变量数组。

add_filter( 'bridge_qode_filter_js_global_variables', function ( $vars ) {
    $vars['myScrollOffset'] = 120;
    return $vars;
} );

同一系列中还有更多过滤器，名称如 bridge_qode_filter_search_page_layout, bridge_qode_filter_single_blog_templates， bridge_qode_filter_excerpt_postfix，以及 bridge_qode_filter_product_list_add_to_cart_link它们的功能大致如其名称所示（分别控制搜索结果布局、注册博客单篇文章模板、更改摘要后缀以及调整 WooCommerce 产品列表的加入购物车链接）。在依赖不太常见的钩子之前，建议从源码中记录确切的签名，因为 Bridge 没有发布正式的钩子参考。从 Qode 知识库了解已记录的接口。

WooCommerce：使用标准钩子

对于 WooCommerce 工作，你不需要使用 Bridge 专属的钩子。该主题在模板覆盖中大量集成了 WordPress 核心的标准 WooCommerce 钩子，例如 woocommerce_before_add_to_cart_form， woocommerce_after_add_to_cart_button， woocommerce_single_product_summary，以及 woocommerce_proceed_to_checkout。因此，你现有的挂接到这些动作的 WooCommerce 代码片段将正常工作，Bridge 在其覆盖模板中会尊重它们的顺序。如果你之前定制过 WooCommerce 商店，这些知识可以直接迁移过来。

添加自己的构建器元素

由于 Bridge 的构建器是 WPBakery，添加自定义元素是一个标准 vc_map() 调用，与在任何 WPBakery 项目中的操作完全相同。无需任何 Bridge 特有操作。

add_action( 'vc_before_init', function () {
    vc_map( array(
        'name'     => 'My Callout',
        'base'     => 'my_callout',
        'category' => 'Content',
        'params'   => array(
            array(
                'type'        => 'textfield',
                'heading'     => 'Heading',
                'param_name'  => 'heading',
            ),
            array(
                'type'        => 'textarea_html',
                'heading'     => 'Content',
                'param_name'  => 'content',
            ),
        ),
    ) );
} );

这就是完整的开发者界面。这是一个传统的基于钩子和模板的主题。如果你熟悉经典的 WordPress 主题开发和 WPBakery，你将很快上手。如果你原本期望的是区块、内容 REST API 和 theme.json那么请在开始之前先放下这个期望。

Bridge 很重。下面介绍如何让它变快。

我不会跟你说 Bridge 很轻巧，因为它确实不轻，你第一次用 PageSpeed Insights 测试就会发现我在说谎。一个捆绑了页面构建器、多个滑块、图标库和 60 多个自定义元素的主题，本质上就很重。好消息是，Bridge 提供了真正有效的具体方法来精简它，并且在其自身选项中意外地坦诚地说明了这一点。

最重要的方法是排队移出你不需要的 JavaScript 库。Bridge 加载了一系列前端 JS 库来驱动其各种元素：轮播、平滑滚动、滑块、视频缩放、无限滚动等等。如果你的网站没有使用某个库所支持的元素，那么你就在毫无意义地向每个访客发送这个库。Bridge 提供了一系列 bridge_qode_filter_enqueue_*_script 过滤器，专门让你可以关闭它们。

例如，如果你从不使用基于 Owl Carousel 的元素，可以关闭该库：

add_filter( 'bridge_qode_filter_enqueue_owl_carousel_script', '__return_false' );

如果你不使用 nice-scroll 平滑滚动行为：

add_filter( 'bridge_qode_filter_enqueue_nice_scroll_scripts', '__return_false' );

如果您不使用 Qode Slider 元素：

add_filter( 'bridge_qode_filter_enqueue_qode_slider_scripts', '__return_false' );

同样的模式适用于该系列中的其他捆绑库，包括用于 bigtext、 fitvids、 flexslider、 fluidvids、 infinite_scroll、以及 one_page_scroll。检查您的完成站点实际使用了哪些 Bridge 元素，然后取消加载您不需要的元素背后的库。在一个使用了六十种元素类型中的三种的站点上，这可以消除大量的 HTTP 请求并节省大量的解析时间。

提示： 执行此操作 之后 你的设计最终确定之后，而不是之前。如果你取消了一个库的加载，后来添加了一个需要它的元素，该元素会无声地失效。将取消加载的列表作为上线前最后处理的事情，并在你的子主题中记录下来，这样未来的你就能知道为什么某个脚本缺失了。

除了取消加载之外，其他措施都是常见的，它们对于繁重主题比对于轻量主题更为重要：

• 使用缓存插件。 在 Bridge 网站上，这是必需的。页面缓存将所有的 PHP 和数据库工作转化为毫秒级提供的静态文件，从而绕开主题在重复访问时的负担。我首选 WP Rocket，部分原因是它的延迟 JavaScript 和移除未使用 CSS 功能正是为这种元素密集、加载库的主题量身定做的。将非关键脚本推迟到交互时，去掉首屏未使用的 CSS，一个繁重的 WPBakery 页面突然就顺畅了。
• 如果你自托管，请禁用 Google Fonts。 要么使用 bridge_qode_filter_disable_google_fonts 上面的筛选器或常规选项卡中的切换开关可以移除外部字体请求。
• 检查 Qode Options 中的性能选项卡。 Bridge 在选项面板中有一个专门的性能选项卡，带有自己的优化开关。在上线前检查一遍。
• 为 PHP 分配足够的内存。 请回到 Bridge 仪表盘中的系统信息面板。PHP 内存限制不足会使一切变慢，甚至直接导致 WPBakery 编辑器崩溃。
• 优化你的图片。 这对每个网站都适用，但对以大型英雄轮播和满版图片为特色的主题来说尤为突出。压缩所有图片并调整为合适尺寸。

做到以上所有，Bridge 网站绝对可以获得良好的性能评分。常见的错误是：启动 Bridge 网站时保留了所有演示素材，加载了所有脚本，没有缓存，图片未压缩，然后责怪主题速度慢。负载确实存在，但一旦你知道如何关闭，很多都是可选的。

不要在没有计划的情况下将整个网站锁定在 Bridge 短代码中。

这一条我希望你读两遍，因为这是最致命的失败模式，人们从未预见其到来，直到为时已晚。

WPBakery（Bridge 的构建器）将所有内容以短代码形式存储在文章内容中。使用 Bridge 的元素构建页面时，保存到数据库的并非干净的 HTML，而是一堆如下的短代码： [vc_row][qode_pricing_table ...][/qode_pricing_table][/vc_row]当 Bridge 和 WPBakery 处于激活状态时，这些短代码会渲染成你精心构建的设计。而一旦它们被停用，就不再渲染。

这就是陷阱。 假设你用 Bridge 构建了整个网站，两年后你切换了主题。现在每个页面都充斥着失效的简码（shortcode），它们以纯文本形式显示。你的定价表格变成了一堆文字 [qode_pricing_table title="Pro"] 出现在页面中间。如果上百个页面都是这样，你就得花好几天手动清理、手工重建。这就是迁移代价，在一个完全用 Bridge 构建的网站上，这种代价非常残酷。

这并非 Bridge 独有的问题，任何基于简码的页面构建器都存在。但 Bridge 重度依赖其自定义元素，所以要有意识地规划：

• 长期承诺使用 Bridge 在适当的情况下。对于一个多年内不会重新设计的宣传网站，锁定效应实际上无关紧要。
• 将关键、长期存在的内容放在纯文本区块中。 将核心服务描述和重要文章写成纯 Gutenberg 区块，而不是构建器元素，这样内容在切换主题时仍能保留。用 WPBakery 来做视觉美化。
• 在任何重大更改前导出你的 Qode 选项 从导入/导出选项卡，以便可以回滚。

我曾目睹一个小型代理公司在一次无人预算的迁移中花费了近一周时间清理 WPBakery 简码。这毁掉了整个项目。选择 Bridge 时要清楚你在做什么，锁定效应就不再是问题。

Bridge 对比其他多功能主题

Bridge 并非唯一的多功能旗舰主题，如果你正在选择，对比就很重要。让我用实际数据而非主观感受，与它最常被拿来比较的两款主题进行对比。

主要的多功能主题有 Bridge、Avada 和 Salient。这三款都是 ThemeForest 上畅销的主题，都捆绑了页面构建器和演示内容，而且都能让你快速搭建出完整的网站。它们的差异在于驱动你做出选择的不同方面。

在演示数量上，Bridge 明显领先。Qode 声称 Bridge 有 600 多个预建演示。Avada 提供大约 90 个预建网站。Salient 与 Avada 的数量相近，几十个而非几百个。如果你追求的是丰富的起始选项，那么没有谁的演示数量能超过 Bridge，而且这个差距（几百对大约九十）是相当明显的。

在页面构建器方面，三者各不相同。Bridge 的原生构建器是 WPBakery（可选 Elementor 支持）。Avada 使用自有的 Fusion Builder，它是专为 Avada 打造的，可以说比通用的 WPBakery 更精致。Salient 也提供定制版本的 WPBakery，并带有自己的元素集。如果你特别不喜欢 WPBakery，那么 Avada 的 Fusion Builder 就是区别所在。

在捆绑价值方面，Bridge 非常慷慨。它包含 WPBakery 以及两款高级滑块插件（Slider Revolution 和 LayerSlider），另外还有四个 Qode 的专用插件（列表、LMS、会员、音乐）。Avada 捆绑了 Fusion Builder、Slider Revolution 和 LayerSlider。Salient 捆绑了它的构建器并包含 Slider Revolution。如果从捆绑的付费插件数量来看，如果项目需要目录、课程或会员功能，Bridge 的四个额外 Qode 插件就是决定因素。

在元素库方面Bridge 拥有 60 多个自定义 WPBakery 元素，是你能找到的最丰富之列。Salient 的元素集也很大且设计精良（Salient 以其精美的视觉效果著称）。Avada 的 Fusion Builder 元素库同样深厚。

我的真实看法： 如果你最看重演示站多样性以及捆绑的附加组件，并且能接受 WPBakery，那就选 Bridge。如果你想要最精致的第一方页面构建器，且不需要成百上千个演示站，那就选 Avada。如果你更注重视觉精致度、更精挑细选的设计前沿感，而非单纯的演示站数量，那就选 Salient。它们都很强大。Bridge 的优势在于广度。

常见问题解答

Bridge 主题是否需要 Elementor？

不需要。Bridge 自带的页面构建器是 WPBakery Page Builder，它已随主题捆绑。你完全可以在不安装 Elementor 的情况下构建整个网站。Elementor 支持是可选的，通过 Qode 的 QI Addons for Elementor 和 QI Blocks 插件提供，因此 Elementor 用户也不会被排除在外。但这是一个选择，而非必需。

Bridge 是否臃肿且缓慢？

它确实很重，我不会粉饰这一点。一个捆绑了页面构建器、两个滑块、一个图标库和 60 多个自定义元素的主题承载着真正的重量，开箱即用它在速度测试中不会名列前茅。诚实的答案是：Bridge 为你提供了特定的杠杆来解决这个问题：过滤器可以让你取消加载不使用的 JS 库，有一个专门的性能选项卡，并且与 WP Rocket 这样的缓存插件配合使用会产生很大的不同。一个精心修剪的 Bridge 网站性能良好。而一个加载了所有演示资源且没有缓存的 Bridge 网站则不然。性能更多地掌握在你手中，而非主题本身。 bridge_qode_filter_enqueue_*_script 为什么我的演示导入失败？

几乎总是因为托管环境，而不是主题的问题。当你导入演示时，Bridge 会从 Qode 服务器获取演示的图片、内容和所需插件。如果你的主机阻止了出站连接（常见于锁定或沙盒环境），或者你的 PHP 内存限制太低，导入就会停滞。在 Bridge 仪表盘的“系统信息”面板中检查你的内存限制，确保你的主机允许出站 HTTP，然后重试。在正常、连接良好的主机上，导入会按预期工作。

如果我用 Bridge 构建了整个网站，是否会被锁定？

在相当程度上是的，你应该据此规划。WPBakery 将页面布局作为短代码存储在内容中，因此如果你后来切换到非 WPBakery 主题，这些页面将呈现为原始的短代码文本，需要重建。这种情况适用于任何基于短代码的构建器，不仅仅是 Bridge。通过将关键内容保存在纯文本块中，在适当的情况下长期使用 Bridge，以及如果你知道将来会迁移，预留重建预算，可以减轻这一风险。如果你事先意识到这一点，这是一个可控的风险。

确实存在相当严重的兼容性问题，你做方案规划时必须把这点纳入考量。

WPBakery 会把页面布局以短代码形式存放在文章正文里。一旦后续更换不兼容 WPBakery 的主题，原有页面只会直接输出一堆原始短代码文本，页面布局需要全部重做。

不只是 Bridge 主题，所有依靠短代码实现可视化编辑的页面构建器都存在这个通病。

可以通过几种方式降低风险：核心文案内容尽量用纯文本区块存放；适合长期使用的站点就持续沿用 Bridge 主题；如果确定未来要迁移建站工具，提前预留页面重构的工期与预算。

只要提前清楚这个隐患，该风险完全可控。

我需要使用子主题吗？

如果你打算添加任何自定义 PHP、CSS 或模板覆盖，那么是的，请使用随主下载包提供的子主题（bridge-child.zip）。直接编辑父主题意味着你的更改会在下次更新 Bridge 时被清除，而更新对于安全性和错误修复很重要。如果你只打算使用选项面板和构建器，可以跳过子主题，但安装它无需额外成本，还能避免日后的麻烦。

Bridge 适合 WooCommerce 商店吗？

是的，确实如此。Bridge 声明完全支持 WooCommerce，包括产品图库灯箱、滑块和缩放功能，附带一整套 WooCommerce 模板覆盖，并添加了自己的产品列表元素（瀑布流、优雅和 Pinterest 布局）。它还提供了可选的 Qode 快速查看和心愿单插件。对于注重设计的商店来说，它非常合适。如果你的商品目录非常庞大且追求最大速度，请谨慎应用性能部分的建议。

我可以将 Bridge 用于目录、课程或会员网站吗？

可以，得益于捆绑的 Qode 插件：qode-listing（目录）、qode-lms（课程）和 qode-membership（会员）。这些插件能将一个 Bridge 许可转变为多种类型的网站。不过，请对它们的功能深度保持现实态度。它们方便且有效，但对于该类别中的严肃业务，专用的专业插件功能会更强大。对于小型目录网站或创意品牌附属的普通课程目录来说，它们已经绰绰有余。

Bridge 是否已准备好翻译并支持多语言？

是的。Bridge 附带了一个 bridge 文本域和语言文件，因此其字符串是可翻译的，并且它设计为与 WPML 等多语言插件配合使用。如果你运行的是多语言网站，你可以像平常一样通过翻译插件管理翻译，Bridge 的字符串将自动应用本地化。

Bridge 是否支持全站编辑或块主题？

不。Bridge 是一个经典的 PHP 主题。没有 theme.json，没有 FSE 支持，也没有块主题架构。你可以通过子主题、Qode Options 面板和主题的钩子来自定义它。如果你对全站编辑有硬性要求，Bridge 不是合适的选择，这源于其 WPBakery 基础。

Bridge 实际包含多少演示站点？

Qode 宣称有“600+”预建演示。我没有逐一数过，具体数字以官方说法为准，但实际上有数百个完整的演示站点，涵盖商业、创意、作品集、博客、商店、单页和特殊类别。无论你的项目是什么，库中很可能有一个接近的起点。

总结

Bridge 正是批评者所说的那样：一个庞大、功能密集、包罗万象的主题，需要你努力保持其速度。它也正是粉丝所说的那样：将客户需求转化为精致、品牌化的网站的最快方式，无需从零设计和编码。两者都对。哪个更重要完全取决于你面临的项目。

如果你是需要按时交付网站的代理机构或自由职业者，演示库本身就能改变你的工作效率，捆绑的附加组件意味着你可以承接目录、课程和会员项目，而无需重新配置工具。如果你是重视简洁输出和完全控制的开发者，WPBakery 的短代码基础、缺乏内容 REST API 和块主题支持是真正的障碍，在将长期项目交付给它之前，你应该认真权衡锁定的风险。

我的建议虽然平淡但合理：带着清醒的头脑进入。精简你不用的脚本，积极缓存，保持重要内容可移植，Bridge 将为你服务多年。如果把它当作神奇的“设置后无需操心”按钮，它会在速度测试和迁移中惩罚你。