WordPress文章分页

刚对一篇文章想做分页,使用 <!–nextpage–> 标签文章却没有显示出下一页的入口按钮来,此文记录解决方案。

前奏

找到你当前主题的single.php(如果有的话)等文件,查找:<?php the_content(); ?>  然后在后面加上:

<?php wp_link_pages(); ?>

当你在写新文章时,切换到HTML模式下,在你需要分页的地方添加nextpage标签:
<!–nextpage–>
那么就可以实现分页效果了,nextpage标签跟more标签用法是一样的,只不过nextpage标签可以使用多次,以实现对长文章的多次分页。
以下对这种分页效果做一些加强、美化工作..

代码

以下放入single.php,<?php the_content(); ?>函数后面

<?php wp_link_pages(array('before' => '<div class="page-links">', 'after' => '', 'next_or_number' => 'next', 'previouspagelink' => '<span>上一页</span>', 'nextpagelink' => "")); ?>
<?php wp_link_pages(array('before' => '', 'after' => '', 'next_or_number' => 'number', 'link_before' =>'<span>', 'link_after'=>'</span>')); ?>
<?php wp_link_pages(array('before' => '', 'after' => '</div>', 'next_or_number' => 'next', 'previouspagelink' => '', 'nextpagelink' => "<span>下一页</span>")); ?>

CSS样式,放入style.css中

.page-links{margin:10px auto 5px;text-align:center}
.page-links span{display:inline-block;margin:2px;padding:0 9pt;border:1px solid #c01e22;border-radius:2px;background:#c01e22;color:#fff;line-height:30px;cursor:pointer}
.page-links a span{border:1px solid #ebebeb;background:#fff;color:#000;text-decoration:none}
.page-links a:hover span{border:1px solid #c01e22;background:#c01e22;color:#fff;transition:all .2s ease-in 0s}

演示

无演示无真像

点赞
  1. boke112导航说道:

    以前我喜欢文章分页,现在都不喜欢分页了,文章确实很长的话,我就分成多篇文章发布。

    1. 鬼手六说道:

      @boke112导航 代码是从你家扒来的 :lol:

发表评论

电子邮件地址不会被公开。 必填项已用*标注