게시판 만들기 (01) - 게시판의 구조

게시판 만들기 (01) - 게시판의 구조

게시판 스킨은 Rhymix/XE에서 게시판 모듈의 외관과 기능을 담당하는 중요한 요소입니다. 이 문서에서는 게시판 스킨의 기본 구조와 필수 파일들에 대해 설명합니다.

참고 자료

게시판 스킨 디렉토리 구조

기본 위치

/modules/board/skins/[스킨이름]/

디렉토리 구조 예시

/modules/board/skins/my_board_skin/
├── skin.xml                    # 스킨 설정 파일
├── list.html                   # 목록 페이지
├── write_form.html             # 글쓰기 폼
├── view_document.html          # 글 보기 페이지
├── comment_form.html           # 댓글 작성 폼
├── assets/
│   ├── css/
│   │   └── style.css          # 스타일시트
│   ├── js/
│   │   └── script.js          # 자바스크립트
│   └── img/                   # 이미지 파일들
└── ...

필수 파일 설명

게시판 스킨을 만들기 위해서는 다음과 같은 필수 파일들이 필요합니다:

1. skin.xml

게시판 스킨의 기본 정보를 포함하며, 관리자 화면에 보여줄 설명과 옵션을 제공합니다.

<?xml version="1.0" encoding="UTF-8"?>
<skin version="0.2">
    <title xml:lang="ko">내 게시판 스킨</title>
    <description xml:lang="ko">커스텀 게시판 스킨입니다.</description>
    <version>1.0</version>
    <date>2024-01-01</date>
    <author email="author@example.com" link="https://example.com">
        <name xml:lang="ko">제작자명</name>
    </author>
    <license>MIT</license>
    <colorset>
        <color name="default">
            <title xml:lang="ko">기본</title>
        </color>
    </colorset>
</skin>

2. list.html

게시물 목록을 보여주는 페이지입니다. 게시판의 메인 화면이라고 할 수 있습니다.

주요 변수:
- $document_list: 게시물 목록
- $total_count: 전체 게시물 수
- $total_page: 전체 페이지 수
- $page: 현재 페이지
- $page_navigation: 페이지 네비게이션

3. write_form.html

게시물을 작성하거나 수정할 때 사용되는 폼 파일입니다.

주요 요소:
- 제목 입력 필드
- 내용 편집기
- 카테고리 선택
- 파일 첨부
- 확장 변수 입력

4. view_document.html

게시물 내용을 보여주는 페이지입니다. (일부 스킨에서는 list.html에 통합되어 있을 수 있습니다)

주요 변수:
- $oDocument: 문서 객체
- $oDocument->getComments(): 댓글 목록

5. comment_form.html

댓글을 작성할 때 사용되는 폼 파일입니다.

6. delete_form.html

게시물을 삭제할 때 비밀번호를 입력받는 폼입니다.

7. delete_comment_form.html

댓글을 삭제할 때 사용되는 폼입니다.

8. delete_trackback_form.html

엮인글(트랙백)을 삭제할 때 사용되는 폼입니다.

9. input_password_form.html

비밀글 등에 접근할 때 비밀번호를 입력받는 폼입니다.

10. message.html

각종 알림 메시지를 출력하는 파일입니다.

추가 파일들

필수는 아니지만 자주 사용되는 파일들:

  • _header.html: 게시판 상단 공통 영역
  • _footer.html: 게시판 하단 공통 영역
  • _comment.html: 댓글 목록 표시
  • category.html: 카테고리 네비게이션

스타일과 스크립트

CSS 파일

/assets/css/style.css

게시판의 모든 스타일을 정의합니다. 반응형 디자인을 고려하여 작성하는 것이 좋습니다.

JavaScript 파일

/assets/js/script.js

게시판의 동적 기능을 구현합니다. jQuery를 기본으로 사용할 수 있습니다.

개발 시 주의사항

  1. 템플릿 문법: Rhymix/XE의 템플릿 문법을 정확히 이해하고 사용해야 합니다.
  2. 변수 확인: 각 페이지에서 사용 가능한 변수를 확인하고 적절히 활용합니다.
  3. 권한 체크: 글쓰기, 수정, 삭제 등의 권한을 적절히 체크해야 합니다.
  4. 보안: XSS, CSRF 등의 보안 취약점에 주의합니다.
  5. 호환성: 다양한 브라우저와 디바이스에서 테스트합니다.

다음 단계

게시판의 기본 구조를 이해했다면, 다음 단계로 각 파일의 구체적인 구현 방법을 학습하시기 바랍니다. 특히 list.html과 write_form.html의 구현이 가장 중요합니다.

출처: http://study4you.kr/xe/homepage/18936