6.1 게시판 편집/보기필터

2009-07-09 19:37:55

6.1 게시판 편집/보기필터

1) 게시판 편집필터
2) 쉘 호출 구문
3) 게시판 상단 부분
4) 게시물 편집 폼 구성
5) 첨부파일 선택
6) 보기잠금장치
7) 비밀번호 입력부분
8) 이름입력 부분
9) 전자우편주소 및 홈페이지 입력부분
10) 자동답변 옵션 지정부분
11) 스크립트 실행 설정 부분
12) 공지게시물 설정 부분
13) 게시물 투표기능
14) 본문편집 부문
15) 파일 업로드
16) 가변 파일 업로드 영역
17) 마이폴더(내폴더) 브라우징
18) 보기필터 작성하기
19) 스타일 선언
20) 댓글표시 및 입력
21) 보기필터 메뉴부분
22) 자료파일 플러그인
23) 게시물 투표 진행/결과 보기

쎄지오는 자체적으로 게시판 기능을 제공합니다. 게시물의 목록보기, 게시물 편집하기, 게시물 읽기 등의 주요 기능에 대하여 자유롭게 웹화면을 구성하고 일반 HTML문서와도 편리하게 조합시킬 수 있습니다.

게시판은 게시물의 편집, 게시물읽기, 게시물 목록보기 등의 주요 기능에 대하여 각각 편집필터(editfilter), 보기필터(viewfilter), 목록필터(listfilter)가 웹화면을 구성합니다. 공용으로 사용할 수 있는 게시판 기본필터의 종류는 다음과 같습니다.

필터기능	기본필터	비고
편집필터	filter/post_edit.html
읽기필터	filter/post_view.html
목록필터	filter/post_list.html
인증필터	filter/auth_check.html

게시판에 따라서는 환경설정에서 전용필터를 지정할 수 있습니다. 전용필터를 지정하면 게시판은 "filter/" 이하의 "view/", "edit/", "list/" 디렉토리로부터 지정된 이름의 필터파일이 존재하면 작동하고 없는 경우 기본필터가 작동합니다.

예) filter 지정 : test

→ filter/edit/test.html 문서가 있는 경우 편집필터로 동작함

→ filter/list/test.html 문서가 있는 경우 목록필터로 동작함

→ filter/view/test.html 문서가 있는 경우 보기필터로 동작함

- 각 필터가 없는 경우 기본필터가 작동합니다.

- 게시판 환경설정에서 필터의 내용을 직접편집하여 입력할 수 있습니다.

게시판 필터는 알맹이 문서부분을 담당하며 호출 쉘을 상속받아 적용 될수 있습니다. 쎄지오 웹게시판 서비스의 일관성을 유지하기 위하여 게시판 필터에 다음과 같은 자바스크립트와 CSS 문서를 링크시켜야 합니다.

위의 두 파일은 쎄지오의 각종 관리기능의 화면구성에도 공통적으로 적용됩니다.

1) 게시판 편집필터

맨위로

편집필터는 게시물의 편집을 위한 화면구성을 담당합니다. 편집필터는 새 게시물 작성 및 기존 게시물의 편집을 위해서도 사용됩니다. 다음 그림은 편집화면의 예입니다.

그림에서 보는 바와 같이 게시물은 기본적으로 제목, 웹주소, 본문편집, 파일첨부 등의 영역으로 구성됩니다. 파일첨부는 PC에서 업로드하는 방법과 서버의 마련된 “내폴더”에서 파일을 선택할 수 있도록 제공할 수 있습니다.

가. PC에서 업로드하는 방법

①“찾아보기”를 클릭하고, ② 업로드할 이미지를 선택합니다.

③“+”버튼을 클릭 시 추가로 업로드할 수 있습니다.

나. “내폴더”에서 파일을 선택하여 업로드하는 방법

① “마이폴더(내폴더)”버튼을 클릭하면 “내폴더”창이 열립니다.

② 업로드할 이미지를 체크하면 이미지가 작성란에 추가됩니다. “닫기”버튼을 클릭하면“내폴더”창이 닫힙니다.

③ “완료하기”버튼을 클릭하면 게시글 작성이 완료됩니다.

"filter/post_edit.html"은 기본 편집필터로 알맹이 문서의 형식을 취하도록 설계됩니다. 다음은 배포판에 포함된 편집필터의 요약내용입니다.

