使用背景图像的全宽滑块Flexlider WordPress

我希望有人能提供帮助，我已经使用Flexslider创建了一个滑块插件，可以使用自定义的帖子类型等。无论如何，这一切都很好，除了我想将图像设置为li中不包含的Flexslider的背景。我似乎不明白为什么语法是错误的。如果有人能帮忙那就太好了。这是我到目前为止的情况。实例here 我想要实现的目标。基本上，我需要保持一个固定的高度，并在图像发生故障时对其进行裁剪，这样它就不会像flexslider那样在移动设备上变得很小。我还需要它随着屏幕大小的增加进行缩放，这样它就不会像素化。

   <?php 
// Function used to display slider
function cs_get_slider(){

    $cs_slider= \'<div class="flexslider"><ul class="slides">\';

                query_posts( array( 
                         \'post_type\' => \'slider-image\',
                         \'posts_per_page\' => 10000 ) 
                 ); 

    if (have_posts()) : while (have_posts()) : the_post();

    $img= get_the_post_thumbnail(get_the_ID());
    $caption =  caption_content();      

    $cs_slider.=\'<li style="background: url(\'<?php echo $background_image[\'url\'] ?>\')">\'.$img.\'<div class="banner-caption meta">\'.$caption. \'</div></li>\';

    endwhile; endif; 
    wp_reset_query();
    $cs_slider.= \'</ul></div>\';

    return $cs_slider;
}

function cs_slider_shortcode(){
    $cs_slider= cs_get_slider();
    return $cs_slider;
}  
add_shortcode(\'slider\', \'cs_slider_shortcode\');
?>

这就是一切崩溃的地方。

$cs_slider.=\'<li style="background: url(\'<?php echo $background_image[\'url\'] ?>\')">\'.$img.\'<div class="banner-caption meta">\'.$caption. \'</div></li>\';

提前感谢！

<?php $post_thumbnail_id = get_post_thumbnail_id(); $featured_image = wp_get_attachment_image_src( $post_thumbnail_id, \'full\' ); //The second argument is the size ?> <div style="background-image: url(<?php echo $featured_image[0]; ?>);"> //Your html code </div>

相关推荐