여분필드를 활용한 게시판 스킨 제작 - 기초 예제1-2 (목록 페이지) > 그누보드 게시판스킨 강좌

본문 바로가기
전체검색

아이디비번찾기

그누보드 게시판스킨 강좌

그누보드 영카트 초보 사용자를 위한 기본 매뉴얼, 스킨 제작 기초강좌를 공유합니다.

여분필드를 활용한 게시판 스킨 제작 - 기초 예제1-2 (목록 페이지)

페이지 정보

작성자 관리자 작성일15-10-03 14:14 조회4,373회

본문

그누보드 게시판스킨 강좌

list.skin.php 파일 수정하기
 


목록 페이지에 새로 추가한 항목을 출력하는 방법은 원하는 위치에 아래 코드를 넣어주면 됩니다
 
여분필드 1번을 출력할 때 <?php echo $list[$i]['wr_1'] ?>
여분필드 2번을 출력할 때 <?php echo $list[$i]['wr_2'] ?>
여분필드 3번을 출력할 때 <?php echo $list[$i]['wr_3'] ?>
 
목록 페이지에서는 한가지 더 수정하셔야 할 게 있습니다.
항목 내용 길이에 따라 각 항목의 가로폭을 조절해야 할 경우가 있을 수가 있는데
스킨 폴더 안에 있는 style.css 파일에 별도로 class를 추가해서 사용하면 됩니다.
 
 
샘플 소스는 그누보드5 basic 게시판 스킨을 사용했습니다.
 
 
1. 스킨 폴더 안에 있는 styles.css 파일 수정하기
 

* 빨간색으로 강조된 부분이 수정되거나 새로 추가한 부분입니다.

 
/* 게시판 목록 */
#bo_list .td_wr1 {width:50px;text-align:center}
#bo_list .td_wr2 {width:100px;text-align:center}
#bo_list .td_wr3 {width:100px;text-align:center}
#bo_list .td_board {width:120px;text-align:center}
#bo_list .td_chk {width:30px;text-align:center}
#bo_list .td_date {width:60px;text-align:center}
#bo_list .td_datetime {width:110px;text-align:center}
#bo_list .td_group {width:100px;text-align:center}
#bo_list .td_mb_id {width:100px;text-align:center}
#bo_list .td_mng {width:80px;text-align:center}
#bo_list .td_name {width:100px;text-align:center}
#bo_list .td_nick {width:100px;text-align:center}
#bo_list .td_num {width:50px;text-align:center}
#bo_list .td_numbig {width:80px;text-align:center}
 
 
2. list.skin.php 파일 수정하기
 
스킨에 따라 다르지만 항목 개수를 조정할 땐 크게 아래 3군데 부분만 보시면 됩니다.
 
셀 합치기 부분 : $colspan = 8; (여분필드 3개가 추가되었으니 5에서 8로 변경됨)
목록 타이틀 부분 : <th>........</th>
목록 출력 부분 : <td>........</td>
 

* 빨간색으로 강조된 부분이 수정되거나 새로 추가한 부분입니다.

 

 

 

<?php
if (!defined('_GNUBOARD_')) exit; // 개별 페이지 접근 불가

// 선택옵션으로 인해 셀합치기가 가변적으로 변함
$colspan = 8;

if ($is_checkbox) $colspan++;
if ($is_good) $colspan++;
if ($is_nogood) $colspan++;

// add_stylesheet('css 구문', 출력순서); 숫자가 작을 수록 먼저 출력됨
add_stylesheet('<link rel="stylesheet" href="'.$board_skin_url.'/style.css">', 0);
?>

<h2 id="container_title"><?php echo $board['bo_subject'] ?><span class="sound_only"> 목록</span></h2>

