我有一个嵌套元素，名为Hero Slider. Hero slider 是容器，它只能包含Slider item.

然而，我的短代码显示在WPBakery后端中，这可能表明存在语法错误，但我看不到任何导致它出现这种情况的原因：

Here\'s my custom element:

<?php

if (!defined(\'ABSPATH\')) die(\'-1\');

class vcHeroSlider extends WPBakeryShortCode {

    // 1. Define constants at compile time (used in mapping)
    const slug = \'tp_hero_slider\';
    const base = \'tp_hero_slider\';

    // 2. Integrate with hooks
    function __construct() {
        // For the parent wrapper
        add_action( \'vc_before_init\', array( $this, \'tp_heroSlider_mapping\' ) );
        add_shortcode( \'tp_hero_slider\', array( $this, \'tp_heroSlider_html\' ));
        // For child / nested
        add_action( \'vc_before_init\', array( $this, \'tp_heroSlider_content_mapping\' ) );
        add_shortcode( \'tp_hero_slider_content\', array( $this, \'tp_heroSlider_content_html\' ));
    }

    // 3. Map for parent element
    public function tp_heroSlider_mapping() {
        vc_map(
            array(
                \'icon\'                    => get_template_directory_uri().\'/assets/src/images/html.svg\',
                \'name\'                    => __( \'Hero Slider\' , "text-domain" ),
                \'base\'                    => \'tp_hero_slider\',
                \'description\'             => __( \'Add slick slider to your page.\', "text-domain" ),
                \'as_parent\'               => array(\'only\' => \'tp_hero_slider_content\'), // set as parent of the content map/html
                \'content_element\'         => true,
                \'show_settings_on_create\' => false,
                "js_view"                 => \'VcColumnView\',
                "category"                => __(\'Hero\', "text-domain" ),
                \'params\'                  => array(
                    array(
                        "type" => "textfield",
                        "heading" => __( "Extra Class Name", "text-domain" ),
                        "param_name" => "el_class",
                        "description" => __( "Extra class to be customized via CSS", "text-domain" )
                    ),
                    array(
                        \'type\' => \'css_editor\',
                        \'heading\' => __( \'Custom Design Options\', "text-domain" ),
                        \'param_name\' => \'css\',
                        \'group\' => __( \'Design options\', "text-domain" ),
                    ),
                ),
            )
        );
    }

    // 4. Map for child element
    public function tp_heroSlider_content_mapping() {
        vc_map(
            array(
                \'icon\'                      => get_template_directory_uri().\'/assets/src/images/html.svg\',
                \'name\'                      => __(\'Slider Item\', "text-domain" ),
                \'base\'                      => \'tp_hero_slider_content\',
                \'description\'               => __( \'Add slide to hero.\', "text-domain" ),
                "category"                  => __(\'Content\', \'text-domain\'),
                \'content_element\'           => true,
                \'as_child\'                  => array(\'only\' => \'tp_hero_slider\'),
                \'params\'                    => array(

                    array(
                        \'type\' => \'textfield\',
                        \'heading\' => __( \'Title\', \'text-domain\'),
                        \'param_name\' => \'title\',
                        \'value\' => esc_html__( \'\', \'text-domain\'),
                        \'admin_label\' => true,
                        \'weight\' => 0,
                        \'group\' => __( \'Content\', \'my-text-domain\' ),
                    ),

                    array(
                        \'type\' => \'textarea\',
                        \'class\' => \'\',
                        \'heading\' => __( \'Standfirst\', \'text-domain\'),
                        \'param_name\' => \'standfirst\',
                        \'value\' => esc_html__( \'\', \'text-domain\'),
                        \'admin_label\' => false,
                        \'weight\' => 0,
                        \'group\' => __( \'Content\', \'my-text-domain\' ),
                    )

                ),
            )
        );
    }

    // 5. Mapping markup of parent
    public function tp_heroSlider_html( $atts, $content = null) {
        $output = \'\';
        $el_class = \'\';

        extract(
            shortcode_atts(
                array(
                    \'el_class\'  => \'\',
                ), $atts
            )
        );

        static $i = 0;

        $output = \'<div id="slickslider-\'.$i++.\'" class="Slick-Slider heroSlider">\'. do_shortcode($content) .\'</div>\';

        return $output;

    }

    // 6. Mapping markup of child
    public function tp_heroSlider_content_html( $atts, $content = null ) {

    $output = \'\';

        extract(
            shortcode_atts(
                array(
                    \'title\'                 => \'\',
                    \'standfirst\'            => \'\',
                ), $atts
            )
        );

        $background_img = wp_get_attachment_image_src(intval($background_img), \'full\');
        $background_img = $background_img[0];

        $output .= \'
                    <!-- Slide -->
                    <div class="heroSlider__slide">
                    <div class="overlay"></div>
                    \';

        $output .= \'
                        <div class="container">
                            <div class="row justify-content-center justify-content-lg-start">
                                <div class="col-10 col-md-6 d-flex flex-column text-center text-lg-left content">\';

                                    if (!empty($title)) { 
                                        $output .= \'<h1>\' . $title . \'</h1>\'; 
                                    }

                                    if (!empty($standfirst)) {  
                                        $output .= \'<p class="standfist">\' . $standfirst . \'</p>\'; 
                                    }

        $output .= \'
                                </div>
                            </div>
                        </div>

                    </div>
                    <!-- Slide -->
                \';

        return $output;

    }

}

// 7. Add the container functionality (so you can choose a slider element within the hero_slider element
if(class_exists(\'WPBakeryShortCodesContainer\')){
    class WPBakeryShortCode_tp_hero_slider extends WPBakeryShortCodesContainer {}
}

if(class_exists(\'WPBakeryShortCode\')){
    class WPBakeryShortCode_tp_hero_slider_content extends WPBakeryShortCode {}
}

new vcHeroSlider(); ?>