php - Avada 自定义元素创建

Question

我正在使用 WordPress Avada 主题。我想创建一个自定义元素。我在子主题 function.php 文件中使用了以下代码。我可以在管理面板中看到元素。

问题是当我输入元素字段值并单击“保存”按钮时，它什么也不做。我检查了控制台，发现一个错误是“Uncaught TypeError: Cannot read property 'replace' of undefined”。单击“保存”按钮后，请参阅随附的屏幕截图。

function fusion_element_image_with_text_overlay() {     fusion_builder_map( 
        array(
            'name'            => esc_attr__( 'Image with Text Overlay', 'fusion-builder' ),
            'shortcode'       => 'fusion_image_with_text_overlay',
            'icon'            => 'fusiona-image',
            'preview'         =>  get_stylesheet_directory().'/avada-templates/js/previews/fusion-image-with-text-overlay.php',
            'preview_id'      => 'fusion-builder-block-module-image-with-text-overlay-preview-template',
            'allow_generator' => true,
            'params'          => array(
                array(
                    'type'        => 'textfield',
                    'heading'     => esc_attr__( 'Title', 'fusion-builder' ),
                    'description' => esc_attr__( 'Enter overlay text of image.', 'fusion-builder' ),
                    'param_name'  => 'element_image_overlay_text',
                    'value'       => esc_attr__( '', 'fusion-builder' ),
                ),
                array(
                    'type'        => 'range',
                    'heading'     => esc_attr__( 'Title Font Size', 'fusion-builder' ),
                    'description' => esc_attr__( 'Select the font size to be used ( In pixel ).', 'fusion-builder' ),
                    'param_name'  => 'element_image_overlay_text_size',
                    'value'       => '24',
                    'min'         => '24',
                    'max'         => '250',
                    'step'        => '1',
                ),
                array(
                    'type'        => 'colorpicker',
                    'heading'     => esc_attr__( 'Select Title Color.', 'fusion-builder' ),
                    'description' => esc_attr__( 'This field allows you to select the color with a hex value.', 'fusion-builder' ),
                    'param_name'  => 'element_image_overlay_text_color',
                    'value'       => '#FFFFFF',
                ), 
                array(
                    'type'        => 'upload_images',
                    'heading'     => esc_attr__( 'Background Image', 'fusion-builder' ),
                    'description' => esc_attr__( 'Upload or select images.', 'fusion-builder' ),
                    'param_name'  => 'element_background_image',
                    'value'       => '',
                ),
                array(
                    'type'        => 'select',
                    'heading'     => esc_attr__( 'Background Position', 'fusion-builder' ),
                    'description' => esc_attr__( 'Select background position', 'fusion-builder' ),
                    'param_name'  => 'element_background_image_position',
                    'value'       => array(
                        'left top'     => esc_attr__( 'Left Top', 'fusion-builder' ),
                        'left center'     => esc_attr__( 'Left Center', 'fusion-builder' ),
                        'left bottom'     => esc_attr__( 'Left Bottom', 'fusion-builder' ),
                        'right top'     => esc_attr__( 'Right Top', 'fusion-builder' ),
                        'right center'     => esc_attr__( 'Right Center', 'fusion-builder' ),
                        'right bottom'     => esc_attr__( 'Right Bottom', 'fusion-builder' ),
                        'center top'     => esc_attr__( 'Center Top', 'fusion-builder' ),
                        'center center'     => esc_attr__( 'Center Center', 'fusion-builder' ),
                        'center bottom'     => esc_attr__( 'Center Bottom', 'fusion-builder' ),
                    ),
                ),
                array(
                    'type'        => 'dimension',
                    'heading'     => esc_attr__( 'Custom Background Position', 'fusion-builder' ),
                    'description' => esc_attr__( 'Background position selection will be ignored if custom background position is avaialbel. E.g. 50%', 'fusion-builder' ),
                    'param_name'  => 'element_custom_background_image_position',
                    'class'       => 'hide', 
                    'value'       => array(
                        'position_top'    => '',
                        'position_left'  => '',
                    ),
                ),
            ),
        )   ); 
} 
add_action( 'fusion_builder_before_init','fusion_element_image_with_text_overlay' );

我是 Avada 主题的新手。因此，如果我实施错误，请纠正我。请指导我解决这个问题。

标签： phpwordpress

Answer 1

为了解决这个问题，我在主题的 functions.php 文件中添加了一个短代码，如下所示

function fusion_image_with_text_overlay_output($atts){
    return /* HTML which I want to output */
}
add_shortcode('fusion_image_with_text_overlay','fusion_image_with_text_overlay_output');