[원본수정] github 형식 페이징

· 2023-02-16 (목) 10:28:57 · 3666 · 3

깃헙 형식 페이징입니다.

이런 페이징을 한 번 써보고 싶어서 급하게 수정해 봤는데 어떤 오류가 있는지 모르겠네요... ㅎㅎ

 

3717582117_1676511609.0341.png

 

페이지 번호를 쭉 나열하는 게 아니라, [Newer] [Older] 두 개 버튼만 제공합니다.

 

▒1페이지에서 [Newer] 버튼은 클릭할 수 없습니다.

▒마지막 페이지에서 [Older] 버튼은 클릭할 수 없습니다.

▒클릭할 수 있는 버튼은 btn-active 로 스타일을 정의합니다.

▒클릭할 수 없는 버튼은 btn-disabled 로 스타일을 정의합니다.

주의! 이 팁을 그대로 사용하시면 관리자 화면 등 전체 화면의 페이징이 변경됩니다.

 

lib/common.lib.php

[code]// 한페이지에 보여줄 행, 현재페이지, 총페이지수, URL
function get_paging($write_pages, $cur_page, $total_page, $url, $add="")
{
    $url = preg_replace('#(&)?page=[0-9]*#', '', $url);
    $url .= substr($url, -1) === '?' ? 'page=' : '&page=';

    $str = '';

    $end_page = $write_pages - 1;

    if ($end_page >= $total_page) $end_page = $total_page;

    $btn_class = 'disabled';
    if ($cur_page > 1) {
        $str .= '<a href="'.$url.($cur_page-1).$add.'" class="pg-prev">'.PHP_EOL;
        $btn_class = 'active';
    }
    $str .= '<span class="btn btn-'.$btn_class.'">Newer</span>'.PHP_EOL;
    if ($cur_page > 1) $str .= '</a>'.PHP_EOL;

    $btn_class = 'disabled';
    if ($cur_page < $end_page) {
        $str .= '<a href="'.$url.($cur_page+1).$add.'" class="pg-next">'.PHP_EOL;
        $btn_class = 'active';
    }
    $str .= '<span class="btn btn-'.$btn_class.'">Older</span>'.PHP_EOL;
    if ($cur_page < $end_page) $str .= '</a>'.PHP_EOL;

    if ($str)
        return '<nav class="pg_wrap"><span class="pg">'.$str.'</span></nav>';
    else
        return "";
}[/code]

 

 

실제 적용한 샘플입니다.

 

3717582117_1676511305.2106.png

 

Stylesheet

[code].pg_wrap .btn {font-weight:bold}

.btn {display:inline-block;margin:0;padding:0 10px;height:44px;line-height:42px;border-radius:13px;font-size:1.4rem}

.btn-active {background:#006cff;color:#fff}
.btn-disabled {background:#dde0e3;color:#b4bbc1}[/code]

 

font-size 단위는 사이트에 맞게 변경하시면 됩니다.

|

댓글 3개

2023-02-16 (목) 12:44:56
감사합니다. ^^
좋은 팁 감사 합니다.
감사합니다!!
댓글을 작성하시려면 로그인이 필요합니다.

그누보드5 팁자료실

2,788건
+
제목 글쓴이 날짜 조회
23-03-16 조회 3,515
23-03-16 조회 4,209
23-03-11 조회 4,416
23-03-09 조회 3,836
23-03-08 조회 4,243
23-03-07 조회 4,059
23-03-06 조회 4,676
23-03-05 조회 3,828
23-03-03 조회 5,526
23-03-02 조회 4,725
23-03-02 조회 3,692
23-03-01 조회 3,349
23-02-20 조회 3,736
23-02-16 조회 4,325
23-02-16 조회 3,667
23-02-11 조회 3,956
23-02-10 조회 4,455
23-02-08 조회 3,847
23-02-06 조회 4,232
23-02-05 조회 4,273
23-02-02 조회 5,528
23-02-02 조회 5,052
23-02-02 조회 3,360
23-02-02 조회 3,826
23-02-02 조회 4,148
23-02-01 조회 4,205
23-01-30 조회 3,943
23-01-27 조회 4,230
23-01-27 조회 5,395
23-01-25 조회 4,618