【问题标题】:WordPress: Get Post Thumbnail Outside of LoopWordPress:在循环之外获取帖子缩略图
【发布时间】:2014-11-13 07:54:32
【问题描述】:

我正在尝试获取循环之外的轮播缩略图指示器的帖子缩略图。

目前它设置了图像占位符,但我需要每个拇指来代表当前选定的帖子。

 <?php 
    $items = new WP_Query(array(
            'post__in' => get_option('sticky_posts'),
            'caller_get_posts' => 1,
    'posts_per_page' => 10,
    'meta_key' => '_thumbnail_id'
    ));
    $count = $items->found_posts;
    ?>
              <div id="myCarousel" class="carousel slide" data-ride="carousel"> 

                <!-- Wrapper for slides -->
                <div class="carousel-inner">
                  <?php 
            $ctr = 0;
            while ( $items->have_posts() ) :
              $items->the_post();
              $url = wp_get_attachment_url( get_post_thumbnail_id($post->ID) );
              $custom = get_post_custom($post->ID);
              $link = $custom["more-link"][0];
              $class = $ctr == 0 ? ' active' : '';
            ?>
                  <div class="item<?php echo $class; ?>" id="<? the_ID(); ?>">
                    <?php the_post_thumbnail( 'full', array (
                    'class' => 'img-responsive'
                    )); ?>
                    <div class="carousel-caption">
                      <h3><a href="<?php the_permalink(); ?>">
                        <?php the_title(); ?>
                        </a></h3>
                    </div>
                  </div>
                  <!-- End Item -->

                  <?php $ctr++; 
            endwhile;  ?>
                </div>
                <!-- End Carousel Inner -->

                <div class="thumbs">
                  <div class="row">
                    <div class="col-md-2 active item" data-target="#myCarousel" data-slide-to="0"><a href="#"><img src="http://placehold.it/1200x440/999999/cccccc" class="img-responsive"></a></div>
                    <?php for($num = 1; $num < $count; $num++){ ?>
                    <div class="col-md-2 item" data-target="#myCarousel" data-slide-to="<?php echo $num; ?>"><a href="#"><img src="http://placehold.it/1200x440/999999/cccccc" class="img-responsive"></a></div>
                    <?php } ?>
                  </div>
                </div>
              </div>
              <!-- End Carousel -->

【问题讨论】:

    标签: wordpress loops thumbnails


    【解决方案1】:

    代替:

    <?php for($num = 1; $num < $count; $num++){ ?>
        <div class="col-md-2 item" data-target="#myCarousel" data-slide-to="<?php echo $num; ?>">
            <a href="#">
                <img src="http://placehold.it/1200x440/999999/cccccc" class="img-responsive">
            </a>
        </div>
    <?php } ?>
    

    尝试使用:

    <?php $counter2 = 0; ?>
    <?php while ( $items->have_posts() ) : $items->the_post(); ?>
        <?php $counter2++; ?>
        <div class="col-md-2 item <?php echo $counter2 == 1 ? 'active' : ''; ?>" data-target="#myCarousel" data-slide-to="<?php echo $counter2; ?>">
            <a href="#">
                <?php
                the_post_thumbnail('thumbnail', array(
                    'class' => 'img-responsive'
                ));
                ?>
            </a>
        </div>
    <?php endwhile; ?>
    

    这将与您的标记一起显示,但使用缩略图而不是占位符。

    【讨论】:

    • 谢谢!这确实很好,但是,它会删除我在活动项目上设置的红色边框,直到单击一个项目。
    • 这并没有解决任何问题,还导致了其他问题。单击列表的最后一个(第 6 个帖子缩略图)时,它会删除该缩略图的主图像......然后当单击其他拇指时,将活动的红色边框拧紧并将其放在我没有点击的其他拇指上。跨度>
    • 抱歉,我无法测试我发布的代码。我已经再次编辑它 - 现在应该可以正常工作了。
    • 更好,但仍然是个问题。尽管查询说了什么,我有这个设置只显示 6 个帖子。首次加载时,第一个帖子拇指有一个红色边框。当我从一个拇指单击到另一个拇指时,它工作正常,但是当我单击最后一个(第 6 个拇指)时,它开始产生问题。 1) 单击后,我会丢失第 6 个拇指主图像。 2)点击后,活动的拇指都乱了。
    • 这超出了问题范围。我相信您已经解决了最初的问题,并且您描述的新问题与您的 javascript 相关,而不是与 PHP 循环代码有关。所以我建议为这个问题打开一个新问题,因为它与这个问题没有直接关系。
    猜你喜欢
    • 1970-01-01
    • 2017-12-13
    • 2010-11-26
    • 2016-03-05
    • 2011-03-15
    • 1970-01-01
    • 1970-01-01
    • 2014-03-12
    • 2021-04-06
    相关资源
    最近更新 更多