:: 거니네 ver 1.1 ::: FCKeditor 2.4 설정 입문

FCKeditor 2.4 설정에 대하여 정리를 좀 해봤습니다.

FCKeditor 은 파워풀한 위지윅 에디터로서 파일 업로드 기능까지 내장되여 있다.
FCKeditor 설치법 및 java 웹 어플리케이션하고의 연동사항은 예전에 올린 글속에 포함이 되여있으므로 생략하겠다.

1. 불필요한 폴더 및 파일들을 삭제하여 용량을 확보한다.

삭제해야 할 파일 및 폴더 리스트

_samples
_testcases
_documentation.html
_upgrade.html
_whatsnew.html
fckeditor.asp
fckeditor.pl
fckeditor.afp
fckeditor.cfc
fckeditor.cfm
fckeditor.lasso
fckeditor.php
fckeditor.py
fckeditor_php4.php
fckeditor_php5.php
license.txt
htaccess.txt

2. fckconfig.js설정파일에 대한 수정

// 자동으로 클라이언트측 언어 설정을 탐지하여 FCKeditor 언어모드를 설정해준다.
FCKConfig.AutoDetectLanguage = true ;

// 기본 언어모드를 설정해준다. en이면 영문모드이다.
FCKConfig.DefaultLanguage = 'en' ;

// 스킨 설정
FCKConfig.SkinPath = FCKConfig.BasePath + 'skins/default/' ;

// 툴바가 로딩될때 펼침상태로 보여질 여부를 설정
FCKConfig.ToolbarStartExpanded = true ;

// 새로운 폰트를 첨가할수 있다.
FCKConfig.FontNames = 'Arial;Comic Sans MS;Courier New;Tahoma;Times New Roman;Verdana' ;

편집기에 입력되는 기본 글자 크기는 설정파일이 아닌 CSS파일에서 설정해주어야 한다.
FCKeditor\editor\css\fck_editorarea.css를 열어서 아래와 같이 바꿔주면 된다.
body, td
{
font-family: Arial, Verdana, Sans-Serif;
font-size: 14px;
}

3. 툴바 요소들에 대한 설정

에디터가 로딩될때 만약 특정된 툴바셋을 지정하지 않으면 기본적으로 세팅된 툴바가 로딩된다.
FCKConfig.ToolbarSets["Default"] 이 배열에 나열된 하나하나의 개체들은 매 하나의 툴과 1:1 매칭이 되여진다. 사용자는 자신의 입맛에 맞게 툴바에 나열될 툴들을 커스터마이징 할수 있다.

4. 문자 스타일에 대한 설정

자주쓰는 문자열에 대한 스타일은 미리 정의하여 쓸수 있다. 이런 정의는 XML파일에 설정할수 있다. FCKeditor루트에 보면 fckstyles.xml 파일이 존재하는데 이것이 바로 스타일 설정파일이다.

fckstyles.xml 파일 보기...

5. 템플릿에 대한 설정

템플릿에 대한 정의는 fcktemplates.xml에서 할수 있다. fcktemplates.xml파일 경로는 fckconfig.js 에서 설정해줄수 있다.
FCKConfig.TemplatesXmlPath = '/mytemplates.xml' ;

more..

<?xml version="1.0" encoding="utf-8" ?>

<Templates imagesBasePath="fck_template/images/">
<Template title="Image and Title" image="template1.gif">
<Description>One main image with a title and text that surround the image.</Description>
<Html>
<![CDATA[
<img style="MARGIN-RIGHT: 10px" height="100" alt="" width="100" align="left"/>
<h3>Type the title here</h3>
Type the text here
]]>
</Html>
</Template>
<Template title="Strange Template" image="template2.gif">
<Description>A template that defines two colums, each one with a title, and some text.</Description>
<Html>
<![CDATA[
<table cellspacing="0" cellpadding="0" width="100%" border="0">
<tbody>
<tr>
<td width="50%">
<h3>Title 1</h3>
</td>
<td>          </td>
<td width="50%">
<h3>Title 2</h3>
</td>
</tr>
<tr>
<td>Text 1</td>
<td> </td>
<td>Text 2</td>
</tr>
</tbody>
</table>
More text goes here.
]]>
</Html>
</Template>
<Template title="Text and Table" image="template3.gif">
<Description>A title with some text and a table.</Description>
<Html>
<![CDATA[
<table align="left" width="80%" border="0" cellspacing="0" cellpadding="0"><tr><td>
<h3>Title goes here</h3>
<p>
<table style="FLOAT: right" cellspacing="0" cellpadding="0" width="150" border="1">
<tbody>
<tr>
<td align="center" colspan="3"><strong>Table title</strong></td>
</tr>
<tr>
<td> </td>
<td> </td>
<td> </td>
</tr>
<tr>
<td> </td>
<td> </td>
<td> </td>
</tr>
<tr>
<td> </td>
<td> </td>
<td> </td>
</tr>
<tr>
<td> </td>
<td> </td>
<td> </td>
</tr>
</tbody>
</table>
Type the text here</p>
</td></tr></table>
]]>
</Html>
</Template>
</Templates>

:: 거니네 ver 1.1 ::

2007년 2월 28일 수요일

FCKeditor 2.4 설정 입문

댓글 없음:

댓글 쓰기