WordPress 给长文章内容分页(一)

作者:王某人 2018-07-29 219 0

我们可能会碰到这样一种情况:发布的文章或页面太长,想要把一篇文章分成好几页,有的时候是为了方便用户阅读,有的时候可以说是为了SEO,到底为了什么目的,那是你的事儿了,我们在这里只是告诉你如何实现Wordpress的文章分页功能。

WordPress系统是内置分页功能的,要实现它极其简单,只需要在你想要分页的地方加入下面的代码即可(注意,是在文本编辑模式下):

<!–nextpage–>

但还有一个问题.要让这个代码真正能够实现其分页功能,还需要你所使用的Wordpress主题支持,Wordpress的默认主题是支持的,如果你的主题不支持,那解决方法也很简单,找到你主题文件内的single.php里的下面这行代码:

<?php the_content(); ?>

在这行代码后面添加如下所示的代码,即可实现简单的分页功能。

<?php wp_link_pages(); ?>

虽然经过上面两步,已经可以实现长文章的分页功能了。但是不是那么好看,下面我们就把它美化一下,让分页效果更完美。

<?php wp_link_pages(array('before' => '<div class="fenye">分页阅读:', 'after' => '', 'next_or_number' => 'next', 'previouspagelink' => '上一页', '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' => "下一页")); ?>

直接把下面这些代码,放到主题文件 style.css 最后面。

/**页面分页**/
.fenye{text-align:center;margin:0px auto 10px;font-weight:bold}
.fenye span{background-color:#DDDDDD;color:#fff;font-weight: bold;margin:0px 1px;padding:1px 6px;display:inline-block;text-decoration:none;border:1px solid #e0e0e0;}
.fenye a{text-decoration:none;}
.fenye a span{background-color:#F6F6E8;font-weight: normal;color: #000;text-decoration: none;}
.fenye a:hover span{background-color:#DDDDDD;color: #fff;}

最后显示效果如下图所示: 

2013226101314990.gif

关键字:

发表评论