<!-- 게시판 목록 시작 { -->
<div id="bo_list" style="width:<?php echo $width; ?>">

    <!-- 게시판 카테고리 시작 { -->
    <?php if ($is_category) { ?>
    <nav id="bo_cate">
        <h2><?php echo $board['bo_subject'] ?> 카테고리</h2>
        <ul id="bo_cate_ul">
            <?php echo $category_option ?>
        </ul>
    </nav>
    <?php } ?>
    <!-- } 게시판 카테고리 끝 -->

    <!-- 게시판 페이지 정보 및 버튼 시작 { -->
    <div class="bo_fx">
        <div id="bo_list_total">
            <span>Total <?php echo number_format($total_count) ?>건</span>
            <?php echo $page ?> 페이지
        </div>

        <?php if ($rss_href || $write_href) { ?>
        <ul class="btn_bo_user">
            <?php if ($rss_href) { ?><li><a href="<?php echo $rss_href ?>" class="btn_b01">RSS</a></li><?php } ?>
            <?php if ($admin_href) { ?><li><a href="<?php echo $admin_href ?>" class="btn_admin">관리자</a></li><?php } ?>
            <?php if ($write_href) { ?><li><a href="<?php echo $write_href ?>" class="btn_b02">글쓰기</a></li><?php } ?>
        </ul>
        <?php } ?>
    </div>
    <!-- } 게시판 페이지 정보 및 버튼 끝 -->

    <form name="fboardlist" id="fboardlist" action="./board_list_update.php" onsubmit="return fboardlist_submit(this);" method="post">
    <input type="hidden" name="bo_table" value="<?php echo $bo_table ?>">
    <input type="hidden" name="sfl" value="<?php echo $sfl ?>">
    <input type="hidden" name="stx" value="<?php echo $stx ?>">
    <input type="hidden" name="spt" value="<?php echo $spt ?>">
    <input type="hidden" name="sca" value="<?php echo $sca ?>">
    <input type="hidden" name="sst" value="<?php echo $sst ?>">
    <input type="hidden" name="sod" value="<?php echo $sod ?>">
    <input type="hidden" name="page" value="<?php echo $page ?>">
    <input type="hidden" name="sw" value="">

    <div class="tbl_head01 tbl_wrap">
        <table>
        <caption><?php echo $board['bo_subject'] ?> 목록</caption>
        <thead>
        <tr>
            <th scope="col">번호</th>
            <?php if ($is_checkbox) { ?>
            <th scope="col">
                <label for="chkall" class="sound_only">현재 페이지 게시물 전체</label>
                <input type="checkbox" id="chkall" onclick="if (this.checked) all_checked(true); else all_checked(false);">
            </th>
            <?php } ?>
            <th scope="col">제목</th>
            <th scope="col">나이</th>
            <th scope="col">연락처</th>
            <th scope="col">카카오톡</th>
            <th scope="col">글쓴이</th>
            <th scope="col"><?php echo subject_sort_link('wr_datetime', $qstr2, 1) ?>날짜</a></th>
            <th scope="col"><?php echo subject_sort_link('wr_hit', $qstr2, 1) ?>조회</a></th>
            <?php if ($is_good) { ?><th scope="col"><?php echo subject_sort_link('wr_good', $qstr2, 1) ?>추천</a></th><?php } ?>
            <?php if ($is_nogood) { ?><th scope="col"><?php echo subject_sort_link('wr_nogood', $qstr2, 1) ?>비추천</a></th><?php } ?>
        </tr>
        </thead>
        <tbody>
        <?php
        for ($i=0; $i<count($list); $i++) {
         ?>
        <tr class="<?php if ($list[$i]['is_notice']) echo "bo_notice"; ?>">
            <td class="td_num">
            <?php
            if ($list[$i]['is_notice']) // 공지사항
                echo '<strong>공지</strong>';
            else if ($wr_id == $list[$i]['wr_id'])
                echo "<span class=\"bo_current\">열람중</span>";
            else
                echo $list[$i]['num'];
             ?>
            </td>
            <?php if ($is_checkbox) { ?>
            <td class="td_chk">
                <label for="chk_wr_id_<?php echo $i ?>" class="sound_only"><?php echo $list[$i]['subject'] ?></label>
                <input type="checkbox" name="chk_wr_id[]" value="<?php echo $list[$i]['wr_id'] ?>" id="chk_wr_id_<?php echo $i ?>">
            </td>
            <?php } ?>
            <td class="td_subject">
                <?php
                echo $list[$i]['icon_reply'];
                if ($is_category && $list[$i]['ca_name']) {
                 ?>
                <a href="<?php echo $list[$i]['ca_name_href'] ?>" class="bo_cate_link"><?php echo $list[$i]['ca_name'] ?></a>
                <?php } ?>

                <a href="<?php echo $list[$i]['href'] ?>">
                    <?php echo $list[$i]['subject'] ?>
                    <?php if ($list[$i]['comment_cnt']) { ?><span class="sound_only">댓글</span><?php echo $list[$i]['comment_cnt']; ?><span class="sound_only">개</span><?php } ?>
                </a>

                <?php
                // if ($list[$i]['link']['count']) { echo '['.$list[$i]['link']['count']}.']'; }
                // if ($list[$i]['file']['count']) { echo '<'.$list[$i]['file']['count'].'>'; }

                if (isset($list[$i]['icon_new'])) echo $list[$i]['icon_new'];
                if (isset($list[$i]['icon_hot'])) echo $list[$i]['icon_hot'];
                if (isset($list[$i]['icon_file'])) echo $list[$i]['icon_file'];
                if (isset($list[$i]['icon_link'])) echo $list[$i]['icon_link'];
                if (isset($list[$i]['icon_secret'])) echo $list[$i]['icon_secret'];

                 ?>
            </td>
            <td class="td_wr1"><?php echo $list[$i]['wr_1'] ?></td>
            <td class="td_wr2"><?php echo $list[$i]['wr_2'] ?></td>
            <td class="td_wr3"><?php echo $list[$i]['wr_3'] ?></td>
            <td class="td_name sv_use"><?php echo $list[$i]['name'] ?></td>
            <td class="td_date"><?php echo $list[$i]['datetime2'] ?></td>
            <td class="td_num"><?php echo $list[$i]['wr_hit'] ?></td>
            <?php if ($is_good) { ?><td class="td_num"><?php echo $list[$i]['wr_good'] ?></td><?php } ?>
            <?php if ($is_nogood) { ?><td class="td_num"><?php echo $list[$i]['wr_nogood'] ?></td><?php } ?>
        </tr>
        <?php } ?>
        <?php if (count($list) == 0) { echo '<tr><td colspan="'.$colspan.'" class="empty_table">게시물이 없습니다.</td></tr>'; } ?>
        </tbody>
        </table>
    </div>

    <?php if ($list_href || $is_checkbox || $write_href) { ?>
    <div class="bo_fx">
        <?php if ($is_checkbox) { ?>
        <ul class="btn_bo_adm">
            <li><input type="submit" name="btn_submit" value="선택삭제" onclick="document.pressed=this.value"></li>
            <li><input type="submit" name="btn_submit" value="선택복사" onclick="document.pressed=this.value"></li>
            <li><input type="submit" name="btn_submit" value="선택이동" onclick="document.pressed=this.value"></li>
        </ul>
        <?php } ?>

        <?php if ($list_href || $write_href) { ?>
        <ul class="btn_bo_user">
            <?php if ($list_href) { ?><li><a href="<?php echo $list_href ?>" class="btn_b01">목록</a></li><?php } ?>
            <?php if ($write_href) { ?><li><a href="<?php echo $write_href ?>" class="btn_b02">글쓰기</a></li><?php } ?>
        </ul>
        <?php } ?>
    </div>
    <?php } ?>
    </form>
</div>

<?php if($is_checkbox) { ?>
<noscript>
<p>자바스크립트를 사용하지 않는 경우<br>별도의 확인 절차 없이 바로 선택삭제 처리하므로 주의하시기 바랍니다.</p>
</noscript>
<?php } ?>

<!-- 페이지 -->
<?php echo $write_pages;  ?>

<!-- 게시판 검색 시작 { -->
<fieldset id="bo_sch">
    <legend>게시물 검색</legend>

    <form name="fsearch" method="get">
    <input type="hidden" name="bo_table" value="<?php echo $bo_table ?>">
    <input type="hidden" name="sca" value="<?php echo $sca ?>">
    <input type="hidden" name="sop" value="and">
    <label for="sfl" class="sound_only">검색대상</label>
    <select name="sfl" id="sfl">
        <option value="wr_subject"<?php echo get_selected($sfl, 'wr_subject', true); ?>>제목</option>
        <option value="wr_content"<?php echo get_selected($sfl, 'wr_content'); ?>>내용</option>
        <option value="wr_subject||wr_content"<?php echo get_selected($sfl, 'wr_subject||wr_content'); ?>>제목+내용</option>
        <option value="mb_id,1"<?php echo get_selected($sfl, 'mb_id,1'); ?>>회원아이디</option>
        <option value="mb_id,0"<?php echo get_selected($sfl, 'mb_id,0'); ?>>회원아이디(코)</option>
        <option value="wr_name,1"<?php echo get_selected($sfl, 'wr_name,1'); ?>>글쓴이</option>
        <option value="wr_name,0"<?php echo get_selected($sfl, 'wr_name,0'); ?>>글쓴이(코)</option>
    </select>
    <label for="stx" class="sound_only">검색어<strong class="sound_only"> 필수</strong></label>
    <input type="text" name="stx" value="<?php echo stripslashes($stx) ?>" required id="stx" class="frm_input required" size="15" maxlength="20">
    <input type="submit" value="검색" class="btn_submit">
    </form>
</fieldset>
<!-- } 게시판 검색 끝 -->

<?php if ($is_checkbox) { ?>
<script>
function all_checked(sw) {
    var f = document.fboardlist;

    for (var i=0; i<f.length; i++) {
        if (f.elements[i].name == "chk_wr_id[]")
            f.elements[i].checked = sw;
    }
}

function fboardlist_submit(f) {
    var chk_count = 0;

    for (var i=0; i<f.length; i++) {
        if (f.elements[i].name == "chk_wr_id[]" && f.elements[i].checked)
            chk_count++;
    }

    if (!chk_count) {
        alert(document.pressed + "할 게시물을 하나 이상 선택하세요.");
        return false;
    }

    if(document.pressed == "선택복사") {
        select_copy("copy");
        return;
    }

    if(document.pressed == "선택이동") {
        select_copy("move");
        return;
    }

    if(document.pressed == "선택삭제") {
        if (!confirm("선택한 게시물을 정말 삭제하시겠습니까?\n\n한번 삭제한 자료는 복구할 수 없습니다\n\n답변글이 있는 게시글을 선택하신 경우\n답변글도 선택하셔야 게시글이 삭제됩니다."))
            return false;

        f.removeAttribute("target");
        f.action = "./board_list_update.php";
    }

    return true;
}

// 선택한 게시물 복사 및 이동
function select_copy(sw) {
    var f = document.fboardlist;

    if (sw == "copy")
        str = "복사";
    else
        str = "이동";

    var sub_win = window.open("", "move", "left=50, top=50, width=500, height=550, scrollbars=1");

    f.sw.value = sw;
    f.target = "move";
    f.action = "./move.php";
    f.submit();
}
</script>
<?php } ?>
<!-- } 게시판 목록 끝 --> 

