WP add_shortcode属性未更改属性值

我已经创建了带有属性的简码(在google的帮助下), 但是它不会更改属性值。我已经用谷歌搜索了很多这个问题, 但是没有找到解决方案。

这是我的代码：

function infobox_shortcode( $atts ) {

    $array = shortcode_atts(
        array(
            'Background' => 'rgba(45, 90, 171, 0.1)', 'Border' => 'rgba(45, 90, 171, 0.5)', 'Color' => '#2561ea', ), $atts
    );
        return "<div class='note' style='background-color:{$array['Background']};border-color:{$array['Border']};color:{$array['Color']};'>
                <span class='note-icon'><i class='ti ti-info'></i></span>
                <span class='ml-2'>
                    Want to use this template in Shopify, WordPress or other platform?
                </span>
            </div>";

}
add_shortcode( 'InfoBox', 'infobox_shortcode' );

我在主题的index.php页面中这样称呼它：

<?= do_shortcode('[InfoBox Background="red"]'); ?>

但这并没有改变背景属性的值, 我不知道我要去哪里。如果有人帮助我, 那会有所帮助。

#1

属性将是小写字母。

'background' => 'rgba(45, 90, 171, 0.1)', 'border' => 'rgba(45, 90, 171, 0.5)', 'color' => '#2561ea', 

#2

Here, some changes in code. Try this one, may this will give you solution or idea about your issue..

<?php
function infobox_shortcode( $atts ) {

$array = shortcode_atts(
    array(
        'background' => 'rgba(45, 90, 171, 0.1)', 'border' => 'rgba(45, 90, 171, 0.5)', 'color' => '#2561ea', ), $atts);
print_r($atts); // Remove, when you are fine with your atts! 
return 'Hello, World: '.$atts['background'];  //Remove, when you are fine with your expected output! 

$html = '<div class="note" style="background-color:{"'.$atts['background'].'"};border-color:{"'.$atts['border'].'"};color:{"'.$atts['color'].'"};"><span class="note-icon"><i class="ti ti-info"></i></span><span class="ml-2">Want to use this template in Shopify, WordPress or other platform?</span></div>';
return $html; 
}

add_shortcode( 'InfoBox', 'infobox_shortcode' );
?>

#3

这对我来说很棒。

function infobox_shortcode($atts, $content = null)
{

    $a = shortcode_atts(array(
        'background' => 'rgba(45, 90, 171, 0.1)', 'border' => 'rgba(45, 90, 171, 0.5)', 'color' => '#2561ea', ), $atts);

    $content = ($content) ? $content : 'Want to use this template in Shopify, WordPress or other platform?';

    $output = '<div class="note" style="background-color: ' . $a['background'] . '; border: ' . $a['border'] . '; color: ' . $a['color'] . ';">';
    $output .= '<span class="note-icon"><i class="ti ti-info"></i></span>';
    $output .= '<span class="ml-2">';
    $output .= $content;
    $output .= '</span>';
    $output .= '</div>';

    return $output;

}

add_shortcode('InfoBox', 'infobox_shortcode');

#4

这是我的错误, 我使用这样的大写字母创建属性

'Background' => 'rgba(45, 90, 171, 0.1)', 

但这应该是小写字母, 并且现在可以使用了。

'background' => 'rgba(45, 90, 171, 0.1)',