<html>

<head>

... [게시물 편집관련 CSS 정의 구간]...

... [게시물 편집관련 자바스크립트 구간]...

</head>

<body>

$#shell#;

$#brd.head#;

... [게시물 기초정보 입력부분 ]...

... [게시물 본문 편집부분 ]...

... [첨부파일 옵션부분 ]...

$#brd.tail#;

</body></html>

다. 편집필터 CSS Style

게시판은 별도의 색상환경을 지정할 경우 레이아웃의 색상설정과 혼동되지 않아야 합니다. 알맹이문서 영역에서 필요한 CSS style 을 외부의 css 파일에 지정하여 색상설정이 적용되지 않을 수 있습니다. 편집필터 다음은 Style 지정 일부 보기입니다.

.brd, .brd input .brd div{ font-size:9pt;background:$#s.textbg#;; }

.brd .file {

width:98%;border:1px solid $#s.border#;;

padding:4 2 1 2px;background:$#s.textbg#;;color:$#s.text#;;

}

.brd .context{border:groove;width:100%;height:400;word-break:break-all;}

.brd .checkbox { height:15px;width:15px; }

.brd .cell4filecheck td { color:$#s.text#; }

.brd .cell4filecheck { border: inset 1px $#s.border#;;}

.brd .cell4name{

padding:4 3 2 10; background:$#s.namebg#;;border:outset 1px $#s.border#;;

color:$#s.name#;;width:15%;font-size:10pt;font-weight:bold;

}

.... 생략 ...

</style>

"/segio/segio.css" 파일은 일반 레이아웃에서 채택하는 기본 css 파일이며 모든 html 문서에서 참조하도록 하고 있습니다. "$#s.border#;"는 필터링 구문형식이므로 번역될 때 세미콜론(;)이 없어지게 됩니다. style 오류 때문에 웹브라우저에 정상적으로 표시되지 않는 경우가 있는데 파이어폭스 등과 같은 CSS 오류를 표시해주는 브라우저를 이용하여 검증이 필요합니다.

라. 편집필터 자바스크립트

게시판의 편집화면은 위지윅 HTML 을 편집할 수 있는 fck 에디터를 사용합니다. html 편집기를 호출하기위해서는 다음과 같은 자바스크립트를 설정해야 합니다.

$#if b.editor#;

<!--

var ImageWidthFit='$#b.widthfit#;';

window.0nload=function ()

{

editor_init('context');

}

-->

</script>

$#fi#;

게시판 환경설정에서 에디터부분의 스위치를 선택했다면 “$#if b.editor#;”구문이 참 값을 갖게되어 에디터를 호출하는 구문이 작동합니다. 본문편집을 위해 선언되는 <textarea> 태그는 name 과 id 속성이 “context"로 지정어 있어 "editor_init"함수의 변수와 대응됩니다.

2) 쉘 호출 구문

맨위로

게시판의 필터는 여러 게시판에서 공동으로 이용되기 때문에 지정 쉘을 지정하지 않도록 합니다. 환경설정에서 쉘 문서를 지정하면 지정 쉘로 작동됩니다. 환경설정에서의 쉘 지정 방식보다는 호출 쉘을 이용한 쉘 이어받기로 연계하는 것이 효과적입니다.

3) 게시판 상단 부분

맨위로

$#b.head#;구문은 상단부분에 해당되는 html문서가 필터링되어 표시됩니다. 게시판 상단부분은 각 로케이션의 환경설정과 게시판 환경설정에서 지정할 수 있습니다.

4) 게시물 편집 폼 구성

맨위로

게시물의 편집은 편집된 자료를 웹서버에 전송하여 저장하는 단계로 진행됩니다. 편집데이터를 서버에 전송하기 위해 다음과 같이 Form 구문을 구성해야 합니다.

...[데이터 입력 폼] ...

</form>

"action"은 편집화면의 URL과 동일하므로 생략합니다. "target"에 "$#i.zeroid#;"로 지정하면 웹서버는 HTML 문서에 자료 전송용 iframe을 추가로 생성합니다. 이는 자료전송용 iframe을 중복적으로 사용되는 것을 방지할 목적으로 도입되었습니다.

5) 첨부파일 선택

맨위로

