自定义帖子类型滑块

时间:2014-04-20 10:02:11

标签: wordpress responsive-design slider custom-post-type

我看了看,但我找不到一个Wordpress插件,它给了我Slider中提供的所有以下功能:

  • 从我自己开发的自定义帖子类型中显示自定义帖子 - - 显示特色图片,标题和摘录(不是完整帖子)
  • 以随机顺序显示 - 来自100个该类型的自定义帖子的列表
  • 响应因此适应屏幕/容器尺寸

图像和摘录的大小各不相同。

作为奖励,我想显示一些与帖子相关的自定义分类名称,尽管这并不重要。

我发现除了以随机顺序显示以外的所有内容,或者它们没有响应,或者它们不支持自定义帖子类型,或者他们希望您创建指定特定类型的新自定义帖子类型通过插件。

如果它在那里,我不介意买正确的。

1 个答案:

答案 0 :(得分:5)

woothemes有一个很棒的滑块叫flexslider个人我在我的所有网站上都使用它,你可以在没有插件的情况下使用它。 从我提供的链接下载滑块。

flexslider.css文件和jquery.flexslider-min.js文件复制到主题文件夹中。

header.php

中的

    <link rel="stylesheet" href="<YOUR_THEME_LINK>/flexslider.css" type="text/css">
    <script src="//ajax.googleapis.com/ajax/libs/jquery/1.11.0/jquery.min.js"></script>
    <script src="<YOUR_THEME_LINK>/jquery.flexslider-min.js"></script>
<script type="text/javascript">(function($) {
    $(window).load(function() {
        $('#slider .flexslider').flexslider({
               animation: 'slide',
                slideshowSpeed: 9000,
                animationSpeed: 900,
                pauseOnAction: true,
                pauseOnHover: true,
                controlNav: false,
                directionNav: true, 
                controlsContainer: ".flexslider",
        });
    });
})(jQuery)</script>
主页文件中的

(或您希望滑块显示的任何位置)

<section id="slider">
      <div class="flexslider">
        <ul class="slides">
        <?php query_posts(array('post_type' => '<YOUR_CUSTOM_POST_TYPE>','orderby' => 'rand')); if(have_posts()) : while(have_posts()) : the_post();?>
            <li class="slide">
            <?php the_title(); ?>
            <?php the_excerpt(); ?>
            <?php the_post_thumbnail(); ?>
          </li>
        <?php endwhile; endif; wp_reset_query(); ?>
        </ul>
    </div>
</section>