模板设计
关注DiYunCMS公众号
公众号二维码

自定义分页样式配置

更新时间:2020-11-07 加入收藏

DiYunCMS系统默认的分页样式是如下这样的

{帝云cms_img_title}

如果不喜欢这种样式,也可以改成如下这样

{帝云cms_img_title}


一、全局配置文件

1、前端默认分页文件:config/page/pc 或 mobile/page.php
2、会员默认分页文件:config/page/pc 或 mobile/member.php
3、评论ajax默认分页文件:config/page/pc 或 mobile/ajax.php(不存在的话可以复制page.php)


分页配置文件完整参数解析:

<?php

/**
 * 自定义分页标签样式
 */

return array(

   // 自定义“统计”链接
   'total_link' => '共%s条', // 你希望在分页中显示“统计”名字链接。如果你不希望显示,可以把它的值设为 FALSE 
   'total_tag_open' => '<li>', // “统计”打开标签链接
   'total_tag_close' => '</li>', // “统计”关闭标签链接
   //'total_remove_anchor' => true, // “统计”链接移除a标签
   'total_anchor_class' => '', // 加a标签的class,留空采用anchor_class属性
   
   // 自定义“下一页”链接
   'next_link' => '下一页', // 你希望在分页中显示“下一页”链接的名字。如果你不希望显示,可以把它的值设为 FALSE 
   'next_tag_open' => '<li>', // “下一页”链接的打开标签
   'next_tag_close' => '</li>', // “下一页”链接的关闭标签
   'next_anchor_class' => '', // 加a标签的class,留空采用anchor_class属性
   
   // 自定义“上一页”链接
   'prev_link' => '上一页', // 你希望在分页中显示“上一页”链接的名字。如果你不希望显示,可以把它的值设为 FALSE 
   'prev_tag_open' => '<li>', // “上一页”链接的打开标签
   'prev_tag_close' => '</li>', // “上一页”链接的关闭标签
   'prev_anchor_class' => '', // 加a标签的class,留空采用anchor_class属性
   
   // 自定义“当前页”链接
   'cur_tag_open' => '<li class="active"><a>', // “当前页”链接的打开标签
   'cur_tag_close' => '</a></li>', // “当前页”链接的关闭标签
   
   // 自定义“数字”链接
   'num_tag_open' => '<li>', // “数字”链接的打开标签
   'num_tag_close' => '</li>', // “数字”链接的关闭标签
   'num_anchor_class' => '', // 加a标签的class,留空采用anchor_class属性
   
   // 自定义“最后一页”链接
   'last_link' => '最后一页', // 你希望在分页的右边显示“最后一页”链接的名字。如果你不希望显示,可以把它的值设为 FALSE
   'last_tag_open' => '<li>', // “最后一页”链接的打开标签
   'last_tag_close' => '</li>', // “最后一页”链接的关闭标签
   'last_anchor_class' => '', // 加a标签的class,留空采用anchor_class属性
   
   // 自定义“第一页”链接
   'first_link' => '第一页', // 你希望在分页的左边显示“第一页”链接的名字。如果你不希望显示,可以把它的值设为 FALSE
   'first_tag_open' => '<li>', // “第一页”链接的打开标签
   'first_tag_close' => '</li>', // “第一页”链接的关闭标签
   'first_anchor_class' => '', // 加a标签的class,留空采用anchor_class属性
   
   // 是否显示数字链接
   'display_pages' => TRUE,

    // 显示的分页数字个数
    'num_links' => 4,

    // 给每一个链接添加class属性
   'anchor_class' => '',
   
   // 区域标签
    'full_tag_open' => '<ul class="pagination">',

   // 区域标签
    'full_tag_close' => '</ul>',

);



二、临时配置文件

临时配置只针对当页页面本地查询的分页标签,写在本次查询之前,语法格式为:

<?php $this->set_page_config(array(
/**这里是自定义分页样式配置文件*/
// 自定义“统计”链接
'total_link' => '共%s条', // 你希望在分页中显示“统计”链接的名字。如果你不希望显示,可以把它的值设为 FALSE
'total_tag_open' => '', // “统计”链接的打开标签
'total_tag_close' => '', // “统计”链接的关闭标签
// 自定义“下一页”链接
'next_link' => '下一页', // 你希望在分页中显示“下一页”链接的名字。如果你不希望显示,可以把它的值设为 FALSE
'next_tag_open' => '', // “下一页”链接的打开标签
'next_tag_close' => '', // “下一页”链接的关闭标签
// 自定义“上一页”链接
'prev_link' => '上一页', // 你希望在分页中显示“上一页”链接的名字。如果你不希望显示,可以把它的值设为 FALSE
'prev_tag_open' => '', // “上一页”链接的打开标签
'prev_tag_close' => '', // “上一页”链接的关闭标签
// 自定义“当前页”链接
'cur_tag_open' => '<a  class="now">', // “当前页”链接的打开标签
'cur_tag_close' => '</a>', // “当前页”链接的关闭标签
// 自定义“数字”链接
'num_tag_open' => '', // “数字”链接的打开标签
'num_tag_close' => '', // “数字”链接的关闭标签
// 自定义“最后一页”链接
'last_link' => false,
// 自定义“第一页”链接
'first_link' => false,
// 是否显示数字链接
'display_pages' => TRUE,
// 显示的分页数字个数
'num_links' => 4,
// 区域标签
'full_tag_open' => '',
// 区域标签
'full_tag_close' => '',
));?>


{module ....}

{/module}


调用分页时就按本次配置为准:

{$pages}



三、其他例子

1、给分页加select选择页数,适用于列表页面和搜索页面

15870013725a8be4.png

{$pages}
////////////开始//////////////
{if $nums}
<select onchange="dr_go_page(this.value)">
    {php $pp = range(1,$nums);}
    {loop $pp $p}
    <option value="{$p}">第{$p}页</option>
    {/loop}
</select>
<script>
    function dr_go_page(value) {
        var url="{$urlrule}";
        if (value) {
            url = url.replace('{page}', value);
            url = url.replace('[page]', value);
            url = url.replace('[page]', value);
            location.href=url;
        }
    }
    </script>
{/if}


2、跳转页面设置

image

<div class="input-group">
    <input type="text" class="form-control" onkeypress="if(event.keyCode==13) { dr_module_search_page();return false;}" id="search_page">
    <span class="input-group-btn">
        <button class="btn btn-sm blue" onclick="dr_module_search_page()" type="button"> <i class="fa fa-search"></i> 页</button>
    </span>
</div>
<script>
    // 这段js是用来执行搜索的
    function dr_module_search_page() {
        var url="{$urlrule}";
        var value = $("#search_page").val();
        if (value) {
            url = url.replace('{page}', value);
            url = url.replace('[page]', value);
            url = url.replace('[page]', value);
            location.href=url;
        } else {
            $("#search_page").focus()
            dr_tips(0, "输入页码");
        }
        return false;
    }
</script>



Hello,欢迎来咨询~
点击在线咨询