기존 게시물을 편집할 경우 기존 게시물에 첨부된 자료파일에 대한 첨삭여부를 선택하도록 파일 선택구간을 다음과 같은 방법으로 구현할 수 있습니다.

$#if p.file#;

파일 선택: $#p.filecheck#;

$#fi#;

"$#if p.file#;" ~ "$#fi#;" 구간은 기존 게시물에 첨부파일이 있다면 작동됩니다. 다음은 이와 같은 구문의 결과로 보여지는 웹브라우저의 해당 영역입니다.

$#p.filecheck#; 구문은 체크박스와 파일이름 크기, 첨부된 시간 등을 표시하는데 정렬 표시를 위하여 바이너리의 실행에 의해 table구문으로 치환됩니다.

6) 보기잠금장치

맨위로

보기장금장치는 비밀번호 확인 후 게시물을 읽을 수 있도록 하는 기능입니다. 보기장금장치가 설정된 게시물은 목록에는 표현되지만 인증을 거치지 않으면 게시물을 읽을 수 없습니다. 게시물에 보기잠금장치를 설정하도록 다음과 같은 구문을 사용합니다.

$#if b.viewlock#; 보기잠금:

<input type="checkbox" name="viewlock" value="on" $#if p.viewlock#; checked $#fi#; />$#if#;

"$#b...#;", "$#p...#;"의 하위예약어인 "viewlock"은 다음과 같이 의미의 차이가 있습니다.

$#if b.viewlock#; → 게시판의 게시물에 보기잠금장치를 설치가 허용되었다면

$#if p.viewlock#; → 게시물에 보기잠금이 설정되었다면

게시판의 보기잠금장치를 설정하면 게시물을 편집할 때 보기잠금장치를 설정할 수 있습니다. 게시판의 보기잠금장치를 해제하더라도 기존 게시물에 설치된 보기잠금장치는 해제되지 않으며 편집모드에서는 게시판의 보기잠금장치를 선택할 수 있습니다.

7) 비밀번호 입력부분

맨위로

게시물을 작성한 사용자는 사용자ID를 검토하여 편집 및 삭제권한을 부여합니다. 손님의 경우 편집, 삭제, 보기등에 대하여 인증을 거쳐야 합니다.

$#if b.viewlock || u.lv<1#;

$#fi#;

$#if b.viewlock#;

<input type="checkbox" name="viewlock" value="on"

$#if p.viewlock#;checked="true"$#fi#; />

$#fi#;

필터의 조건문은 OR 연산자로 게시판에 뷰락이 설치되었거나 사용자 등급이 손님등급인 조건을 만족할 때 패스워드를 입력받도록 합니다.

8) 이름입력 부분

맨위로

게시판에 무명씨(NOBODY)옵션이 설정되었다면 작성자의 이름 및 ID가 기록되지 않습니다. 손님이 글을 쓰거나 무명씨옵션이 설정된 경우에는 다음과 같이 이름을 입력할 수 있도록 합니다.

$#if b.nobody || u.lv<1#;

$#fi#;

게시판 관리자가 등록자 이름을 지정하면 사용자 ID는 지정되지 않습니다.

#$if b.owner#; <input name="uname" value="$#p.uname#;" style="width:30px" />$#fi#;

게시판 관리자는 이 기능을 이용해서 개인이 아닌 기관이나 부서명의의 게시글을 등록할 수 있습니다.

9) 전자우편주소 및 홈페이지 입력부분

맨위로

게시물에 URL이 등록되었을 경우 목록에서 URL을 링크하도록 go2url이 선택되었거나 손님의 경우 전자우편주소와 홈페이지를 입력하도록 다음과 같이 구성합니다.

$#if b.go2url || u.lv<1#;

전자우편: <input name="email" value="$#p.email#;" /><br />

홈페이지: <input name="url" value="$#p.url#;" /><br />

$#fi#;

10) 자동답변 옵션 지정부분

맨위로

다음은 자동답변메일에 대한 옵션지정을 위한 예문입니다. 자동답변메일은 게시물에 답글을 달 경우 답글을 원 게시물에 등록된 전자우편주소로 발송해주는 기능입니다.

$#if b.remail#;자동답변메일:

<input type="checkbox" name="remail" value="on" $#if p.remail#; checked="true" $#fi#; />$#if#;

