WordPress创建具有自定义值的简码 [英] Wordpress creating shortcode with custom value

问题描述

您好，我创建了一个简单的短代码来显示图像开发人员.

Hello I have created a simple shortcode to display an image devider.

将此添加到我的函数php中:

added this to my functions php:

add_shortcode( 'divider', 'shortcode_insert_divider' );
function shortcode_insert_divider( ) {
return '<div class="divider"></div>';
}

这是CSS:

.divider {
  width: 100%;
  height: 55px;
  background-image: url("http....")
}

所以这是简码:

 [divider]

现在，我想为每次使用简码定义一个不同的背景图像.我如何实现类似这样的东西:

Now i'd like to define a different Background image for each time i use the shortcode. How can i implement something like:

[divider src="http://domain.com/image.jpg"]

??? 有任何想法吗?

??? Any Ideas?

推荐答案

代码如下:

function shortcode_insert_divider( $atts ) {

    // Assign default values
    $src_default_value = "";
    $color_default_value = "";

    extract( shortcode_atts( array(
        'src' => $src_default_value,
        'color' => $color_default_value,
    ), $atts ) );

    $html = '<div class="divider" style="color:' . $color . ';background:transparent url(\'' . $src . '\') no-repeat 0 0;"></div>';

    return $html;
}
add_shortcode( 'divider', 'shortcode_insert_divider' );

"shortcode_atts"允许您捕获这些属性，而"extract"函数将使您可以轻松地从数组中检索数据.

The "shortcode_atts" allows you get catch these attributes and the "extract" function will allow you go retrieve the data from the array in a easy way.

这篇关于WordPress创建具有自定义值的简码的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！