我是wordpress新手,我需要基于Nivo库创建一个滑块。在这里,我想使用以下语法创建短代码:
[slider]
[image]http: //www .domain.com/images/1.jpg[/image]
[image]http: //www .domain.com/images/2.jpg[/image]
[image]http: //www .domain.com/images/n.jpg[/image]
[/slider]
输出代码如下:
<div class="slider-wrapper theme-default">
<div id="slider" class="nivoSlider">
<img src="image-path.jpg" data-thumb="image-path.jpg" alt="text"/>
<img src="image-path.jpg.jpg" data-thumb="image-path.jpg" alt="text"/>
<img src="image-path.jpg" data-thumb="image-path.jpg" alt="text"/>
</div>
<div id="htmlcaption" class="nivo-html-caption">
<strong>This</strong> is an example of a <em>HTML</em> caption with <a href="#">a link</a>.
</div>
</div>
我对php也没有太多经验,我尝试过这样做:
function nivo_slider_func($atts)
{
extract(shortcode_atts(array(\'gallery_name\' => \'\'), $atts));
$output = "<div class=\'slider-wrapper theme-default\'>";
$output .= "<div id=\'slider\' class=\'nivoSlider\'>";
$atts = shortcode_atts(
array(
\'url\' => \'\',
\'title\' => \'\'
), $atts);
foreach ($atts as $atts) {
$src = $atts[\'url\'];
$title = $atts[\'title\'];
$output .= "<img src=\'" . $src . "\' data-thumb=\'" . $src . "\' alt=\'" . $title . "\' />";
}
$output .= "</div></div>";
return $output;
}
add_shortcode( \'slider\', \'nivo_slider_func\' );
但它不能正常工作。你能帮我一下吗?
提前感谢!
SO网友:Gembel Intelek
这将是嵌套的短代码,因此需要[滑块]和[图像]短代码
add_shortcode( \'nivo_slider\', \'nivo_slider_func\' );
function nivo_slider_func( $atts, $content = null ) {
$output = \'<div class="slider-wrapper theme-default">\';
$output .= \'<div id="slider" class="nivoSlider">\';
$output .= do_shortcode($content);
$output .= \'</div></div>\';
return $output;
}
add_shortcode( \'image\', \'nivo_image_shortcode\' );
function nivo_image_shortcode( $atts, $content = null ) {
extract( shortcode_atts( array(
\'title\' => \'\'
), $atts )
);
return \'<img src="\'.$content.\'" data-thumb="\'.$content.\'" title="\'.$atts[\'title\'].\'" alt="\'.$atts[\'title\'].\'" />\';
}