자동답변메일에 선택사항은 게시판과 게시물에서 각각 지정됩니다.

$#if b.remail#; → 게시물에 자동답변메일장치를 설치할 수 있도록 설정되었다면

편집화면에서는 게시물의 자동답변이 설치된 경우 참으로 작동함.

$#if p.remail#; → 게시물에 자동답변메일장치가 설치되었다면

자동답변메일은 답글을 작성자가 메일발송 권한이 있을 경우에만 작동합니다.

11) 스크립트 실행 설정 부분

맨위로

게시물 본문의 자바스크립트는 기본적으로 작동하지 않습니다. 게시물의 자바스크립트가 실행을 허용여부를 설정하도록 다음과 같은 구문을 사용합니다.

$#if b.script || b.owner#;스크립트:

$#if#;

게시판의 관리자이거나 게시판의 환경설정에서 스크립트 지원이 설정되어 있다면 게시물의 자바스크립트 지원여부를 결정할 수 있습니다.

$#if b.script#; → 게시판의 게시물에 스크립트 지원을 설정할 수 있도록 설정되었다면

편집화면에서는 게시물의 스크립트 지원이 설정된 경우 참으로 작동함.

$#if p.script#; → 게시물에 스크립트 지원이 설정되었다면

12) 공지게시물 설정 부분

맨위로

공지게시물은 게시판 목록에서 항상 상위에 굵은 글씨로 랭크되도록 하는 기능입니다. 다음은 공지게시물 설정부분에 대한 html 예문입니다.

$#if b.owner||b.notice#; Notice

$#fi#;

게시판에서 공지기능이 활성화 되었다면 모든 사용자가 그렇지 않다면 게시물 관리자만 게시물의 공지 옵션을 선택할 수 있습니다. "$#if p.notice#;"구문은 공지옵션이 선택되었는지의 여부를 표시하는데 기존 게시물의 편집을 위해서 사용됩니다.

$#if b.notice#; → 게시물에 공지게시글 설정할 수 있도록 설정되었다면

편집화면에서는 게시물의 공지게시글이 설정된 경우 참으로 작동함.

$#if p.notice#; → 게시물이 공지게시글로 설정되었다면

13) 게시물 투표기능

맨위로

게시판 환경설정에서 투표 기능이 지원되도록 하였을 경우 게시물 자체에 투표기능을 편집할 수 있도록 다음과 같은 구문을 작성합니다.

$#if b.owner||b.poll#;

<tr>

<input type="checkbox" class="checkbox" name="poll"

value="on" $#if p.poll#;checked="true"$#fi#; />

</td>

</tr>

$#fi#;

$#p.pollstr#;은 설문조사용 지문으로 세미콜론(;)으로 구분하여 10개 까지의 문항을 조합하여 입력하되 처음 영역은 예약구간으로 문항에서 제외됩니다.

14) 본문편집 부문

맨위로

편집필터는 새글 작성, 기존글 수정, 답변 작성 등의 목적으로 사용됩니다. 게시물을 수정하거나 원문을 인용하는 답변을 작성한다면 <textarea>에 초기화된 값이 표시되어야 합니다. 다음은 본문 편집부분의 요약내용입니다.

$#if p.pid && !p.id && b.blockquote#;

-------------------------------------------------<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#;는 공백으로 치환됩니다.

15) 파일 업로드

맨위로

PC에서 파일을 업로드할 수 있도록 제공되는 영역입니다. 게시물 당 최대 40개의 파일이 포함시킬 수 있는데 다음은 3개의 파일을 올리도록 구성한 예입니다.

$#if b.file#;

$#fi#;

"$#if b.file#;" ~ "$#fi#;" 구문으로 첨부파일을 환경설정에서 활성화되었을 때만 파일업로드 영역이 나타납니다. 다음 그림과 같이 파일업로드 영역이 표시됩니다.

※ 첨부파일을 환경설정에서 활성화하는 방법

가. 첨부파일이 활성화되기 전 상태

나. 첨부파일이 활성화된 상태

다. 첨부파일을 활성화하는 과정

① 게시판리스트페이지의 왼쪽 상단의 “환경”버튼을 클릭하면 “게시판환경설정”창이 새 창으로 열립니다.

② “게시판환경설정”창의 “선택사항"영역에서 ”파일첨부"를 체크한 후 “적용”버튼을 클릭하면 첨부파일이 활성화됩니다.

