WPBakery自定义嵌套容器失效：无法删除、子项不显示等问题求助

我帮你梳理几个最容易遗漏的配置点，这些都是我处理WPBakery嵌套容器问题时遇到的常见坑，对照检查应该能解决你的问题：

1. 核心容器标识配置错误 #

这是最关键的一步，很多人照搬示例时会不小心漏掉。你必须在自定义容器的vc_map配置里明确两个参数：

• is_container设为true：告诉WPBakery这是一个可嵌套的容器
• js_view指定正确的视图类：旧版用VcColumnView，新版WPBakery建议用VcColumnItemView

示例代码：

vc_map( array(
    'name' => '自定义嵌套容器',
    'base' => 'custom_nested_container',
    'is_container' => true, // 必须设为true
    'js_view' => 'VcColumnView', // 新版替换为VcColumnItemView
    'content_element' => true,
    'category' => '自定义元素',
    'params' => array(
        // 你的自定义参数
    ),
    'as_parent' => array('only' => 'your_child_shortcode'), // 可选：限制允许的子元素
) );

没这俩配置，编辑器根本不认它是嵌套容器，自然会出现子项不显示、无法删除的问题。

2. 父/子短代码的关联没做 #

光给父容器加as_parent还不够，子短代码必须用as_child明确关联到父容器，不然编辑器不知道哪些元素可以放进这个容器里：

vc_map( array(
    'name' => '自定义子元素',
    'base' => 'custom_child_element',
    'content_element' => true,
    'category' => '自定义元素',
    'as_child' => array('only' => 'custom_nested_container'), // 关联到你的父容器短代码
    'params' => array(
        // 子元素的参数配置
    ),
) );

3. 图标路径或格式不对 #

你看到的带指针的方形是默认占位符，说明图标没加载成功。解决办法：

• 用内置FontAwesome图标：直接写'icon' => 'fa fa-box'（替换成你需要的图标类）
• 自定义图标：必须用绝对URL，比如'icon' => get_template_directory_uri() . '/assets/icons/container-icon.svg'
  别用相对路径，编辑器找不到文件就会显示占位符。

4. 模板文件缺失或未正确输出子内容 #

WPBakery的容器需要模板文件来渲染编辑器和前端的内容，你得创建两个模板：

• 后台编辑器模板：放在主题的vc_templates文件夹下，比如vc_templates/custom_nested_container.php
• 前端模板：放在主题的templates文件夹下，比如templates/custom_nested_container.php

模板里必须包含<?php echo wpb_js_remove_wpautop($content); ?>来输出子元素内容，举个编辑器模板的例子：

<?php
if ( ! defined( 'ABSPATH' ) ) {
    exit;
}
?>
<div class="custom-nested-container">
    <?php echo wpb_js_remove_wpautop($content); ?> <!-- 这行是渲染子项的关键 -->
</div>

没这个模板或者没输出$content，子元素肯定不显示。

5. 缓存或插件冲突 #

如果以上都配置对了，试试清缓存：WPBakery设置里有个"Clear Cache"按钮，也可以清一下WordPress的缓存插件。另外，暂时禁用其他第三方插件，比如Gutenberg兼容插件，有时候它们会和WPBakery的嵌套功能冲突。

内容的提问来源于stack exchange，提问作者Elisa M.