Question

我正在寻找一种使用页面指示器在Wordpress上创建照片库的简单方法。我发现了WP Nivo Slider http://wordpress.org/extend/plugins/wp-nivo-slider/screenshots/但它在它可以做什么以及什么时候可以使用它时非常严格。

理想情况下，我想在HTML中包含一堆图像，并在标签上自动拾取一些滑块并将它们组合成一个...任何简单但灵活的API都会非常棒！

Answer 1

我没有看过Nivo Slider Wordpress插件及其限制，但Standalone Nivo Slider可以在Wordpress安装中轻松使用，并为您提供了很大的灵活性。我不确定您的页面指示符是什么意思，但如果您愿意，可以从页面/帖子中提取信息。举一个例子，下面是一些代码，我用来创建一个图像滑块，使用自定义查询从特定类别的帖子中拉出特色图像。

     <!-- Slideshow -->
        <div id="nivowrapper">
          <div id="nivoslider">
            <?php 
            $featured_slide = new WP_Query('cat=4&showposts=-1');
            while ($featured_slide->have_posts()) : $featured_slide->the_post();
              ?>
               <?php 

                if (function_exists('has_post_thumbnail') && has_post_thumbnail()) {
                    $img_height = 293;
                    $img_width  = 960;

                    slider_image(thumb_url(),$img_width,$img_height);

                }
              ?>
            <?php endwhile; ?>
            <?php wp_reset_query(); ?>
          </div>
        </div>
    <!-- Slideshow End -->

这使用我的functions.php中的方法slider_image（）以及方法thumb_url（） - 原因是它使用timthumb来确保如果客户端上传了一个东西，整个东西不会向南移动图片大小不正确的特色帖子类别。

在functions.php中

 # This function returns the attached Featured image in the page / post
 function thumb_url(){  
   $thumb_src = wp_get_attachment_image_src(get_post_thumbnail_id($post->ID), array( 960,960 ));
   return $thumb_src[0];
 }


# This function resizes the featured image to the requested proportions via timthumb. 
function slider_image($image_source,$width,$height) {
  global $post;

  echo '<img src="'.get_bloginfo('template_directory').'/timthumb.php?src='.$image_source.'&amp;h='.$height.'&amp;w='.$width.'&amp;zc=1" alt="" title="'.get_the_title().'" />';
}

我有点像Nivo Slider一样，因为Firefox中的标题消失，从未得到解决。你看过Flexslider 2了吗？我认为它在技术上仍处于测试阶段，但它非常棒，并且具有高度可配置性。我刚刚在一个网站上使用它，这太棒了（尤其是你可以使用手指滑动在平板电脑和智能手机上滚动）。

希望这有点帮助。

修改

我意识到我应该为读取此内容且未使用Nivo Slider独立版的任何人添加最后一位。你需要初始化Nivo Slider。包括Nivo Slider Javascript文件（在您的functions.php中将其排入队列）和CSS，并将以下代码放在头部或关闭正文标记之前。您可以根据需要更改参数;

  <script type="text/javascript">
    jQuery(window).load(function($) {

      jQuery('#nivoslider').nivoSlider({
        effect:'fade',
        slices:15,
        animSpeed:700, 
        pauseTime:7000,
        controlNav: false,
        directionNav: true,
        directionNavHide: false,
        captionOpacity: 1
      });

    });
    </script>

Answer 2

我使用riva slider pro（http://rivaslider.com/），这是一个付费插件，但效果非常好并且易于使用。您可以选择是否要将缩略图，图标或小指示点作为页面指示器输出。它包含在包中的主题，但您可以在管理员中覆盖每个滑块的CSS。

唯一的缺点;它没有响应。我编辑了我的反应灵敏，但开箱即用的高度和宽度都是固定的 - 这有点烦人。

要使用它，您只需设置幻灯片，然后使用短代码将其嵌入到帖子/页面中 - 听起来就像您正在寻找的那样。

在wordpress上寻找照片的Nivo滑块

2 个答案: