웹마스터 팁
page_full_width" class="col-xs-12" |cond="$__Context->page_full_width">
각 리스트형 위젯에 페이지 기능을 달자.
2008.09.02 14:32
몇몇분이 소스를 공개하라고 해서 페이지 기능을 구현하는 방법을 소개해볼까 합니다.
이번 소스모델이 된 위젯은 newest_image(최근 이미지 위젯) 입니다.
최근 이미지 위젯에 페이지 기능을 위한 추가, 수정 파일
(※ 이미 설명드린 부분(하단참조) 있기 때문에 아래부터는 존칭을 생략 하겠습니다.)
- info.xml -
한 페이지 당 출력할 페이지 번호 갯수와, 페이지 출력 여부 설정 값을 입력 받기 위해
page_count, page_type 항목을 선언
- newest_images.class.php -
newest_images.class.php 파일안에 구석구석 위의 변수가 들어가면 페이지 기능이 완성 된다.
1. 첫번째 페이지 기능을 위한 정보 입력 및 처리
XML로 만들었던 page_count와 page_type을 DB로 보내기 위해 위와 같이 선언 한다.
(※ 다른 위젯과 다르게 $list_count 변수가 없어서 마지막에 $list_count = $obj->list_count;을 추가 선언해준다.)
2. DB로 보낼때 페이지 기능에서 필요로 하는 값중에는 전체 게시물수가 필요함.
전체 게시물 수를 구할 수 있도록 아래와 같이 선언
기 존 $files_output = executeQueryArray("file.getOneFileInDocument", $obj); 를 수정하게 되면 중심 모듈을 건드리게 되기 때문에 아래와 같이 위젯 폴더안에 queries라는 폴더를 하나더 만들어서 새로이 생성해준다.
전체 게시물 수를 구하도록 끝에 Count를 더 달아서 파일을 생성해준다.
3. 결과값의 순서를 수정
다른 위젯과 다르게 임의의 page( limit 0, 5 ) 가 선언되면
$files_output->data[0] ..[1]..[2]..... 가 아니라 $files_output->data[343]... [344]...[345].....
순으로 저장 되기에 이를 0번 부터 사용하도록 수를 수정 한다.
4. 페이지 계산에 필요한 정보를 list.html로 보내기 위해 아래와 같이 정리 한다.
5. list.html에서 호출에 오는 함수 정보.
위와 함수를 이용하여 페이지 계산, 초기화 등의 정보를 구한다.
- getOneFileInDocument.xml -
기존의 기본 XML에서 아래의 내용을 추가한다. (페이지 별로 내용 축출을 위해 필요)
<page_count var="page_count" default="10" />
<page var="page" default="1" />
- getOneFileInDocumentCount.xml -
내용은 그대로 getOneFileInDocument.xml에서 가져오돼 바꿔줘야 할 부분
- list.html -
중요한 선언만 설명
$widget_info로 넘겨받은 페이지 계산을 위한 전체 게시물 수, 전체 페이지 수, 현재 페이지 번호, 한페이지에 출력될 페이지 번호의 수를 WD_getNextPage로 호출하여 $page_view에 결과를 저장한다.
상 하로 중복 선언이 될 경우 기존에 이용되었던 $GLOBALS 변수를 초기화 시킨다.
WD_getNextPage2() 를 호출시마다 반복시켜서 내용이 없을때까지 수행한다.
이번 소스모델이 된 위젯은 newest_image(최근 이미지 위젯) 입니다.
최근 이미지 위젯에 페이지 기능을 위한 추가, 수정 파일
./widgets/newest_image/conf/info.xml <- 입력을 받기 위한 입력창
: 관리자페이지에서 코드 실행하기전에 이곳으로부터 정보를 입력 받습니다.
./widgets/newest_image/newest_images.class.php <- 입력 받은 정보를 처리
: 입력 받은 정보를 적절히 정리해서 DB로 부터 결과값들을 받고 스킨 처리를 하는 파일
./widgets/newest_image/queries/getOneFileInDocument.xml<- DB Query용 XML 파일
: $page 번호 값에 따라서 결과를 출럭하기 위해 <navigation>에 내용을 추가 해야 합니다.
: 또한 기존 files 모듈에 있던 내용을 위젯에 생성이 필요합니다.
./widgets/newest_image/queries/getOneFileInDocumentCount.xml <- DB Query용 XML 파일
: 결과값용 Query와 다르게 페이지 기능을 만들기 위해 하나의 Query를 더 해야합니다.
./widgets/newest_image/skin/default/list.html <- DB로 부터의 결과를 이용하여 표현하는 스킨 파일
: 관리자페이지에서 코드 실행하기전에 이곳으로부터 정보를 입력 받습니다.
./widgets/newest_image/newest_images.class.php <- 입력 받은 정보를 처리
: 입력 받은 정보를 적절히 정리해서 DB로 부터 결과값들을 받고 스킨 처리를 하는 파일
./widgets/newest_image/queries/getOneFileInDocument.xml<- DB Query용 XML 파일
: $page 번호 값에 따라서 결과를 출럭하기 위해 <navigation>에 내용을 추가 해야 합니다.
: 또한 기존 files 모듈에 있던 내용을 위젯에 생성이 필요합니다.
./widgets/newest_image/queries/getOneFileInDocumentCount.xml <- DB Query용 XML 파일
: 결과값용 Query와 다르게 페이지 기능을 만들기 위해 하나의 Query를 더 해야합니다.
./widgets/newest_image/skin/default/list.html <- DB로 부터의 결과를 이용하여 표현하는 스킨 파일
(※ 이미 설명드린 부분(하단참조) 있기 때문에 아래부터는 존칭을 생략 하겠습니다.)
- info.xml -
........ XML 선언 문들...... <options> <name xml:lang="ko">표시하지 않음</name> <name xml:lang="jp">非表示</name> <name xml:lang="zh-CN">不显示</name> <name xml:lang="en">Hide</name> <name xml:lang="es">Ocultar</name> <name xml:lang="ru">Скрывать</name> <value>N</value> </options> </var> <var id="page_count"> <name xml:lang="ko">페이지 목록수</name> <type>text</type> <description xml:lang="ko">출력될 페이지의 수를 정하실 수 있습니다. (기본 5개)</description> </var> <var id="page_type"> <name xml:lang="ko">페이지 출력 여부</name> <type>select</type> <description xml:lang="ko">페이지를 출력할지 선택하세요.</description> <options> <name xml:lang="ko">N</name> <value></value> </options> <options> <name xml:lang="ko">Y</name> <value>Y</value> </options> </var> </extra_vars> </widget>
한 페이지 당 출력할 페이지 번호 갯수와, 페이지 출력 여부 설정 값을 입력 받기 위해
page_count, page_type 항목을 선언
- newest_images.class.php -
/* 페이지 네비게이션 기능 추가 */ // 페이지 목록 수 (1,2,3,4....) $page_count = $args->page_count; if(!$page_count) $page_count = 5; $obj->page_count = $page_count; // 페이지 출력 여부 $page_type = $args->page_type; // 페이지 번호 구하기 if($page_type=='Y') $obj->page = (Context::get('+ '+ 'page'))? Context::get('page'): 1; // 기존 변수 추가로 저장 $list_count = $obj->list_count; /* 페이지 네비게이션 기능 추가 끝 */ // 정해진 모듈에서 문서별 파일 목록을 구함 $files_output = executeQueryArray("widgets.newest_images.getOneFileInDocument", $obj); $output_count = executeQueryArray('widgets.newest_images.getOneFileInDocumentCount', $obj); ...중략... $z=0; foreach($files_output->data as $key => $val) { $files_output->data[$z] = $files_output->data[$key]; unset($files_output->data[$key]); $z++; } ...중략... /* 페이지 네비게이션 기능 추가 */ $widget_info->page_type = $page_type; $widget_info->total_count = $output_count->data[0]->count; // 전체 개시물 수 $widget_info->page = (!Context::get('page'))? 1:Context::get('page'); // 현재 페이지 // 총 페이지 수 $total_count = $widget_info->total_count/$list_count; if($widget_info->total_count%$list_count != 0) $total_count+=1; $widget_info->total_page = floor($total_count); // 총 페이지 수 $widget_info->page_count = $page_count; // 총 페이지 수 /* 페이지 네비게이션 기능 추가 끝 */ ...중략... /** * @brief 다음 페이지 요청 **/ function WD_getNextPage($total_count, $total_page, $cur_page, $page_count = 10) { $first_page = $cur_page - (int)($page_count/2); if($first_page<1) $first_page = 1; $last_page = $total_page; if($last_page>$total_page) $last_page = $total_page; if($total_page < $page_count) $page_count = $total_page; $GLOBALS['wd_total_page'] = $total_page; $GLOBALS['wd_first_page'] = $first_page; $GLOBALS['wd_page_count'] = $page_count; $GLOBALS['wd_last_page'] = $last_page; $page->first_page = $first_page; $page->last_page = $last_page; return $page; } function WD_getNextPage2() { $page = $GLOBALS['wd_first_page']+$GLOBALS['wd_i'+ ']++; if($GLOBALS['wd_i'] > $GLOBALS['wd_page_count'] || $page > $GLOBALS['wd_last_page']) $page = 0; return $page; } function WD_getNextClear() { $GLOBALS['wd_i'] = 0; }
newest_images.class.php 파일안에 구석구석 위의 변수가 들어가면 페이지 기능이 완성 된다.
1. 첫번째 페이지 기능을 위한 정보 입력 및 처리
/* 페이지 네비게이션 기능 추가 */ // 페이지 목록 수 (1,2,3,4....) $page_count = $args->page_count; if(!$page_count) $page_count = 5; $obj->page_count = $page_count; // 페이지 출력 여부 $page_type = $args->page_type; // 페이지 번호 구하기 if($page_type=='Y') $obj->page = (Context::get('page'))? Context::get('page'): 1; // 기존 변수 추가로 저장 $list_count = $obj->list_count; /* 페이지 네비게이션 기능 추가 끝 */
XML로 만들었던 page_count와 page_type을 DB로 보내기 위해 위와 같이 선언 한다.
(※ 다른 위젯과 다르게 $list_count 변수가 없어서 마지막에 $list_count = $obj->list_count;을 추가 선언해준다.)
2. DB로 보낼때 페이지 기능에서 필요로 하는 값중에는 전체 게시물수가 필요함.
전체 게시물 수를 구할 수 있도록 아래와 같이 선언
// 정해진 모듈에서 문서별 파일 목록을 구함 $files_output = executeQueryArray("widgets.newest_images.getOneFileInDocument", $obj); $output_count = executeQueryArray('widgets.newest_images.getOneFileInDocumentCount', $obj);
기 존 $files_output = executeQueryArray("file.getOneFileInDocument", $obj); 를 수정하게 되면 중심 모듈을 건드리게 되기 때문에 아래와 같이 위젯 폴더안에 queries라는 폴더를 하나더 만들어서 새로이 생성해준다.
전체 게시물 수를 구하도록 끝에 Count를 더 달아서 파일을 생성해준다.
3. 결과값의 순서를 수정
$z=0; foreach($files_output->data as $key => $val) { $files_output->data[$z] = $files_output->data[$key]; unset($files_output->data[$key]); $z++; }
다른 위젯과 다르게 임의의 page( limit 0, 5 ) 가 선언되면
$files_output->data[0] ..[1]..[2]..... 가 아니라 $files_output->data[343]... [344]...[345].....
순으로 저장 되기에 이를 0번 부터 사용하도록 수를 수정 한다.
4. 페이지 계산에 필요한 정보를 list.html로 보내기 위해 아래와 같이 정리 한다.
/* 페이지 네비게이션 기능 추가 */ $widget_info->page_type = $page_type; $widget_info->total_count = $output_count->data[0]->count; // 전체 개시물 수 $widget_info->page = (!Context::get('page'))? 1:Context::get('page'); // 현재 페이지 // 총 페이지 수 $total_count = $widget_info->total_count/$list_count; if($widget_info->total_count%$list_count != 0) $total_count+=1; $widget_info->total_page = floor($total_count); // 총 페이지 수 $widget_info->page_count = $page_count; // 총 페이지 수 /* 페이지 네비게이션 기능 추가 끝 */ Context::set('widget_info', $widget_info); ...중략...
5. list.html에서 호출에 오는 함수 정보.
/** * @brief 다음 페이지 요청 **/ function WD_getNextPage($total_count, $total_page, $cur_page, $page_count = 10) { $first_page = $cur_page - (int)($page_count/2); if($first_page<1) $first_page = 1; $last_page = $total_page; if($last_page>$total_page) $last_page = $total_page; if($total_page < $page_count) $page_count = $total_page; $GLOBALS['wd_total_page'] = $total_page; $GLOBALS['wd_first_page'] = $first_page; $GLOBALS['+ 'wd_page_count'] = $page_count; $GLOBALS['wd_last_page'] = $last_page; $page->first_page = $first_page; $page->last_page = $last_page; return $page; } function WD_getNextPage2() { $page = $GLOBALS['+ 'wd_first_page'+ ']+$GLOBALS['wd_i']++; if($GLOBALS['wd_i'] > $GLOBALS['wd_page_count'] || $page > $GLOBALS['wd_last_page'+ ']) $page = 0; return $page; } function WD_getNextClear() { $GLOBALS['wd_i'] = 0; }
위와 함수를 이용하여 페이지 계산, 초기화 등의 정보를 구한다.
- getOneFileInDocument.xml -
<query id="getOneFileInDocument" action="select"> <tables> <table name="files" alias="files"/> <table name="documents" alias="documents"/> </tables> <columns> <column name="files.upload_target_srl" alias="document_srl"/> </columns> <conditions> <condition operation="in" column="files.module_srl" var="module_srls" notnull="notnull" filter="numbers" /> <condition operation="equal" column="files.direct_download" var="direct_download" pipe="and" /> <condition operation="equal" column="files.isvalid" var="isvalid" pipe="and" /> <condition operation="equal" column="files.upload_target_srl" var="documents.document_srl" pipe="and" /> </conditions> <groups> <group column="files.upload_target_srl" /> </groups> <navigation> <index var="list_order" default="documents.list_order" order="asc" /> <list_count var="list_count" default="20" /> <page_count var="page_count" default="10" /> <page var="page" default="1" /> </navigation> </query>
기존의 기본 XML에서 아래의 내용을 추가한다. (페이지 별로 내용 축출을 위해 필요)
<page_count var="page_count" default="10" />
<page var="page" default="1" />
- getOneFileInDocumentCount.xml -
<query id="getOneFileInDocumentCount" action="select"> <tables> <table name="files" alias="files"/> <table name="documents" alias="documents"/> </tables> <columns> <column name="count(files.upload_target_srl)" alias="count"/> </columns> <conditions> <condition operation="in" column="files.module_srl" var="module_srls" notnull="notnull" filter="numbers" /> <condition operation="equal" column="files.direct_download" var="direct_download" pipe="and" /> <condition operation="equal" column="files.isvalid" var="isvalid" pipe="and" /> <condition operation="equal" column="files.upload_target_srl" var="documents.document_srl" pipe="and" /> </conditions> <groups> <group column="files.upload_target_srl" /> </groups> <navigation> <index var="list_order" default="documents.list_order" order="asc" /> </navigation> </query>
내용은 그대로 getOneFileInDocument.xml에서 가져오돼 바꿔줘야 할 부분
<query id="getOneFileInDocumentCount" action="select">id명을 파일명과 일치시킨다.
<column name="count(files.upload_target_srl)" alias="count"/>count()로 감싸고 alias="count" 라는 이름으로 명시.
<list_count var="list_count" default="20" />해당 내용 삭제하여 전체 게시물로써의 게시물수를 구한다.
- list.html -
<!--@if($widget_info->page_type=='Y')--> <!-- 페이지 네비게이션 --> <div class="pageNavigation"> <a href="{getUrl('page','','document_srl','','division',$division,'last_division',$last_division)}" class="goToFirst"> <img src="./images/common/bottomGotoFirst.gif" alt="{$lang->first_page}" width="7" height="5" /></a> <!-- 페이지 정보 구하기 위해 선언 --> {@$page_view = WD_getNextPage($widget_info->total_count,$widget_info->total_page,$widget_info->page,$widget_info->page_count)} <!-- 중복 페이지 정보 출력을 위해 사전 초기화 --> {@WD_getNextClear()} <!--@while($page_no = WD_getNextPage2())--> <!--@if($widget_info->page == $page_no)--> <span class="current">{$page_no}</span> <!--@else--> <span class="pageNavigations"><a href="{getUrl('page',$page_no,'+ 'document_srl','','division',$division,'last_division',$last_division)}" class="pageNavigation2">{$page_no}</a></span> <!--@end--> <!--@end--> <a href="{getUrl('page',$page_view->last_page,'document_srl','','division',$division,'last_division',$last_division)}" class="goToLast"> <img src="./images/common/bottomGotoLast.gif" alt="{$lang->last_page}" width="7" height="5" /></a> </div> <!--@end-->
중요한 선언만 설명
{@$page_view = WD_getNextPage($widget_info->total_count,$widget_info->total_page,$widget_info->page,$widget_info->page_count)}
$widget_info로 넘겨받은 페이지 계산을 위한 전체 게시물 수, 전체 페이지 수, 현재 페이지 번호, 한페이지에 출력될 페이지 번호의 수를 WD_getNextPage로 호출하여 $page_view에 결과를 저장한다.
{@WD_getNextClear()}
상 하로 중복 선언이 될 경우 기존에 이용되었던 $GLOBALS 변수를 초기화 시킨다.
<!--@while($page_no = WD_getNextPage2())--> ...내용... <!--@end-->
WD_getNextPage2() 를 호출시마다 반복시켜서 내용이 없을때까지 수행한다.
위 설명은 왠만한 위젯에서 공통적으로 적용가능합니다. (리스트형)
1~5번의 위치만 제대로 잡아주시고 DB용 xml만 제대로 선언해주신다면 페이지 네비게이션 이용에
문제가 없을 걸로 봅니다.
전체 소스결과를 출력하긴 좀 그래서 newest_images 위젯을 배포하겠습니다.
위 소스를 기반으로 확인해보시고 다른곳에 적용해보시고 하세요.
1~5번의 위치만 제대로 잡아주시고 DB용 xml만 제대로 선언해주신다면 페이지 네비게이션 이용에
문제가 없을 걸로 봅니다.
전체 소스결과를 출력하긴 좀 그래서 newest_images 위젯을 배포하겠습니다.
위 소스를 기반으로 확인해보시고 다른곳에 적용해보시고 하세요.
보다 자세한 원리의 강좌는 제 홈페이지에 설명되어있습니다.
http://www.animeclub.net/zbXE
http://www.animeclub.net/zbXE
태그 연관 글
- [2015/08/01] 포럼 [XE기초강좌 동영상] 휴면계정 정리 모듈 사용방법 *5
- [2015/07/20] 포럼 [아프리카TV 생방송] 충쌤의 XE랑(월,화 밤11시) * 진화쌤의 반응형 레이아웃 제작(수,목 밤10시) *29
- [2014/05/29] 포럼 XE 오픈 세미나 - 5월 31일 xdebug, XE 개발 전반에 대한 Q&A *4
- [2014/05/26] Blog 5월 XE 오픈 세미나 - [3회차] XE 모듈 개발 걸음마부터 날기까지 *1
- [2014/05/19] Blog XE 오픈 세미나 - XE 모듈 개발 1회차 리뷰
댓글 10
제목 | 글쓴이 | 날짜 |
---|---|---|
홈페이지에 국경일이면 태극기 다는법이에요~ ^^
[11]
[1] ![]() | jaehee_91 | 2008.03.01 |
양력/음력DB 홈페이지에 사용하기 [2] | 감뿌리 | 2008.03.29 |
플래시로 페이지에 랜덤 이미지 돌리기 [3] | ☜ TeRy ☞ | 2008.04.04 |
외부페이지에서 매개변수 사용하기 [2] | JnCsoft | 2008.04.07 |
404 에러 페이지를 만들어 보자 [2] | hangoon | 2008.04.11 |
각 페이지에 쓸 수 있는 변수명들 찾기 [6] | lainfox | 2008.04.29 |
홈페이지에 이미지블릿 대신 특수문자로 표현해 보기
![]() | 팔공산 | 2008.04.29 |
rewrite mod 사용시 404 페이지 에러 해결 방법 | 이종준 | 2008.05.09 |
홈페이지에 닉네임 대신 실명으로 뜨게 만들기
[5]
![]() | findwind | 2008.05.19 |
외부페이지 접근을 제로보드XE를 통해서만 접근을 허용 하고 싶다면 [9] | 임기택924 | 2008.06.03 |
1.0.3버전 외부 페이지 쿼리 스트링 붙일때 주의 하세요. | 그라미 | 2008.06.03 |
페이지 숫자에 네이버처럼 사각테두리 씌우기
[8]
![]() | 탑심 | 2008.06.15 |
페이지 작성이나 수정후 적용이 안돼서 고생하는 많은 분들을 위하여 [1] | cyric | 2008.06.17 |
아이프레임속 링크를 기존페이지에서 이동하기
[1]
![]() | 정다운804 | 2008.06.19 |
[팁]페이지별 댓글 출력 초간단 팁.. [4] | 키티나 | 2008.07.04 |
한 페이지(화면)에 두개(2개)의 모듈(게시판 등)을 넣는 법 [6] | 황건순 | 2008.08.25 |
밑에 페이지 네비게이션 수정 (다음10개, 이전10개등으로)
[6]
![]() | Clanss | 2008.08.29 |
각 리스트형 위젯에 페이지 기능을 달자. [10] | 라르게덴 | 2008.09.02 |
[우클릭 및 드레그 방지법] 및 [방지된 홈페이지 해재법] >0< [7] | 이홍석295 | 2008.09.03 |
동일서버내 페이지에서 로그인정보 활용하기... [4] | 수로 | 2008.09.06 |