토리님의 댓글

토리

잘 봤습니다~

파란커피님의 댓글

파란커피

목록에서 날짜와 조회수를 삭제하려면 어떻게 해야하나요?
list.skin.php에서는 아무리 삭제해도 안되고...css에서도 역시 그러네요.
부탁 드리겠습니다.

관리자님의 댓글

관리자 댓글의 댓글

list.skin.php 파일에서 직접 삭제했는데도 변화가 없다면 다른 스킨을 수정했을 가능성이 높습니다.
게시판 설정에서 현재 어떤 스킨을 사용하고 있는지 체크를 해보세요. 테마용 스킨인지 아닌지..

로그인 후 댓글을 남겨주세요.
그누보드 게시판스킨 강좌 목록
번호 제목
공지 게시판 스킨 강좌 공지사항입니다.
1 게시판 기본 스킨 목록 페이지 살펴보기 1 - list.skin.php 댓글1
2 게시판 기본 스킨 목록 페이지 살펴보기 2 - 상세 설명
3 게시판 기본 스킨 글쓰기 페이지 살펴보기 1 - write.skin.php 댓글2
4 게시판 기본 스킨 글쓰기 페이지 살펴보기 2 - 상세 설명
5 게시판 기본 스킨 내용보기 페이지 살펴보기 1 - view.skin.php
6 게시판 기본 스킨 내용보기 페이지 살펴보기 2 - 상세 설명
7 게시판 기본 스킨 코멘트 페이지 살펴보기 1 - view_comment.skin.php
8 게시판 기본 스킨 코멘트 페이지 살펴보기 2 - 상세 설명
9 여분필드를 활용한 게시판 스킨 제작 - 기본적인 사용 방법 댓글4
10 여분필드를 활용한 게시판 스킨 제작 - 기초 예제1-1 (글쓰기 페이지)
열람중 여분필드를 활용한 게시판 스킨 제작 - 기초 예제1-2 (목록 페이지) 댓글3
12 여분필드를 활용한 게시판 스킨 제작 - 기초 예제1-3 (글읽기 페이지)
13 여분필드에 스마트 에디터 사용하기
14 DatePicker 달력 플러그인을 활용한 날짜 입력 쉽게하기 댓글1
15 게시판 글쓰기 완료 후 목록 페이지나 메인 페이지로 이동시키기
16 게시판 목록 및 내용보기 페이지에 회원 정보 여분필드 출력 방법
17 이름이나 전화번호 중간 부분을 *** 표시로 숨기기 댓글2
18 게시판 글쓰기 페이지에 다음 주소 API 입력기 사용하기 댓글4
19 게시판 스킨 목록 페이지에 이전 다음 페이지 링크 만들기
20 게시판 설정에 있는 여분 필드란 무엇인가?
21 여분필드를 활용한 게시판 스킨 제작 - 여분 필드 10개 이상 사용하기 댓글8
22 배열을 사용해서 여분필드 한 개로 연락처 입력란 3등분하기
23 글쓰기 페이지에서 게시물 수정 모드일 때 삭제 버튼 링크 추가하기 댓글1
24 휴대폰번호 중간에 자동으로 하이픈(-) 넣기
25 게시판 목록페이지 상단 분류를 이미지로 변경
26 글 수정 모드에서 첨부된 파일 다운로드 링크 추가
27 게시판이나 최신글 목록에서 비밀글 제목은 숨김 처리
28 input 필드값을 입력받을 때 무조건 숫자만 입력 댓글1
29 글 수정모드에서 첨부된 이미지 썸네일로 미리보기 댓글3
30 제목 또는 내용 없이 글 작성하기 - 설정해 놓은 문구 자동 입력
31 본문에 댓글을 남겼는지 체크해서 활용하기 댓글5
32 코멘트 비밀글 체크박스 삭제시 문제 해결
33 본문 페이지에서 특정 이미지를 선택해서 출력하는 방법
34 글 보기 페이지에 이전글 다음글 제목 날짜 출력 댓글1
35 링크 주소 입력 개수 늘리는 방법
36 기본 gallery 스킨에서 공지사항도 썸네일 이미지 출력
37 새 코멘트가 등록되었을 때 게시판 목록에 new 아이콘 출력 댓글6
38 리스트 정렬 필드를 여분필드값 기준으로 정렬하는 방법
39 신청서나 예약 게시판 등에서 글을 작성할 때 회원 정보에 있는 값 가져오기
게시물 검색


그누스터디는 그누보드, 영카트 초보 사용자를 위한 정보를 공유합니다.

Copyright © GNUSTUDY. All rights reserved.
상단으로