16) 가변 파일 업로드 영역

맨위로

필요에 따라서 파일 업로드 영역을 추가할 수 있도록 자바스크립트를 응용할 수 있습니다. 다음은 그 예제입니다. 지면상 내용을 요약하였습니다.

<!--

function set_filediv_input(){... } // div id에 input 필드 설정합니다.

function make_filediv(divs){ ... }// div를 생성합니다.

function show_filediv() {... } //div id를 기반으로 div에 input 필드를 설정합니다.

-->

</script>

... 생략 ...

make_filediv(20); // 20개까지의 div를 생성합니다.

--></script>

자바스크립트는 파일업로드를 위한 <input>구문을 20개까지 만들어 놓고 보이지 않도록 합니다. 추가적으로 수를 늘릴때마다 해당 파일선택영역이 보이게 합니다. 다음은 “+”버튼을 눌러 4개까지의 파일을 업로드 할 수 있도록 변형된 예입니다.

17) 마이폴더(내폴더) 브라우징

맨위로

마이폴더(내폴더)가 있는 사용자는 다음의 구문을 이용하여 마이폴더(내폴더)로부터 파일을 업로드할 수 있도록 하 수 있습니다.

$#if u.home.folder#;

</textarea>

<butt0n 0nClick="document.getElementById('onfile').value='';" class="mybutton">선택취소

</button>

$#fi#;

“$#if u.folder#;"구문은 마이폴더(내폴더) 소유자에게만 작동하도록 합니다. 다음은 파일 전송과 마이폴더(내폴더) 브라우징이 함께 표시된 예입니다.

사용자의 마이폴더(내폴더)는 웹메일이나 게시물에 첨부된 자료파일을 별도로 보관하기 위해 사용됩니다. 또한 자신의 PC로부터 특정파일을 마이폴더(내폴더)에 옮겨놓을 수 있습니다.

※ 자신의 PC로부터 특정파일을 마이폴더(내폴더)에 옮겨놓는 방법

가. 메인페이지의 오른쪽 상단에 있는 “관리도구”를 클릭하면 “쎄지오관리도구”창이 새 창으로 열립니다.

나. ①“웹문서관리”를 클릭한 후 ②“내폴더”를 클릭합니다.

③“찾아보기”를 클릭하고 ④첨부할 파일을 선택한 후 ⑤“열기”를 클릭합니다.

여러 개의 파일을 업로드하고자 할 경우에는

⑥“업로드”버튼을 클릭하면 다중업로드영역이 나타납니다. ⑦“찾아보기”버튼을 클릭하고 ⑧업로드할 이미지를 선택한 후 ⑨“열기”버튼을 클릭하면 업로드할 이미지가 추가됩니다.

⑩“보내기”버튼을 클릭하면 “내폴더”에 첨부파일이 업로드됩니다.

18) 보기필터 작성하기

맨위로

보기필터는 게시물을 읽을 때의 웹화면 구성을 담당합니다. 다음은 그림은 게시물 읽기의 예입니다.

다음 그림은 위와 같은 화면을 구성하는 보기필터를 요약한 내용입니다.

제목: $#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#;"구문을 이용하여 해당정보가 있을 경우에만 표시하도록 하고 있습니다.

19) 스타일 선언

맨위로

별도의 CSS 파일을 링크하여 사용하면 게시판 환경설정에 의한 색상이 작동하지 않을 수 있기 때문에 색상을 표시하는 "$#s.border#;"형식의 구문을 사용한 <style>구문이 포함되었습니다. 다음은 배포판에 포함된 CSS 스타일 선언의 일부 예입니다.

.s_icons { border:0; }

.table4list .cell4ltop, .table4list .cell4last,.table4list .cell4list{ font-size:9pt; }

.table4list a {text-decoration:none; }

