Skip to content

Development Make Theme Template

Jump to bottom
JoungKyun Kim edited this page Jun 6, 2016 · 1 revision

JSBoard Theme 제작

##1. 개요

일단 테마를 만들려면 테마의 이름은 대문자언어코드-테마이름 (예를 들어 KO-default) 의 형식을 가져야 한다. 또한 theme directory의 테마들은 테마 이름의 디렉토리를 가지고 있어야 한다.

KO-default theme 에 있는 파일들은 모두 존재해야하며 image는 img 디렉토리 아래에 admin.gif 가 꼭 존재해야 한다. 각 html template 에서 *** ?>***로 쌓여져 있는 부분은 게시판에서 꼭 필요한 부분 들이기 때문에 모두 사용을 해야 한다. 혹시 빠지는 것을 대비 하기 위해 게시판 관리자에서 모든 기능을 활성화 한 상태에서 theme 를 만들기 바란다.

admin.gif 는 admin page link 이다. admin page link 는 각 게시판 관리자에서 보여주고 안보여줄 수 있도록 옵션화 되어 있으므로 일단은 꼭 존재하는 형태로 만드는 것을 권장한다.

또한 메뉴 역시 image 로 만들수 있는데 이때에는 img/ 디렉토리에 다음 표의 이미지 파일들이 존재해야 한다.

  • prev.gif : 이전글 또는 이전 페이지
  • next.gif : 다음글 또는 다음 페이지
  • list.gif : 글 목록
  • write.gif : 글 쓰기
  • today.gif : 최근 12시간내 올라온글
  • delete.gif : 삭제
  • edit.gif : 수정
  • reply.gif : 답장
  • conj.gif : 관련글
  • rep.gif : 댓글의 화살표 이미지
  • logout.gif : login 시 logout 을 위한 이미지 링크
  • admin.gif : admin page 를 위한 이미지 링크

그리고 list.template 와 read.template 에서 list_cmd(0,1) 과 read_cmd(0,1) 을 list_cmd(1,1), read_cmd(1,1) 로 만들어 주면 된다.

댓글의 화살표 이미지는 img/ 디렉토리에 rep.gif 라는 이름으로 다른 이미지를 사용할 수 있다.

그리고 template 상에서 수정할수 없는 몇몇 색상들과 테이블 길이 같은 것들은 theme_name/config.php 에서 지정을 할수 있게 되어 있다.

나머지는 마음대로 하면 된다.

##2. 참고

default theme 의 각 파일에 필요한 변수에 대한 주석이 있으니 참조를 하면 된다. 기본 이미지는 theme/theme_name/img/ 에서 admin.gif, logout.gif 만 꼭 필요하며 나머지는 옵션이라고 생각을 하면 되겠다.

또한 theme 디렉토리에 위치한 테마들은 자동으로 각 게시판의 관리자에 등록이 되니, 게시판 관리자에서 새로 등록된 테마를 선택해서 사용하면 된다.

또한 KO-theme_name/config.php 의 $designer['ver'] 와 include/version.php 의 $theme['ver'] 의 값이 동일해야 테마를 사용할 수 있다. 이는 버젼별 테마 사용에 혼란이 없도록 하기 위해 표현을 한다. 만약 테마의 수정이 가해지면 include/version.php 의 $theme['ver'] 의 값이 변경이 된다.

##3. Search FORM

검색 폼은 아래의 폼문을 기본으로 가지고 있어야 한다. 이 폼문을 기본으로 디자인을 하면 된다.

<form method="post" action="locate.php?table=<?=$table?>">
  <select name="o[sc]">
    <option value="t"<?=$sform[sc][t]?>>Title
    <option value="c"<?=$sform[sc][c]?>>Contents
    <option value="n"<?=$sform[sc][n]?>>Writer
    <option value="a"<?=$sform[sc][a]?>>All
  </select>
  <input type="text" name="o[ss]" size="<?=form_size(8)?>" maxlength="255" value="<?=$sform[ss]?>">
  <input type="submit" value="Search">

  <select "name=o[st]">
    <option value="m"<?=$sform[st][m]?>>A Month
    <option value="w"<?=$sform[st][w]?>>A Week
    <option value="a"<?=$sform[st][a]?>>All
  </select>

  <input type=checkbox name=o[er] value=y<?=$sform[er][y]?>> Regular Expression

  <input type="hidden" name="o[at]" value="s">
  <input type="hidden" name="o[go]" value="p">
  <input type="hidden" name="o[sct]" value="s">
  <input type="hidden" name="o[stt]" value="s">
</form>

주의 할 것은 하단의

  <input type="hidden" name="o[sct]" value="s">
  <input type="hidden" name="o[stt]" value="s">

부분의 값인데 이 부분은 2개의 select 문에 대한 정의를 해 주는 변수이다. 즉 처음 title, contents, writer, all 에 관련된 부분을 select 로 처리할 경우에는 o[sct] 의 값이 s 가 되며 checkbox 또는 radio 로 했을 경우에는 c 의 값으로 변경해 줘야 한다. 이는 검색후에 검색폼이 검색한 값을 유지시키기 위해 필요하다.

검색 기간에 대한 select 역시 o[stt] 의 값에 위와 같이 동일하게 적용시키면 된다. 만약 select 문을 checkbox 나 radio button 으로 변경하여 사용할 경우에는 서치폼 위에

<?php
if( ! $o['at'] ) {
  $sform['sc']['t'] = " checked";
  $sform['st']['m'] = " checked";
}
?>

코드를 넣어 줘야 한다.

<form method="post" action="locate.php?table=<?=$table?>">
  <?=$pform[post]?>
  <select name="o[go]">
    <option value="p" selected>Page No.
    <option value="n">Article No.
  </select>
  <input type="text" name="o[no]" size="<?=form_size(2)?>" maxlength="6" value="<?=$pform[value]?>">
  <input type="submit" value="Go!">
</form>

을 가지고 디자인을 적용시키면 된다.

##4. Comment Form

Comment Form 중 SORT link 과 Delete link 는 이미지를 사용할 수 있다. 각 테마 디렉토리의 img 디렉토리에 cdelete.gif, csortup.gif, csortdn.gif 를 위치 시킴으로서 텍스트 링크를 image 링크로 변경할 수 있다.

Clone this wiki locally