![]() |
매크로 문서는 쎄지오 웹서비스 가운데 게시판서비스, 오류메시지 표시, 로그인 등의 주요 화면을 표시하기 위해 운영되는 html문서입니다. 공유웹자원의 macro( URI: /icons/macro/ )디렉토리에는 웹서비스화면 구성을 관장하는 웹문서가 위치하고 있습니다. 기본적인 파일 이외로 "image/", "dict/" 등의 두개의 예약 하위디렉토리가 존재합니다.
게시물의 편집, 읽기, 목록을 구성하는 매크로문서는 "image/", "dict/" 이외의 하위디렉토리를 추가하고 각 문서를 작성하면 게시판 환경설정에서 매크로문서를 선택하여 다른 디자인의 게시판으로 활용할 수 있게 됩니다.
1) 인증확인 ( auth_check.html ) |
맨위로 |
게시판에서 게시물을 작성할 때 패스워드를 등록하는 경우가 있습니다.. 이는 다른 사람이 읽거나 편집하는 등의 접근을 차단할 목적으로 하거나 손님의 경우 추후 게시물을 삭제하거나 편집할 수 있도록 합니다. 비밀번호가 맞는지 확인하기 위하여 웹페이지가 나타나는데 이때의 화면을 구성해주는 문서입니다. 다음은 이해를 돕기위한 예시 문서입니다.
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en"> <head> <title>$#i.name#;</title> </head> <body> $#shell#; <div align="center" style="padding:20px;"> <form target="action_pw" method="post" acti0n="$#i.zeroid#;" enctype="multipart/form-data" name="auth_form"> <input type="hidden" name="referer" value="$#l.referer#;" /> <div class="msg_contain"> <div class="title_line"> Input the password. </div> <div class="pass_line"> <b>PassWord:</b> <input name="passwd" type="password" class="pw_input" value=""/> </div> <div class="base_line"> <butt0n type="submit">Submit</button> <butt0n name="cancel" 0nclick="history.back();">Cancel</button> </div> </div> </form> </div> </body> </html> |
다음 그림은 비밀번호가 입력된 게시물을 읽으려고 할 때 접근권한을 확인하기 위하여 비밀번호를 묻는 웹화면의 예입니다.
2) 오류 표시 ( err_access.html) |
맨위로 |
오류 표시 문서는 다양한 형태의 오류를 표시하는 화면을 구성합니다. 시스템에서의 오류 안내는 크게 두가지 방식으로 이루어집니다. 하나는 자바스크립트에 의한 경고문구 표시인데 이는 다이얼로그박스 형태로 나타납니다. 또 다른 하나는 웹페이지에 오류정보를 표시하는 것으로 바로 오류표시 웹매크로에 의해 구현됩니다.
다음은 이해를 돕기위한 예시 문서입니다.
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en"> <head> <title>$#i.name#;</title> </head> <body> $#shell#; <div align="center" style="padding:20px;"> <input type="hidden" name="referer" value="$#l.referer#;" /> <div class="msg_contain"> <div class="title_line"> Access Error message !! </div> <div class="pass_line"> <b>"$#error#;"</b> </div> <div class="base_line"> <butt0n 0nclick="history.back(-1);">Return</button> </div> </div> </div> </body> </html> |
3) 로그인 ( login.html ) |
맨위로 |
사용자가 로그인을 하기 위해서는 사용자 아이디와 비밀번호를 입력하여 서버로 전송하여야 합니다. 이러한 로그인 과정을 위해서 "<form>"태그 구문을 포함하는 로그인 폼문을 필요로 하는데 기초적인 로그인 폼문을 제공하기 위하여 준비되는 문서입니다. 다음은 이해를 돕기위한 예시 문서입니다.
준비된 로그인 매크로문서는 강제접속을 포함하여 로그인시 기본적으로 동작해야 하는 기능들이 구성되어 있습니다. 간혹 일반적인 로그인폼이 변형되어 관리자 로그인이 안되는 경우 비상 로그인 목적으로 활용될 필요가 있습니다. 일반적인 로그인 폼은 웹디자인 과정에서 웹레이아웃에 잘 어울리도록 별도로 구성하여 사용할 수 있습니다.
다음 그림은 로그인 매크로문서로 구현된 팝업윈도우의 예입니다.
4) 로그인 성공 ( ok_login.html ) |
맨위로 |
로그인성공 매크로문서는 로그인 성공시 웹브라우저에 뿌려지는 웹화면을 구성합니다. 이 문서는 대부분 감춰진 아이프레임에 작동하여 사람에게 직접 보여지지는 않습니다. 따라서 디자인적인 측면보다는 로그인에 성공했을 경우 로그인과 동시에 필요한 후처리 기능을 보완할 목적으로 사용될 수 있습니다.
다음은 이해를 돕기위한 예시 문서입니다.
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd" > <html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en"> <head> <title>Welcome sign in "$#i.host#;"</title> </head> <body> <script type="text/javascript"> <!-- function chatframe_reload() { chatframe=null; if(typeof(top)!='undefind'){ if(typeof(top.chatframe)!='undefined'){ chatframe=top.chatframe; } else if(typeof(top.opener)!='undefind'){ if(typeof(top.opener.top.chatframe) != 'undefind'){ chatframe = top.opener.top.chatframe; } } } if(chatframe != null){ chatframe.location.reload(); } return; } chatframe_reload(); --> </script> </body> </html> |
일반적인 쎄지오 레이아웃에서 chatframe.html 파일은 로그인된 사용자의 경우 웹채팅을 위한 자바애플릿을 구동하도록 하고 있습니다. 사용자가 로그인 되어있지 않은 상태에서는 웹채팅에 사용되는 자바 애플릿이 로딩되어 있지 않습니다. 따라서 로그인에 성공하면 ok_login.html 에서는 자바스크립트를 이용하여 chatframe.html 문서가 자동으로 리로드 되도록 하여 줍니다. 이 과정에서 java 애플릿이 기동하게 되어 웹채팅 서비스가 작동되는 것입니다.
웹 채팅 이외에도 로그인 인증과 동시에 연계된 다른 사이트를 사용할 수 있도록 허용하기 위한 쿠키를 설정한다거나 하는 추가적인 작업을 설계할 수도 있습니다.
5) 게시물 편집화면 |
맨위로 |
게시판은 게시물의 편집, 게시물읽기, 게시물 목록 등의 주요 기능에 대하여 각각 매크로문서를 이용하여 웹서비스를 제공합니다. 모든 인트라셀에서 공용으로 사용할 수 있는 게시판 매크로문서는 공유웹자원의 기본 매크로문서 디렉토리내에 위치하며 ( /etc/shttpd/icons/macro/ )종류는 다음과 같습니다.
문서명 | 기본위치 | 비고 |
편집 매크로문서 | post_edit.html | 게시물 작성, 수정 화면 |
읽기 매크로문서 | post_read.html | 게시물 읽기 화면 |
목록 매크로문서 | post_list.html | 게시물 목록 화면 |
인증 매크로문서 | auth_check.html | 게시물 읽기 비번 확인 |
게시판 CSS문서 | board.css | 게시물 화면의 디자인 구성 |
게시판에 따라서는 환경설정에서 매크로문서를 지정할 수 있습니다. 매크로문서를 지정하면 게시판은 "folder/html/icons/macro/" 이하의 매크로문서 디렉토리 하위에서 편집, 읽기, 목록 등의 매크로문서를 우선 찾습니다. 해당 문서가 없을 경우 공유 웹자원의 /etc/shttpd/icons/macro/ 이하의 매크로문서 디렉토리에서 찾습니다.
예) Macro 지정 : test 편집화면 → folder/html/icons/macro/test/post_edit.html 문서가 있는 경우 동작함 목록화면 → folder/html/icons/macro/test/post_list.html 문서가 있는 경우 동작함 읽기화면 → folder/html/icons/macro/test/post_read.html 문서가 있는 경우 동작함
- 각 파일이 없는 경우 공유웹자원의 '/etc/shttpd/icons/macro/test/' 에서 찾아 작동합니다. - 실패하면 다시 '/etc/shttpd/icons/macro/'에서 대응 매크로문서를 찾아 작동합니다. |
게시판 매크로문서는 알맹이 문서부분을 담당하며 호출 쉘을 상속받아 적용 될수 있습니다. 쎄지오 웹게시판 서비스의 일관성을 유지하기 위하여 게시판 매크로문서에 다음과 같은 자바스크립트와 CSS 문서를 링크시켜야 합니다.
<script src="/icons/adds/segio.js" type="text/javascript"></script> <link href="$#l.base#;board.css?colorset=$#b.colorset#;" rel="stylesheet" type="text/css" /> |
위의 두 파일은 쎄지오의 각종 관리기능의 화면구성에도 공통적으로 적용됩니다.
편집 매크로문서는 게시물의 편집을 위한 화면구성을 담당합니다. 편집 매크로문서는 새 게시물 작성 및 기존 게시물의 편집을 위해서도 사용됩니다. 다음 그림은 편집화면의 예입니다.
"post_edit.html"은 편집 매크로문서로 알맹이 문서의 형식을 취하도록 설계됩니다. 다음은 배포판에 포함된 요약내용입니다.
<html> <head> <title>게시물 편집하기: $#b.name#;($#b.id#;)</title> <script src="/icons/adds/segio.js" type="text/javascript"></script> </head> <body> $#shell#; $#brd.head#; ... [게시물 기초정보 입력부분 ]... ... [게시물 본문 편집부분 ]... ... [첨부파일 옵션부분 ]... $#brd.tail#; </body></html> |
게시물 매크로문서의 디자인 요소는 같은 디렉토리에 위치한 board.css 에서 정의합니다.
게시판의 편집화면은 위지윅 HTML 을 편집할 수 있는 fck 에디터를 사용합니다. html 편집기를 호출하기위해서는 다음과 같은 자바스크립트를 설정해야 합니다.
$#if b.editor#; <script type="text/javascript" src="/icons/fckeditor/fckeditor.js"></script> <script type="text/javascript"> <!-- var ImageWidthFit='$#b.widthfit#;'; window.0nload=function () { editor_init('context'); } --> </script> $#fi#; |
게시판 환경설정에서 에디터부분의 스위치를 선택했다면 “$#if b.editor#;”구문이 참 값을 갖게되어 에디터를 호출하는 구문이 작동합니다. 본문편집을 위해 선언되는 <textarea> 태그는 name 과 id 속성이 “context"로 지정어 있어 "editor_init"함수의 변수와 대응됩니다.
게시판의 매크로문서는 여러 게시판에서 공동으로 이용되기 때문에 지정 쉘을 지정하지 않도록 합니다. 환경설정에서 쉘 문서를 지정하면 지정 쉘로 작동됩니다. 환경설정에서의 쉘 지정 방식보다는 호출 쉘을 이용한 쉘 이어받기로 연계하는 것이 효과적입니다.
$#b.head#;구문은 상단부분에 해당되는 html로 치환됩니다. 게시판 상단부분은 각 로케이션의 환경설정과 게시판 환경설정에서 지정할 수 있습니다.
게시물의 편집은 편집된 자료를 웹서버에 전송하여 저장하는 단계로 진행됩니다. 편집데이터를 서버에 전송하기 위해 다음과 같이 Form 구문을 구성해야 합니다.
<form method="post" enctype="multipart/form-data" id="editform" target="$#i.zeroid#;"> ...[데이터 입력 폼] ... </form> |
"action"은 편집화면의 URL과 동일하므로 생략합니다. "target"에 "$#i.zeroid#;"로 지정하면 웹서버는 HTML 문서에 자료 전송용 iframe을 추가로 생성합니다. 이는 자료전송용 iframe을 중복적으로 사용되는 것을 방지할 목적으로 도입되었습니다.
기존 게시물을 편집할 경우 기존 게시물에 첨부된 자료파일에 대한 첨삭여부를 선택하도록 파일 선택구간을 다음과 같은 방법으로 구현할 수 있습니다.
$#if p.file#; 파일 선택: $#p.filecheck#; $#fi#; |
"$#if p.file#;" ~ "$#fi#;" 구간은 기존 게시물에 첨부파일이 있다면 작동됩니다. 다음은 이와 같은 구문의 결과로 보여지는 웹브라우저의 해당 영역입니다.
$#p.filecheck#; 구문은 체크박스와 파일이름 크기, 첨부된 시간 등을 표시하는데 정렬 표시를 위하여 바이너리의 실행에 의해 table구문으로 치환됩니다.
읽기장금장치는 비밀번호 확인 후 게시물을 읽을 수 있도록 하는 기능입니다. 보기장금장치가 설정된 게시물은 목록에는 표현되지만 인증을 거치지 않으면 게시물을 읽을 수 없습니다. 게시물에 보기잠금장치를 설정하도록 다음과 같은 구문을 사용합니다.
$#if b.readlock#; 보기잠금: <input type="checkbox" name="readlock" value="on" $#if p.readlock#; checked $#fi#; />$#if#; |
"$#b...#;", "$#p...#;"의 하위예약어인 "readlock"은 다음과 같이 의미의 차이가 있습니다.
$#if b.readlock#; → 게시판의 게시물에 읽기잠금장치를 설치가 허용되었다면 $#if p.readlock#; → 게시물에 읽기잠금이 설정되었다면 |
게시판의 읽기잠금장치를 설정하면 게시물을 편집할 때 읽기잠금장치를 설정할 수 있습니다. 게시판의 읽기잠금장치를 해제하더라도 기존 게시물에 설치된 읽기잠금장치는 해제되지 않으며 편집모드에서는 게시판의 읽기잠금장치를 선택할 수 있습니다.
게시물을 작성한 사용자는 사용자ID를 검토하여 편집 및 삭제권한을 부여합니다. 손님의 경우 편집, 삭제, 읽기 등에 대하여 필요한 인증을 거쳐야 합니다.
$#if b.readlock || u.lv<1#; <input type="password" name="passwd" value="$#p.passwd#;" style="width:30px" /> $#fi#; $#if b.readlock#; <input type="checkbox" name="readlock" value="on" $#if p.readlock#;checked="true"$#fi#; /> $#fi#; |
웹매크로의 조건문은 OR 연산자로 게시판에 뷰락이 설치되었거나 사용자 등급이 손님등급인 조건을 만족할 때 패스워드를 입력받도록 합니다.
게시판에 무명씨(NOBODY)옵션이 설정되었다면 작성자의 이름 및 ID가 기록되지 않습니다. 손님이 글을 쓰거나 무명씨옵션이 설정된 경우에는 다음과 같이 이름을 입력할 수 있도록 합니다.
$#if b.nobody || u.lv<1#; <input name="uname" value="$#p.uname#;" style="width:30px" /> $#fi#; |
게시판 관리자가 등록자 이름을 지정하면 사용자 ID는 지정되지 않습니다.
#$if b.owner#; <input name="uname" value="$#p.uname#;" style="width:30px" />$#fi#; |
게시판 관리자는 이 기능을 이용해서 개인이 아닌 기관이나 부서명의의 게시글을 등록할 수 있습니다.
게시물에 URL이 등록되었을 경우 목록에서 URL을 링크하도록 go2url이 선택되었거나 손님의 경우 전자우편주소와 홈페이지를 입력하도록 다음과 같이 구성합니다.
$#if b.go2url || u.lv<1#; 전자우편: <input name="email" value="$#p.email#;" /><br /> 홈페이지: <input name="url" value="$#p.url#;" /><br /> $#fi#; |
다음은 자동답변메일에 대한 옵션지정을 위한 예문입니다. 자동답변메일은 게시물에 답글을 달 경우 답글을 원 게시물에 등록된 전자우편주소로 발송해주는 기능입니다.
$#if b.remail#;자동답변메일: <input type="checkbox" name="remail" value="on" $#if p.remail#; checked="true" $#fi#; />$#if#; |
자동답변메일에 선택사항은 게시판과 게시물에서 각각 지정됩니다.
$#if b.remail#; → 게시물에 자동답변메일장치를 설치할 수 있도록 설정되었다면 편집화면에서는 게시물의 자동답변이 설치된 경우 참으로 작동함. $#if p.remail#; → 게시물에 자동답변메일장치가 설치되었다면 |
자동답변메일은 답글을 작성자가 메일발송 권한이 있을 경우에만 작동합니다.
게시물 본문의 자바스크립트는 기본적으로 작동하지 않습니다. 게시물의 자바스크립트가 실행을 허용여부를 설정하도록 다음과 같은 구문을 사용합니다.
$#if b.script || b.owner#;스크립트: <input type="checkbox" name="script" value="on" $#if p.script#;checked="true"$#fi#; /> $#if#; |
게시판의 관리자이거나 게시판의 환경설정에서 스크립트 지원이 설정되어 있다면 게시물의 자바스크립트 지원여부를 결정할 수 있습니다.
$#if b.script#; → 게시판의 게시물에 스크립트 지원을 설정할 수 있도록 설정되었다면 편집화면에서는 게시물의 스크립트 지원이 설정된 경우 참으로 작동함. $#if p.script#; → 게시물에 스크립트 지원이 설정되었다면 |
공지게시물은 게시판 목록에서 항상 상위에 굵은 글씨로 랭크되도록 하는 기능입니다. 다음은 공지게시물 설정부분에 대한 html 예문입니다.
$#if b.owner||p.notice#; Notice <input type="checkbox" $#if p.notice#;chekced="true"$#fi#; name="notice" value="on" /> $#fi#; |
게시판에서 공지기능이 활성화 되었다면 모든 사용자가 그렇지 않다면 게시물 관리자만 게시물의 공지 옵션을 선택할 수 있습니다. "$#if p.notice#;"구문은 공지옵션이 선택되었는지의 여부를 표시하는데 기존 게시물의 편집을 위해서 사용됩니다.
$#if p.notice#; → 게시물이 공지게시글로 설정되었다면 |
게시판 환경설정에서 투표 기능이 지원되도록 하였을 경우 게시물 자체에 투표기능을 편집할 수 있도록 다음과 같은 구문을 작성합니다.
$#if b.owner||b.poll#; <tr> <td class="cell4name">투표기능</td> <td class="cell4input"> <input type="checkbox" class="checkbox" name="poll" value="on" $#if p.poll#;checked="true"$#fi#; /> <input style="width:90%;" name="pollstr" value="$#p.pollstr#;" /> </td> </tr> $#fi#; |
$#p.pollstr#;은 설문조사용 지문으로 세미콜론(;)으로 구분하여 10개 까지의 문항을 조합하여 입력하되 처음 영역은 예약구간으로 문항에서 제외됩니다.
편집 매크로문서는 새글 작성, 기존글 수정, 답변 작성 등의 목적으로 사용됩니다. 게시물을 수정하거나 원문을 인용하는 답변을 작성한다면 <textarea>에 초기화된 값이 표시되어야 합니다. 다음은 본문 편집부분의 요약내용입니다.
$#if p.pid && !p.id && b.blockquote#; <textarea name="context" id="context" class="context"><br /> <blockquote style="border-left:3px solid #000000;">원문<br /> -------------------------------------------------<br /> $#p.context#;</blockquote></textarea> $#else#; <textarea name="context" id="context" class="context">$#p.context#;</textarea> $#fi#; |
본문편집을 위해서 사용된 조건분기문은 다음과 같이 해석될 수 있습니다.
$#if p.pid && !p.id && b.blockquote#; (원문참조해서 새 답글을 작성할 때로 해석됨) p.pid → 게시물의 부모글 아이디 (답글일 때만 참) p.id → 게시물의 아이디(기존글 편집일 때는 참, 새글일 경우 0) b.blockquote; → 게시판 환경설정에서 답글 달 때 원문참조 옵션이 지정된 경우. |
원문참조가 없는 새 답글이 아닌 경우에는 "$#p.context#;"구문으로 본문이 초기화됩니다. 새글에는 초기 본문이 없으므로 $#p.context#;는 공백으로 치환됩니다.
PC에서 파일을 업로드할 수 있도록 제공되는 영역입니다. 게시물 당 최대 40개의 파일이 포함시킬 수 있는데 다음은 3개의 파일을 올리도록 구성한 예입니다.
$#if b.file#; <input type="file" name="file" size="50" /> <input type="file" name="file" size="50" /> <input type="file" name="file" size="50" /> $#fi#; |
"$#if b.file#;" ~ "$#fi#;" 구문으로 첨부파일을 환경설정에서 활성화되었을 때만 파일업로드 영역이 나타납니다.
필요에 따라서 파일 업로드 영역을 추가할 수 있도록 자바스크립트를 응용할 수 있습니다. 다음은 그 예제입니다. 지면상 내용을 요약하였습니다.
<script type="text/javascript"> <!-- function set_filediv_input(){... } // div id에 input 필드 설정합니다. function make_filediv(divs){ ... }// div를 생성합니다. function show_filediv() {... } //div id를 기반으로 div에 input 필드를 설정합니다. --> </script>
... 생략 ...
<script type="text/javascript"><!-- make_filediv(20); // 20개까지의 div를 생성합니다. --></script>
<butt0n 0nclick="show_filediv(1);return(false);" class="mybutton" title="첨부 파일 수를 추가합니다">+</button> |
자바스크립트는 파일업로드를 위한 <input>구문을 20개까지 만들어 놓고 보이지 않도록 합니다. 추가적으로 수를 늘릴때마다 해당 파일선택영역이 보이게 합니다. 다음은 “+”버튼을 눌러 4개까지의 파일을 업로드 할 수 있도록 변형된 예입니다.
마이폴더(내폴더)가 있는 사용자는 다음의 구문을 이용하여 마이폴더(내폴더)로부터 파일을 업로드할 수 있도록 하 수 있습니다.
$#if u.home.folder#; <textarea id="onfile" name="onfile" class="onfile"> </textarea> <butt0n 0nClick="$#popup.onfile#;" class="mybutton">마이폴더(내폴더)</button> <butt0n 0nClick="document.getElementById('onfile').value='';" class="mybutton">선택취소 </button> $#fi#; |
“$#if u.folder#;"구문은 마이폴더(내폴더) 소유자에게만 작동하도록 합니다. 다음은 파일 전송과 마이폴더(내폴더) 브라우징이 함께 표시된 예입니다.
사용자의 마이폴더(내폴더)는 웹메일이나 게시물에 첨부된 자료파일을 별도로 보관하기 위해 사용됩니다. 또한 자신의 PC로부터 특정파일을 마이폴더(내폴더)에 옮겨놓을 수 있습니다.
6) 게시물 읽기 화면 |
맨위로 |
게시물 읽기 매크로문서는 게시물을 읽을 때의 웹화면 구성을 담당합니다. 다음은 그림은 게시물 읽기의 예입니다.
다음은 위의 그림과 같은 읽기 매크로문서의 요약 내용입니다.
<!-- ## 제목, 자바스크립트 ---> <!-- ## 스타일 선언 --> <!-- ## 바디 선언, 쉘문서 호출, 게시판 상단 -->
제목: $#p.title#; 글쓴이: $#p.uname#; 조회수: $#p.read#; 작성일: $#p.date#; $#p.time#; 번호:$#b.postno#;/$#b.posts#;
<!-- ## 메뉴 버튼 부분 --->
<!-- ## 전자우편, 홈페이지, 첨부파일 ---> <!-- ### 첨부파일 플러그인 체크 ### --!> $#p.context#; <!-- #### 메뉴 버튼 부분 ### --!> <!-- #### 첨언표시 및 입력부분 ### --!> $#b.list#; $#b.pagemenu#;
$#b.tail#; |
게시물의 기초정보인 제목, 글쓴이, 조회수, 작성일, 번호 등이 표시합니다. 다음글, 이전글 등이 링크되어 있으며 추가적인 정보인 전자우편이나 홈페이지, 첨부파일에 대한 표시부분은 "$#if p.*#; ~ $#fi#;"구문을 이용하여 해당정보가 있을 경우에만 표시하도록 하고 있습니다.
댓글을 입력한 후 서버에 전송하는 단계로 진행되므로 POST 방법에 의해 댓글을 등록할 수 있도록 "<form>~</form>"구문을 설치하여야 합니다. 댓글은 입력한 사용자나 비밀번호를 인식하여 삭제할 수 있습니다.
$#p.words#;
$#if b.words#; <form method="post" Name="gtext" target="$#i.zeroid#;"> ㆍ 댓글달기: $#if l.lv<1#; 이름:<input name="uname" value="" value="$#u.name#;" /> 비밀번호: <input name="passwd" type="password" /> $#fi#; <textarea name="words" class="comment"></textarea> <input type="submit" name="ok" value="등록" /> </form> $#fi#; |
"$#if b.words#;"구문은 게시판 환경설정에서 댓글달기가 지정되었을 때 참으로 작동됩니다. 0 등급의 손님 사용자는 이름과 비밀번호를 입력하도록 하고 있습니다.
게시물의 내용을 인쇄하거나 답변을 달거나 지우거나 수정등의 기능은 "$#p.m_*#;"형식의 예약어를 이용하여 표시됩니다. 게시판 아이콘 디렉토리의 "v_*.gif"형태의 아이콘과 함께 작동합니다. 다음은 읽기매크로문서 메뉴부분의 예입니다.
$#p.m_print,인쇄#;$#p.m_reply,답변#; $#p.m_move,전달#; $#p.m_del,지움#; $#p.m_edit,수정#; $#p.m_down,아랫글 읽기#; $#p.m_list,목록#; $#p.m_up,윗글 읽기#; |
첨부파일 표시 부분
$#if p.file#; <tr><td class="cell4name1">첨부파일</td> <td class="cell4value1" align="left"> <script type="text/javascript"> <!-- _post_attached(PostFiles); // html/segio/segio.js 파일에 정의되어 있음. --> </script> </td> </tr> $#fi#; |
동영상, 플래시, 이미지 등의 자료파일이 있는 경우 웹상에서 자동으로 실행되어 보여지도록 되어 있습니다. 다음은 플러그인을 구현한 일부 예입니다.
<div style="text-align:center;" id="multimedia_play"> <script type="text/javascript"> <!-- _em_attached(PostFiles); --> </script> </div> |
다음 그림은 게시물에 첨부된 avi(wma) 파일을 자동으로 실행되는 모습을 보여줍니다.
게시판 환경설정에서 투표기능을 설정하면 게시물 편집창에서 게시물 투표에 필요한 투표 문항을 지정할 수 있습니다. 게시물 편집창에서 "투표"를 설정하면 해당 게시물에 투표기능을 사용하겠다는 것으로 간주됩니다. 그 다음 선택문항을 입력하는데 문항은 세미콜론(;)으로 구분되며 첫 번째 문항은 예약되어 선택문항으로 생성되지 않습니다.
게시물 투표가 진행하거나 게시물 투표의 결과를 보기 위하여 다음과 같은 구문을 사용합니다. board.css에 구성하도록 합니다.
.bar4poll0{ background:#FF0000;height:4px;border:1px #ff0000 solid; } .bar4poll1{ background:#00FF00;height:4px;border:1px #00ff00 solid; } .bar4poll2{ background:#0000FF;height:4px;border:1px #0000ff solid; } .bar4poll3{ background:#FF00FF;height:4px;border:1px #ff00ff solid; } .bar4poll4{ background:#FFFF00;height:4px;border:1px #ffff00 solid; } .bar4poll5{ background:#606060;height:4px;border:1px #606060; } .cell4poll { background:#ffffff;border:1px #000 solid;padding:1px 0px;width:100px; } |
다음은 게시판 투표 표시 방법입니다.
<form method="post" enctype="multipart/form-data" acti0n="" target="$#i.zeroid#;" style="padding:0;" > <div style="text-align:left;">$#p.poll#;</div> </form> |
style에 정의된 구문은 투표결과를 보여줄 막대 그래프 형식을 정하기 위해 사용됩니다. <form> 구문은 투표진행을 위해 사용합니다. 다음 그림은 투표진행 화면입니다.
다음 그림은 투표 결과 화면입니다.
투표가 진행된 결과는 특수한 목적의 첨언으로 나타나게 됩니다. 한건이라도 투표가 진행이 되면 게시물 편집을 통한 문항변경이 물가능합니다. 투표진행로그를 위한 첨언은 인트라셀 관리자에게만 보여지며 관리자는 투표진행로그를 확인하거나 지울수만 있습니다. 투표진행로그 첨언을 삭제하면 투표결과는 초기화되며 게시물 편집을 통한 문항변경이 가능합니다.
7) 목록 매크로문서 작성하기 |
맨위로 |
목록 매크로문서는 게시물 목록보기의 디자인 양식을 구성합니다. "post_list.html"문서로 저장됩니다. 다음 그림은 게시판 목록보기의 예입니다.
게시판의 목록보기는 게시판상단, 기본메뉴부분, 목록머릿부, 목록표시부분, 페이지메뉴, 아이콘메뉴부분, 검색부분 등으로 구성되었습니다. 다음은 요약내용입니다.
<html><head> <title>$#i.name#;/$#b.name#;</title> </head> <bdoy> $#shell#; $#b.head#;
<form ...... name="listform" target="$#i.zeroid#;"> $#b.m_refat#,팻정리;$#b.m_setup,환경설정#; 등록된글:$#b.posts#;개 현재:$#b.pageno#;/$#b.pages#; 페이지 $#b.owner#;
$#b.list#; <!-- 게시물목록 표시부분 --->
$#b.pagemenu#; <!-- 페이지메뉴 표시 부분 ---> $#b.m_remove#,완전삭제;$#b.m_undel,지움취소#; $#b.m_copy,복사하기#; $#b.m_paste,붙여넣기#; $#b.m_list,전체보기#;$#b.m_post,쓰기#;
$#b.queryfield#; $#b.querybox,style="width:90px",title="검색어입력"#;$#b.m_seek#; <!--- 검색서비스 --> </form> $#b.tail#; |
편집, 보기 등의 매크로문서와 동일한 방법으로 목록 매크로문서 역시 게시판 환경설정에서 설정된 색상값을 적용하기 위하여 CSS 를 지정합니다(board.css)
8) 게시판 환경설정 화면 ( board_rc.html ) |
맨위로 |
9) 게시판 디자인 정의 ( board.css ) |
맨위로 |
게시판의 읽기, 쓰기, 편집화면의 구성은 기본적으로 각각에 지정된 매크로문서에 의해 작동하며 같은 디렉토리에 있는 board.css 문서를 링크하도록 구성하십시오.
![]() ![]() ![]() ![]() |
![]() ![]() ![]() |
번호 | 파일 | 글제목 | 일시 | 조회 |
---|---|---|---|---|
58 |
![]() |
![]() |
12-08-01 | 33204 |
57 |
![]() |
![]() |
12-01-13 | 28703 |
56 |
![]() |
![]() |
11-11-17 | 35548 |
55 |
![]() |
![]() |
11-08-24 | 30547 |
54 |
![]() |
![]() |
11-07-07 | 37588 |
53 |
![]() |
![]() |
11-06-28 | 30672 |
52 |
![]() |
![]() |
11-04-14 | 31915 |
51 |
![]() |
![]() |
11-02-11 | 33182 |
50 |
![]() |
![]() |
11-01-10 | 31137 |
49 |
![]() |
11-01-04 | 31828 | |
48 |
![]() |
![]() |
10-11-19 | 29497 |
47 |
![]() |
![]() |
10-11-16 | 35288 |
46 |
![]() |
![]() |
10-11-09 | 31904 |
45 |
![]() |
![]() |
10-06-23 | 37454 |
44 |
![]() |
![]() |
10-05-24 | 34968 |
43 |
![]() |
10-03-13 | 40221 | |
42 |
![]() |
![]() |
09-07-21 | 44836 |
41 |
![]() |
![]() |
09-07-17 | 43659 |
40 |
![]() |
![]() |
09-07-13 | 39257 |
39 |
![]() |
![]() |
09-07-10 | 32632 |
38 |
![]() |
![]() |
09-07-10 | 32409 |
37 |
![]() |
![]() |
09-07-10 | 38682 |
36 |
![]() |
![]() |
09-07-10 | 31929 |
35 |
![]() |
![]() |
09-07-10 | 27289 |
34 |
![]() |
![]() |
09-07-10 | 42255 |
33 |
![]() |
![]() |
09-07-10 | 41006 |
32 |
![]() |
![]() |
09-07-10 | 39561 |
31 |
![]() |
![]() |
09-07-10 | 58911 |
30 |
![]() |
09-07-10 | 33956 | |
29 |
![]() |
09-07-10 | 36712 | |
28 |
![]() |
09-07-10 | 34240 | |
27 |
![]() |
![]() |
09-07-10 | 40666 |
26 |
![]() |
![]() |
09-07-10 | 33966 |
25 |
![]() |
09-07-10 | 43206 | |
24 |
![]() |
09-07-10 | 42959 | |
23 |
![]() |
![]() |
09-07-10 | 29867 |
22 |
![]() |
![]() |
09-07-10 | 28830 |
21 |
![]() |
![]() |
09-07-09 | 47202 |
20 |
![]() |
![]() |
09-07-09 | 42694 |
19 |
![]() |
![]() |
09-07-09 | 37773 |
18 |
![]() |
09-07-09 | 30294 | |
17 |
![]() |
![]() |
09-07-09 | 29320 |
16 |
![]() |
![]() |
09-07-09 | 29650 |
15 |
![]() |
![]() |
09-07-09 | 28184 |
14 |
![]() |
![]() |
09-07-09 | 32654 |
13 |
![]() |
![]() |
09-07-09 | 40811 |
12 |
![]() |
![]() |
09-07-09 | 34961 |
11 |
![]() |
![]() |
09-07-09 | 33364 |
10 |
![]() |
![]() |
09-07-09 | 32991 |
09 |
![]() |
![]() |
09-07-09 | 36617 |