php 如何在WordPress的Visual Composer(WPBakery)上呈现嵌套元素?

dffbzjpn  于 2023-03-16  发布在  PHP
关注(0)|答案(1)|浏览(114)

我试图做一些自定义元素的视觉 composer 插件(WP面包店)的WordPress的。
我对简单的自定义元素没有问题,但我尝试做一些嵌套元素(一个包含一些子元素的父元素)。我创建子元素没有问题,如果我创建它们,它们会显示在wordpress上,但当我尝试创建父元素时,我可以看到设置元素没有问题,但它没有呈现。
我认为问题出在父类的渲染函数(html)上,但我无法解决它。
父类

<?php

class vcInfoCardContainer extends WPBakeryShortCodesContainer {

    // Element Init
    function __construct() {
        add_action( 'init', array( $this, 'vc_infocardcontainer_mapping' ) );
        add_shortcode( 'vc_infocard', array( $this, 'vc_infocardcontainer_html' ) );
    }

    // Element Mapping
    public function vc_infocardcontainer_mapping() {

        // Stop all if VC is not enabled
        if ( !defined( 'WPB_VC_VERSION' ) ) {
            return;
        }

        // Map the block with vc_map()
        vc_map(
        array(
            'name' => __('VC Info Card Container', 'ex5_vc_elements'),
            'base' => 'vc_infocardcontainer',
            'description' => __('Info Card Container for VC', 'ex5_vc_elements'),
            'category' => __('Ex5 Elements', 'ex5_vc_elements'),
            'icon' => get_template_directory_uri().'/assets/img/vc-icon.png',
            'as_parent' => array('only' => 'vc_infocard'),
            'is_container' => true,
            'js_view' => 'VcColumnView',
            'params' => array(

              array(
                    'type' => 'textfield',
                    'heading' => __('Button text','ex5_vc_elements'),
                    'param_name' => 'button_text',
                    'description' => __('Default is \'Más info\'', 'ex5_vc_elements'),
                    'group' => 'Button',
                )
            ),
        ));
    }

    //render
    public function vc_infocard_html( $atts, $content = null ) {

        // Params extraction
        extract(
            shortcode_atts(
                array(
                ),
                $atts
            )
        );

        $html = '<div class="ex5-vc-info-card-container">' . do_shortcode($content) . '</div>';

        return $html;

    }

}

new vcInfoCardContainer();

儿童班

<?php

class vcInfoCard extends WPBakeryShortCode {

    // Element Init
    function __construct() {
        add_action( 'init', array( $this, 'vc_infocard_mapping' ) );
        add_shortcode( 'vc_infocard', array( $this, 'vc_infocard_html' ) );
    }

    // Element Mapping
    public function vc_infocard_mapping() {

        // Stop all if VC is not enabled
        if ( !defined( 'WPB_VC_VERSION' ) ) {
            return;
        }

        // Map the block with vc_map()
        vc_map(
        array(
            'name' => __('VC Info Card', 'ex5_vc_elements'),
            'base' => 'vc_infocard',
            'description' => __('Info Card for VC', 'ex5_vc_elements'),
            'category' => __('Ex5 Elements', 'ex5_vc_elements'),
            'icon' => get_template_directory_uri().'/assets/img/vc-icon.png',
            'as_child' => array('only' => 'vc_infocardcontainer'),
            'params' => array(
                array(
                    'type' => 'attach_image',
                    'heading' => __( 'Main image', 'ex5_vc_elements' ),
                    'param_name' => 'image',
                    'group' => 'Images',
                ),
                array(
                    'type' => 'attach_image',
                    'heading' => __( 'Icon', 'ex5_vc_elements' ),
                    'param_name' => 'icon',
                    'group' => 'Images',
                ),
                array(
                    'type' => 'colorpicker',
                    'heading' => __( 'Icon background color', 'ex5_vc_elements' ),
                    'param_name' => 'icon_background_color',
                    'value' => __( '#000000', 'ex5_vc_elements' ),
                    'group' => 'Images',
                    ),
                array(
                    'type' => 'textfield',
                    'heading' => __('Title','ex5_vc_elements'),
                    'param_name' => 'Title',
                    'group' => 'Texts',
                ),

                array(
                    'type' => 'textfield',
                    'heading' => __( 'Text', 'ex5_vc_elements' ),
                    'param_name' => 'text',
                    'group' => 'Texts',
                ),
                array(
                    'type' => 'checkbox',
                    'class' => 'one-third',
                    'heading' => __( 'Show link button', 'ex5_vc_elements' ),
                    'param_name' => 'show_button',
                    'value' => 'show',
                    'description' => __( 'Indicates if link button is shown)', 'ex5_vc_elements' ),
                    'group' => 'Button',
                ),
              array(
                    'type' => 'textfield',
                    'heading' => __('Button text','ex5_vc_elements'),
                    'param_name' => 'button_text',
                    'description' => __('Default is \'Más info\'', 'ex5_vc_elements'),
                    'group' => 'Button',
                ),
                array(
                    'type' => 'vc_link',
                    'heading' => __( 'Button link', 'ex5_vc_elements' ),
                    'param_name' => 'button_link',
                    'group' => 'Button',
                ),
            ),
        ));
    }

    //render
    public function vc_infocard_html( $atts ) {

        // Params extraction
        extract(
            shortcode_atts(
                array(
                    'image'                 => '',
                    'icon'                  => '',
                    'icon_background_color' => '#000000',
                    'title'                 => '',
                    'text'                  => '',
                    'show_button'           => '',
                    'button_text'           => 'Más info',
                    'button_link'           => '',
                ),
                $atts
            )
        );
        if (empty($button_text)) $button_text = __( 'Más info', 'ex5_vc_elements' );

        if ($show_button === 'true') {
            if (!empty($button_link)) {
                $button = '<div class="ex5-vcic-button">
                            <a href="'. $button_link .'" target="_self" class="ex5-vcic-link" title="' . $button_text . '">
                                <span class="ex5-vcic-button-text">' . $button_text . '</span>
                            </a>
                        </div>';
            } else {
                $button = '<div class="ex5-vcic-button">
                            <span class="ex5-vcic-button-text">' . $button_text . '</span>
                        </div>';
            }
        } else {
            $button = '';
        }

        $image = wp_get_attachment_image_src($image);
        $icon = wp_get_attachment_image_src($icon);

        //vc_build_link(
        $html = '
            <div class="ex5-vc-infocard">
                <div class="ex5-vcic-content">
                    <div class="ex5-vcic-image">
                        <span>
                            <img src="' .  $image[0] . '" title="history_inner_14" alt="http://oxigeno.">
                        </span>
                    </div>
                    <div class="ex5-vcic-icon" style="background-color: ' . $icon_background_color . '">
                        <img src="' . $icon[0] . '" />
                    </div>
                    <header class="ex5-vcic-headline">
                        <h3>' . $title . '</h3>
                    </header>
                    <div class="ex5-vcic-text">
                        <p>' . $text . '</p>
                    </div>' .
                    $button
                . '</div>
                </div>';

        return $html;

    }

}

new vcInfoCard();
lmvvr0a8

lmvvr0a81#

我已经解决了。短代码调用是错误的,因为它有错误的函数名也。

public function vc_infocard_html( $atts, $content = null ) {

一定是

public function vc_infocardcontainer_html( $atts, $content = null ) {

相关问题