`
economist
  • 浏览: 5779 次
  • 性别: Icon_minigender_1
  • 来自: 北京
社区版块
存档分类
最新评论

WordPress4分页

    博客分类:
  • PHP
阅读更多
入门菜鸟,希望能给和菜鸟相互取暖

最近在改造wordpress,自己写代码做了个分页
1,在自己主题下的style.css中增加如下css
.pagination {
    width: auto;
    display: block;
    text-align: center;
    margin: 30px;
}
.pagination a {
    background-color: #eee;
    text-decoration: none;
    color: #999;
    font-size: 18px;
    padding: 0px 10px;
    line-height: 32px;
    height: 32px;
    margin: 0px 0.5px;
}
.pagination a.page-btn {
    width: 40px;
}
.pagination a.page-btn .icon-prev {
    position: absolute;
    width: 0px;
    height: 0px;
    border-top: 6px solid transparent;
    border-bottom: 6px solid transparent;
    border-left: 6px solid transparent;
    border-right: 6px solid transparent;
    border-left: none;
    border-right: 6px solid #999;
    left: 50%;
    margin-left: -3px;
    top: 50%;
    margin-top: -6px;
    -webkit-transition: all 0.1s ease;
    transition: all 0.1s ease;
}
.pagination a.page-btn .icon-next {
    position: absolute;
    width: 0px;
    height: 0px;
    border-top: 6px solid transparent;
    border-bottom: 6px solid transparent;
    border-left: 6px solid transparent;
    border-right: 6px solid transparent;
    border-right: none;
    border-left: 6px solid #999;
    left: 50%;
    margin-left: -3px;
    top: 50%;
    margin-top: -6px;
    -webkit-transition: all 0.1s ease;
    transition: all 0.1s ease;
}
.pagination a:hover {
    color: #fff;
}
.pagination a:hover .icon-prev {
    width: 0px;
    height: 0px;
    border-top: 6px solid transparent;
    border-bottom: 6px solid transparent;
    border-left: 6px solid transparent;
    border-right: 6px solid transparent;
    border-left: none;
    border-right: 6px solid #fff;
}
.pagination a:hover .icon-next {
    width: 0px;
    height: 0px;
    border-top: 6px solid transparent;
    border-bottom: 6px solid transparent;
    border-left: 6px solid transparent;
    border-right: 6px solid transparent;
    border-right: none;
    border-left: 6px solid #fff;
}
.pagination span {
    display: inline-block;
    margin: 0px 1px;
    color: #adadad;
    font-size: 18px;
}


2, 将如下代码copy到自己theme的functions.php中,

/**
/**
 * @param int $total_pages
 *  总页数
 * @param int $paged
 *  当前页数从1计
 * @param int $visible_count
 *  可见的页码数,接受自定义,如果自定义小于1或者大于max,置为max
 *
 *@author shandaiwang
 */
define('MAX_VISIBLE_PAGE_COUNT', 20);
function pagination($total_pages = 0, $current_page = 1, $visible_count = MAX_VISIBLE_PAGE_COUNT){
    // 入参适配
    if($total_pages <= 1) {
        return;
    }
    if($current_page <= 0) {
        $current_page = 1;
    }
    if($visible_count <= 0 || $visible_count > MAX_VISIBLE_PAGE_COUNT) {
        $visible_count = MAX_VISIBLE_PAGE_COUNT;
    }
    // 入参适配结束

    // 页码列表适配
    $range = ceil(($visible_count + 1) / 2);
    $start = $current_page - $range + 1;
    if($start < 1) {
        $start = 1;
    }
    $end = $start + $visible_count - 1;
    if ($end > $total_pages) {
        $end = $total_pages;
        // 向前反推,尽可能使显示个数为$visible_count
        $start = $end - $visible_count + 1;
        if($start < 1) {
            $start = 1;
        }
    }
    // 页码列表适配结束

    // 渲染
    echo "<div class='pagination'>";
    if($current_page > 1) { // pre
        echo('<a href="'.get_pagenum_link($current_page - 1).'" class="common-btn page-btn">&nbsp;<div class="icon-prev"></div></a>');
    }
    if($start != 1) {   // first[...]
        echo('<a href="'.get_pagenum_link(1).'" class="common-btn">1</a>');
        if ($start != 2) {
            echo('<span>...</span>');
        }
    }
    for ($i=$start; $i <= $end; $i++){  // list
        if ($i == $current_page) {
            echo('<a href="javascript:;" class="common-btn active">'.$i.'</a>');
        } else {
            echo('<a href="'.get_pagenum_link($i).'" class="common-btn">'.$i.'</a>');
        }
    }
    if($end < $total_pages) {   //[...]last
        if ($end + 1 < $total_pages) {
            echo('<span>...</span>');
        }
        echo('<a href="'.get_pagenum_link($total_pages).'" class="common-btn">'.$total_pages.'</a>');
    }
    if($current_page < $total_pages) { // next
        echo('<a href="'.get_pagenum_link($current_page + 1).'" class="common-btn page-btn">&nbsp;<div class="icon-next"></div></a>');
    }
    echo "</div>\n";
}

3,在需要的地方引用即可,形如

至于如何获得$total_pages, $current_page,我用的WP query,形如




  • 大小: 7.8 KB
  • 大小: 23.7 KB
分享到:
评论

相关推荐

    WordPress分页导航插件

    `WordPress分页导航插件`是解决这个问题的一种高效工具,它能优雅地将长内容列表分成多个页面,提升用户体验。在本文中,我们将深入探讨WordPress分页导航插件的功能、作用,以及如何使用`wp-pagenavi`这个具体的...

    Wordpress php 分页代码

    在WordPress开发过程中,分页是一项非常重要的功能,它能够帮助网站更好地管理大量的文章或帖子,提升用户体验,并减轻服务器负担。本文将深入解析一个用于WordPress的PHP分页代码示例,旨在帮助开发者理解其工作...

    wordpress 文章分页 实用的wordpress长文章分页代码

    尤其是新添加的 wordpress主题 页面,虽然文字不多,可是每一款wordpress主题都要配上个小图片,才能让读者有个大概的了解。从而决定是否要进行演示。那么将近三十款wordpress主题加在一起,页面就非常的长。所以...

    WordPress实现单篇文章分页显示的方法

    本文实例讲述了Wordpress实现单篇文章分页显示的方法。分享给大家供大家参考。具体分析如下: 很多朋友都知道Wordpress文章分页一般都会使用插件来实现的,下面我们来介绍无插件实现WordPress文章分页显示的具体方法....

    Wordpress分页导航插件!wp-pagenavi.2.50

    **Wordpress分页导航插件wp-pagenavi详解** 在WordPress网站开发中,分页功能是必不可少的一部分,尤其是在内容丰富的博客或文章列表中。`wp-pagenavi`是一款非常流行的WordPress分页导航插件,它提供了更为优雅和...

    女士香水网站使用的wordpress分页插件

    4. **功能特性**:该插件提供多种分页样式,如数字链接、箭头指示以及“跳转至”输入框,用户可以直接输入页码跳转。此外,`wp-pagenavi`还支持AJAX分页,即用户无需刷新页面即可切换页面,提升用户体验。 5. **...

    WordPress php 分页代码

    效果: ... $maxButtonCount = 9; //显示的最多链接数目 if (!is_single()) { if(!is_category()) { preg_match(‘#FROM\s(.*)\sORDER BY#siU’, $request, $matches); } else { preg_match(‘#FROM\s(.*)\sGR

    Wordpress实现单篇文章分页显示的方法

    在WordPress中,分页通常用于在列表页或归档页显示多篇文章,但在某些情况下,可能需要在单篇文章内部实现分页,以便将长篇文章分隔成多个部分,提高用户体验。以下是如何在不依赖插件的情况下,通过编辑WordPress...

    wordpress翻页插件

    为了解决这个问题,WordPress提供了多种插件来实现文章分页,其中之一就是"wp-pagenavi"插件。这款插件为用户提供了一种优雅且用户友好的翻页解决方案,使得访客可以轻松浏览长文章列表或 archives,提高网站的导航...

    编写PHP脚本来实现WordPress中评论分页的功能

    4. `paginate_comments_links`: 用于显示评论分页或返回评论分页的HTML。 这些函数可以用于实现简单的“上一页”和“下一页”链接,或者更复杂的导航式分页。 在实际应用中,通常会涉及到在页面中设置一个评论导航...

    Wordpress分类,标签,分页显示及翻页出现404错误的解决方法

    在WordPress中,分类、标签和分页是网站内容组织和导航的重要组成部分。然而,当用户尝试访问这些链接时,有时可能会遇到404错误,即“未找到”页面。这通常意味着WordPress无法正确识别或处理请求的URL,导致服务器...

    wordpress文章分页函数:wp_link_pages()

    wp_link_pages()是wordpress文章内页分页函数,在文章过长的时候我们通常需要对文章内容进行分页。实例介绍可查看:wordpress文章太长添加内页分页功能实例应用可查看:wordpress后台操作详细教程 【函数用法】 ...

    WordPress分页伪静态加html后缀

    搜索引擎对于静态文件和目录结构有其识别偏好,而WordPress这种动态生成的分页链接可能会导致搜索引擎的解析困难,从而影响文章页面的收录。 在这个问题的背景下,作者分享了一种通过自定义伪静态规则的方法,使得...

    dedecms织梦首页分页插件_hexo分页_dedecms_织梦csm_

    但是装完插件后发现,首页分页URL地址是index**.html这种格式,和我原来hexo博客分页URL不符(hexo博客首页分页格式是page/数字/ 这样的分类url格式,wordpress也是),于是手动改成page/页数/ 这种常见的url分页...

    wp-ajax-pagination:易于使用的 WordPress ajax 分页

    **wp-ajax-pagination: 一种高效的WordPress AJAX分页插件** 在WordPress开发中,分页是不可或缺的功能,尤其对于内容丰富的网站来说,它可以帮助用户轻松浏览大量文章或页面。`wp-ajax-pagination`是一款专为...

    wordpress常用标签调用代码大全

    4. WordPress主体模板PHP代码 - `(); ?&gt;`:用于显示当前日志或页面的完整内容。 - `(have_posts()): ?&gt;`:用于检查是否有日志可以显示,如果有,则执行循环体内的代码。 - `(have_posts()): the_post(); ?&gt;`:...

    文章正文分页实现源码

    4. **数据库查询分页**:如果文章存储在数据库中,可以利用SQL的LIMIT和OFFSET关键字进行数据分页。这种方法适用于动态加载更多内容的场景,比如无限滚动页面。 5. **内容管理系统(CMS)插件**:许多流行的CMS系统...

    wordpress-load-more:WordPress的同一页面分页按钮

    作为针对WordPress 4.x和更早版本的以开发人员为中心的插件,此插件更有意义。 作为WordPress 5.0的插件没有任何意义,并且该插件没有活动实例,因此我决定在2020年4月1日关闭该插件并将其从删除。(这不是愚人节的...

Global site tag (gtag.js) - Google Analytics