使用 get_posts 引导 acf wp 分页

Question

我在创建一个与我的 get_posts($args) 做出反应的导航时遇到了这个问题。已经尝试了所有方法，我在网上只能找到使用 wp 查询完成的解决方案。

我使用 ACF 和 Bootstrap，所以我真的很想坚持使用 get_posts。

下面的代码是我当前的代码，它完美地只显示 5 个帖子。但是如何为分页创建导航？

<div class="articles">
    <?php
    $args = array(  //'numberposts' => -1
                    'orderby' => 'post_date',
                    'order' => 'DESC',
                    'post_type' => 'post',
                    'post_status' => 'publish',
                    'posts_per_page' => 5,
                    'paged' => $paged,);
    $posts= get_posts( $args );
    if ( $posts ) :
        $counter = 1;
        foreach ( $posts as $p ) : 
        $classCount = 'post-'.$counter;
        if( $classCount == 'post-1' ) : echo '<div class="mediumPost col-xs-12 col-sm-6 col-md-6 col-lg-6">';
        elseif( $classCount == 'post-2' || $classCount == 'post-3' ) : echo '<div class="smallPost col-xs-12 col-sm-6 col-md-6 col-lg-6">';
        elseif( $classCount == 'post-4' ) : echo '<div class="largePost col-xs-12 col-sm-12 col-md-12 col-lg-12">';
        elseif( $classCount == 'post-5' ) : echo '<div class="mediumPost col-xs-12 col-sm-6 col-md-6 col-lg-6">';
        elseif( $classCount == 'post-6' || $classCount == 'post-7' ) : echo '<div class="smallPost col-xs-12 col-sm-6 col-md-6 col-lg-6">';
        else : echo '<div class="smallPost col-xs-12 col-sm-6 col-md-6 col-lg-6">';
        endif; ?>
            <?php $postImg = get_field('post_image', $p->ID ); if( !empty($postImg) ): ?>
                <img src="<?php echo $postImg['url']; ?>" alt="<?php if(!empty($postImg['alt'])): echo $postImg['alt']; else : echo the_title(); endif; ?>" />
            <?php endif; ?>
            <div class="iconBox">
                <?php $getIcon = get_field('post_type', $p->ID); ?>
                <?php $catIcon = get_field($getIcon, 132); ?>
                    <?php if( !empty($catIcon) ): ?>
                        <img class="iconImg" src="<?php echo $catIcon['url']; ?>" alt="<?php if(!empty($catIcon['alt'])): echo $catIcon['alt']; else : echo the_title(); endif; ?>" />
                    <?php endif; ?>
            </div>
            <?php $categories = get_the_category($p->ID);
            $category_id = $categories[0]->cat_ID; ?>                
            <?php if( $category_id == 9 ) : ?>
            <h4 data-toggle="modal" data-target="#myModal-<?php echo $counter ?>"><?php echo get_the_title( $p->ID ); ?></h4>
            <span class="articles-btn" data-toggle="modal" data-target="#myModal-<?php echo $counter ?>">Watch link</span>
            <!-- Modal -->
            <div class="modal fade" id="myModal-<?php echo $counter ?>" tabindex="-1" role="dialog" aria-labelledby="myModalLabel">
                <div class="modal-dialog modal-lg">
                    <div class="modal-content">
                        <div class="modal-header">
                            <button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">&times;</span></button>
                            <h5 class="modal-title" id="myModalLabel"><?php echo get_the_title( $p->ID ); ?></h5>
                        </div>
                        <div class="modal-body">
                            <div class="embed-container">
                                <?php // get iframe HTML
                                $iframe = get_field('post_embed', $p->ID);
                                // use preg_match to find iframe src
                                preg_match('/src="(.+?)"/', $iframe, $matches);
                                $src = $matches[1];
                                // add extra params to iframe src
                                $params = array(
                                    'controls'    => 1,
                                    'hd'        => 1,
                                    'autohide'    => 1
                                );
                                $new_src = add_query_arg($params, $src);
                                $iframe = str_replace($src, $new_src, $iframe);
                                // add extra attributes to iframe html
                                $attributes = 'frameborder="0"';
                                $iframe = str_replace('></iframe>', ' ' . $attributes . '></iframe>', $iframe); ?>
                                <?php echo $iframe; ?>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
            <?php else : ?>
                <a href="<?php echo get_permalink( $p->ID ); ?>"><h4><?php echo get_the_title( $p->ID ); ?></h4></a>
                <a href="<?php echo get_permalink( $p->ID ); ?>"><span class="articles-btn">READ MORE</span></a>
            <?php endif; ?>
        </div> <!--postSize div-->
        <?php $counter++; if ( 11 === $counter ) $counter = 1; endforeach; wp_reset_postdata();?>
    <?php endif; ?>
</div>

Answer 1

在你的functions.php中复制这个函数

function custom_pagination($numpages = '', $pagerange = '', $paged='') {

  if (empty($pagerange)) {
    $pagerange = 2;
  }

  /**
   * This first part of our function is a fallback
   * for custom pagination inside a regular loop that
   * uses the global $paged and global $wp_query variables.
   * 
   * It's good because we can now override default pagination
   * in our theme, and use this function in default queries
   * and custom queries.
   */
  global $paged;
  if (empty($paged)) {
    $paged = 1;
  }
  if ($numpages == '') {
    global $wp_query;
    $numpages = $wp_query->max_num_pages;
    if(!$numpages) {
        $numpages = 1;
    }
  }

  /** 
   * We construct the pagination arguments to enter into our paginate_links
   * function. 
   */
  $pagination_args = array(
    'base'            => get_pagenum_link(1) . '%_%',
    'format'          => 'page/%#%',
    'total'           => $numpages,
    'current'         => $paged,
    'show_all'        => False,
    'end_size'        => 1,
    'mid_size'        => $pagerange,
    'prev_next'       => True,
    'prev_text'       => __('«'),
    'next_text'       => __('»'),
    'type'            => 'plain',
    'add_args'        => false,
    'add_fragment'    => ''
  );

  $paginate_links = paginate_links($pagination_args);

  if ($paginate_links) {
    echo "<nav class='custom-pagination'>";
      echo "<span class='page-numbers page-num'>Page " . $paged . " of " . $numpages . "</span> ";
      echo $paginate_links;
    echo "</nav>";
  }

}

把它放在你的CSS中

.custom-pagination span,
.custom-pagination a {
  display: inline-block;
  padding: 2px 10px;
}
.custom-pagination a {
  background-color: #ebebeb;
  color: #ff3c50;
}
.custom-pagination a:hover {
  background-color: #ff3c50;
  color: #fff;
}
.custom-pagination span.page-num {
  margin-right: 10px;
  padding: 0;
}
.custom-pagination span.dots {
  padding: 0;
  color: gainsboro;
}
.custom-pagination span.current {
  background-color: #ff3c50;
  color: #fff;
}

将它放在 get_posts() 中的参数列表上方

$paged = ( get_query_var('paged') ) ? get_query_var('paged') : 1;

在底部获取帖子循环后粘贴此

<?php
      if (function_exists(custom_pagination)) {
        custom_pagination(count($posts) ,"",$paged);
      }
    ?>