I´m new with wordpress and I need to create a slider based on Nivo library. There I would like to create the shortcode using this syntax:
[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]
The output code would be like this:
<div class="slider-wrapper theme-default">
<div id="slider" class="nivoSlider">
<img src="https://wordpress.stackexchange.com/questions/56135/image-path.jpg" data-thumb="https://wordpress.stackexchange.com/questions/56135/image-path.jpg" alt="text"/>
<img src="image-path.jpg.jpg" data-thumb="https://wordpress.stackexchange.com/questions/56135/image-path.jpg" alt="text"/>
<img src="https://wordpress.stackexchange.com/questions/56135/image-path.jpg" data-thumb="https://wordpress.stackexchange.com/questions/56135/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>
I have not so much experience with php either and I tried to do something like this:
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' );
But it does not work correctly. Could you help me with this, please?
Thanks in advance!