.merge_top {;text-align:left;border-bottom:solid $#s.barrier; 1px#;margin-top:15px; }

.merge_top title{font-weight:bold;}

.merge_top info{font:$#s.rtext#;;text-align:#right;}

.pwords_top {

position:relative;background:$#s.listbg#;;

font-weight:bold;padding:3px;line-height:160%;

}

.pwords_date {position:absolute;width:200px;right:2px; }

.pwords_context {padding:2px 0 10px 0;}

.pwords_title { font-weight:bold;padding:2px 0 2px 0; }

.pollbar0{ background:#F00;border:solid #F00;border-width:2px 0;height:3px;}

.pollbar1{ background:#0F0;border:solid #0F0;border-width:2px 0;height:3px;}

.pollbar2{ background:#00F;border:solid #00F;border-width:2px 0;height:3px;}

.pollbar3{ background:#F0F;border:solid #F0F;border-width:2px 0;height:3px;}

...... 생략 ......

20) 댓글표시 및 입력

맨위로

댓글을 입력한 후 서버에 전송하는 단계로 진행되므로 POST 방법에 의해 댓글을 등록할 수 있도록 "<form>~</form>"구문을 설치하여야 합니다. 댓글은 입력한 사용자나 비밀번호를 인식하여 삭제할 수 있습니다.

$#p.words#;

$#if b.words#;

ㆍ 댓글달기:

$#if l.lv<1#; 이름:<input name="uname" value="" value="$#u.name#;" /> 비밀번호: <input name="passwd" type="password" /> $#fi#;

</form>

$#fi#;

"$#if b.words#;"구문은 게시판 환경설정에서 댓글달기가 지정되었을 때 참으로 작동됩니다. 0 등급의 손님 사용자는 이름과 비밀번호를 입력하도록 하고 있습니다.

21) 보기필터 메뉴부분

맨위로

게시물의 내용을 인쇄하거나 답변을 달거나 지우거나 수정등의 기능은 "$#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#;

<!--

_post_attached(PostFiles); // html/segio/segio.js 파일에 정의되어 있음.

-->

</script>

</td> </tr> $#fi#;

22) 자료파일 플러그인

맨위로

동영상, 플래시, 이미지 등의 자료파일이 있는 경우 웹상에서 자동으로 실행되어 보여지도록 되어 있습니다. 다음은 플러그인을 구현한 일부 예입니다.

<!--

_em_attached(PostFiles);

-->

</script>

</div>

다음 그림은 게시물에 첨부된 avi(wma) 파일을 자동으로 실행되는 모습을 보여줍니다.

23) 게시물 투표 진행/결과 보기

맨위로

게시판 환경설정에서 투표기능을 설정하면 게시물 편집창에서 게시물 투표에 필요한 투표 문항을 지정할 수 있습니다. 게시물 편집창에서 "투표"를 설정하면 해당 게시물에 투표기능을 사용하겠다는 것으로 간주됩니다. 그 다음 선택문항을 입력하는데 문항은 세미콜론(;)으로 구분되며 첫 번째 문항은 예약되어 선택문항으로 생성되지 않습니다.

게시물 투표가 진행하거나 게시물 투표의 결과를 보기 위하여 다음과 같은 구문을 사용합니다.

.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; }

</style>

....

</form>

style에 정의된 구문은 투표결과를 보여줄 막대 그래프 형식을 정하기 위해 사용됩니다. <form> 구문은 투표진행을 위해 사용합니다. 다음 그림은 투표진행 화면입니다.

다음 그림은 투표 결과 화면입니다.

※ 게시물에 투표기능 넣는 방법

① 게시판리스트페이지의 왼쪽 상단에 있는 “환경”버튼을 클릭하면 “게시판환경설정”이 새 창으로 열립니다.

② “선택사항”영역의 “투표”기능을 체크합니다. “적용”버튼을 클릭합니다.

③ “글쓰기”버튼을 클릭하면 게시물을 입력하는 페이지로 이동합니다.

④ 제목을 입력하고, 투표기능의 체크박스에 체크합니다. 투표할 리스트는 “;”로 구분합니다. “완료하기”버튼을 클릭합니다.

투표가 진행된 결과는 특수한 목적의 첨언으로 나타나게 됩니다. 한건이라도 투표가 진행이 되면 게시물 편집을 통한 문항변경이 물가능합니다. 투표진행로그를 위한 첨언은 인트라셀 관리자에게만 보여지며 관리자는 투표진행로그를 확인하거나 지울수만 있습니다. 투표진행로그 첨언을 삭제하면 투표결과는 초기화되며 게시물 편집을 통한 문항변경이 가능합니다.

댓글달기

쎄지오 매뉴얼 게시판의 게시물 목록
번호	글제목	작성자	일시	조회
61	10.4 CMS개요	케이시크	09-07-21	149878
60	4.5 환경설정	케이시크	09-07-17	185595
59	6.8 게시판자동생성 [3]	관리자	09-07-14	186892
58	6.7 게시판아이콘	관리자	09-07-14	186576
57	6.6 게시판환경설정	관리자	09-07-14	185902
56	6.5 게시판관리	관리자	09-07-14	169290
55	3.7 환경 설정	관리자	09-07-14	202831
54	3.6 웹메일 필터	관리자	09-07-14	206556
53	8.7 사용자관리	관리자	09-07-13	185525
52	10.3 플래시쇼 관리	sysop	09-07-10	194305
51	10.3 플래시쇼 개요	sysop	09-07-10	192552
50	10.2 메뉴관리	sysop	09-07-10	169663
49	10.1 프론트페이지	sysop	09-07-10	193086
48	9.4 업무용 메신저	sysop	09-07-10	463534
47	9.3 명함관리	sysop	09-07-10	197984
46	9.2 업무진행	sysop	09-07-10	190113
45	9.1 전자결재	sysop	09-07-10	202841
44	9.2 시스템구성	sysop	09-07-10	186093
43	9.1 전자결재개요	sysop	09-07-10	181912
42	8.6 자바환경설정	sysop	09-07-10	190698
41	8.5 웹게시판	sysop	09-07-10	180212
40	8.4 웹쪽지	sysop	09-07-10	187436
39	8.3 웹메신저	sysop	09-07-10	379048
38	8.2 웹메일 서비스	sysop	09-07-10	258199
37	8.1 사용자 웹서비스	sysop	09-07-10	208968
36	7.8 커뮤니티 게시판관리	sysop	09-07-10	204615
35	7.7 커뮤니티 회원관리	sysop	09-07-10	210981
34	7.6 사용자 환경설정	sysop	09-07-10	209476
33	7.5 동호회 연결하기	sysop	09-07-10	712807
32	7.4 신규동호회 개설	sysop	09-07-10	216777
31	7.3 커뮤니티 관리도구	sysop	09-07-10	218840
30	7.2 동호회, 사용자 홈페이지 로그인	sysop	09-07-10	199953
29	7.1 커뮤니티 개요	sysop	09-07-10	192891
28	6.3 게시판 관리와 응용	sysop	09-07-09	207469
27	6.2 게시판 스타일	sysop	09-07-09	198621
26	6.1 게시판 목록/인증필터	sysop	09-07-09	340753
25	6.1 게시판 편집/보기필터	sysop	09-07-09	198360
24	5.4 확장개발-JSP	sysop	09-07-09	198092
23	5.3 확장개발-사용자 관리	sysop	09-07-09	198871
22	5.2 확장개발-PHP	sysop	09-07-09	179134
21	5.1 확장개발-CGI 바이너리	sysop	09-07-09	275008
20	4.4사용기록보기	sysop	09-07-09	185657
19	4.3 사용자관리	sysop	09-07-09	198605
18	4.2 로그인 및 관리도구 [1]	sysop	09-07-09	207697
17	4.1 인트라셀이란	sysop	09-07-09	1243093
16	3.5 스팸메일 설정	sysop	09-07-09	600042
15	3.4 웹메일 사용자 기능	sysop	09-07-09	229560
14	3.3 웹메일 구성	sysop	09-07-09	232443
13	3.2 웹메일 환경설정	sysop	09-07-09	554316
12	3.1 웹메일 개요	sysop	09-07-09	222217
11	2.6 기초필터파일	sysop	09-07-09	395397
10	2.5 웹편집기	sysop	09-07-09	197369
09	2.4 웹 디렉토리	sysop	09-07-09	223736
08	2.3 웹 레이아웃	sysop	09-07-09	249614
07	2.2 웹필터링	sysop	09-07-09	330863
06	2.1 쎄지오 웹자원	sysop	09-07-09	334307
05	1.5 쎄지오 관리	sysop	09-07-09	222077
04	1.4 처음 로그인 하기	sysop	09-07-09	230652
03	1.3 쎄지오 설치 2	sysop	09-07-09	440249
02	1.2 쎄지오 설치	sysop	09-07-09	813489
01	1.1 intro	sysop	09-07-09	190715