Question

所以我在WordPress中创建了一个bootstrap轮播，它运行正常。我唯一的问题是，当我点击图片时，它不会把我带到特定的文章。我该如何解决这个问题？这是我的代码：

<div class="container slider-container">
  <div id="myCarousel" class="carousel slide" data-ride="carousel">
  <!-- Indicators -->
    <ol class="carousel-indicators">
      <li data-target="#myCarousel" data-slide-to="0" class="active"></li>
      <li data-target="#myCarousel" data-slide-to="1"></li>
      <li data-target="#myCarousel" data-slide-to="2"></li>
    </ol>

<!-- Wrapper for slides -->
 <div class="carousel-inner" role="listbox">
<?php $slider = get_posts(array('post_type' => 'post', 'posts_per_page' => 3)); ?>
  <?php $count = 0; ?>
  <?php foreach($slider as $slide): ?>
  <div class="item <?php echo ($count == 0) ? 'active' : ''; ?>">
      <a href="<?php the_permalink(); ?>" rel="bookmark" title="Permanent Link to <?php the_title_attribute(); ?>">
        <img src="<?php echo wp_get_attachment_url( get_post_thumbnail_id($slide->ID)) ?>" class="img-responsive"/>
    </a>
  </div>
  <?php $count++; ?>
<?php endforeach; ?>

<!-- Left and right controls -->
    <a class="left carousel-control" href="#myCarousel" data-slide="prev">
      <span class="glyphicon glyphicon-chevron-left"></span>
      <span class="sr-only">Previous</span>
    </a>
    <a class="right carousel-control" href="#myCarousel" data-slide="next">
       <span class="glyphicon glyphicon-chevron-right"></span>
       <span class="sr-only">Next</span>
    </a>
  </div>
</div>

Answer 1

将<?php the_permalink(); ?>更改为<?php echo get_permalink($slide->ID); ?>。

为什么：

the_permalink()获取循环中当前帖子的当前永久链接。你不在循环中，你只是查询帖子。通过更改为get_permalink()并将ID传递给函数，您将获得此幻灯片的特定永久链接。

请参阅get_permalink() here。

Answer 2

这是我的宗旨，我在网站上使用过，希望对您有所帮助！

`<?php
     $args = array(
     'post_type' => 'slide',
     'posts_per_page' => -1,
     'order' => 'ASC',
   );
$slide = new WP_Query($args);?>
<?php if ($slide->have_posts()): ?>
<div id="slider">
        <div class="bd-example">
            <div id="carouselExampleCaptions" class="carousel slide carousel-fade" data-ride="carousel" data-interval=10000>
                <div class="">
                    <ol class="carousel-indicators">
                        <?php $i = 0;while ($slide->have_posts()): $publicity->the_post();?>
                            <li data-target="#carousel-example-generic" data-slide-to="<?php echo $i ?>" class="<?php if ($i === 0): ?>active<?php endif;?>"></li>
                        <?php $i++; endwhile;?>
                    </ol>
                    <div class="carousel-inner">
                        <?php $i = 0;while ($slide->have_posts()): $slide->the_post();?
                                <div class="carousel-item <?php if (0 == $i) {echo ' active';}?>" style="background:url('<?php the_post_thumbnail_url('full');?>') center center no-repeat; background-size: cover; min-height: 100vh;">
                                    <div class="carousel-caption d-none d-md-block">
                                        <div class="row align-items-center ">
                                            <div class="col-lg-4 title">
                                                <span><?php the_title();?></span>
                                                <h2><?php the_content();?></h2>
                                            </div>
                                        </div>
                                    </div>
                                </div>
                        <?php $i++;endwhile;?>
                    </div>
                </div>
            </div>
        </div>
    </div>
   <?php wp_reset_postdata();endif;?>
`

用于Wordpress中动态内容的Bootstrap轮播

2 个答案: