웹모아
웹모아[손님] 검색   로그인 / 회원가입    


 
php와 웹서버
 


FCK 에디터 설치, 그리고 기본 설정 (FCK Editor)
  2013-12-14 19:15:51 댓글:(0)   조회:2163





FCK Editor v2.4.3

 

복사만으로 간단하게 설치가 되지만, 그대로는 사용할 수가 없다.

설치후에 기본적으로 설정해야 하는 것들을 정리해 본다.

 

 ※다운로드는 로그인하셔야 가능합니다.
 

FCKeditor_2 [ 0 ]     [ FCKeditor_2.6.4.1.zip ]   1410169 Byte   

FCKeditor_2.6.4.1.zip 

 

  

 

1. 환경 설정하기

fckeditor/fckconfig.js 파일에 필요한 대부분의 필요한 환경 설정을 할 수 있다.

먼저 기본으로 설정해야 할 환경에 대해서 알아본다.

 

서버스크립트별로 주석으로 표시되어 있는 부분을 해제 시켜준다.

FCKConfig.ProtectedSource.Add( /<%[\s\S]*?%>/g ) ; // ASP style server side code <%...%>

 

기본언어를 한글로 바꿔준다.

FCKConfig.DefaultLanguage  = 'kr' ;

 

편집중 엔터 또는 쉬프트+엔터에 대한 사입할 태그를 선택한다.

FCKConfig.EnterMode = 'div' ;   // p | div | br
FCKConfig.ShiftEnterMode = 'br' ; // p | div | br


링크 서버 보기 기능을 없애준다. 서버보기를 통해 불필요한 파일에 대한 업로드 방지와 보안의 일환으로 없애는 것이 좋다.

FCKConfig.LinkBrowser = false ;


이미지 서버 보기 기능을 없애준다.

FCKConfig.ImageBrowser = false ;


플래시 서버 보기 기능을 없애준다.

FCKConfig.FlashBrowser = false ;


여기까지는 보통 새 버전이 나올때마다 또는 새로 설치할 때마다 반드시 확인해줘야 하는 사항이다.

두번째로 종종 사용되는 기능에 대해 알아본다.

 

이모티콘을 추가해보자. 자신만의 이모티콘이 있다면 별도의 폴더에 저장하고 경로를 설정해준 다음 각각의 파일명을 등록하면 된다.

FCKConfig.SmileyPath = FCKConfig.BasePath + 'images/smiley/msn/' ;
FCKConfig.SmileyImages = ['regular_smile.gif','sad_smile.gif','wink_smile.gif','teeth_smile.gif','confused_smile.gif',

'tounge_smile.gif','embaressed_smile.gif','omg_smile.gif','whatchutalkingabout_smile.gif',

'angry_smile.gif','angel_smile.gif','shades_smile.gif','devil_smile.gif','cry_smile.gif','lightbulb.gif',

'thumbs_down.gif','thumbs_up.gif','heart.gif','broken_heart.gif','kiss.gif','envelope.gif'] ;


툴바를 내맘데로 바꿔보자.

FCKConfig.ToolbarSets["MyToolbar"] = [
 ['Bold','Italic','Underline','StrikeThrough','-','Subscript','Superscript'],
 ['OrderedList','UnorderedList','-','Outdent','Indent'],
 ['JustifyLeft','JustifyCenter','JustifyRight','JustifyFull'],
 ['Link','Unlink','Anchor'],['Image']
] ;
이렇게 별도로 추가한 다음에 fckeditor를 생성하는 스크립트에서는 아래처럼 지정해 주면 된다.

Dim oFCKeditor
Set oFCKeditor = New FCKeditor
oFCKeditor.ToolbarSet = "MyToolbar"
oFCKeditor.BasePath = "/fckeditor/"
oFCKeditor.Value = ""
oFCKeditor.Height = 400
oFCKeditor.Width = 780
oFCKeditor.Create "content"

2. 용량이 큰 이미지를 업로드 하기 위하여 설정할 사항

가끔 이미지가 크다 싶으면 업로드가 안되는 경우가 있다. 이것은 서버의 설정 문제이다.

아래 포스트에 자세한 내용이 있다.

http://blog.naver.com/neofanta.do?Redirect=Log&logNo=120039036389

 

3. 한글로된 이미지파일명을 제대로 업로드하고 보여주기

한글이 섞인 파일명으로된 이미지를 업로드하면 업로드는 되는데 표시가 안되고 엑스박스가 나오게 된다. 페이지 케릭터셋을 변경해주어 해결할 수 있다. 아래 굵은 글씨로 되어있는 부분을 추가한다.

 

fckeditor/editor/filemanager/upload/asp/upload.asp

<%@ CodePage=65001 Language="VBScript"%>
<%
Option Explicit
Response.Buffer = True
Response.CharSet = "UTF-8"


 

4. 이미지 업로드 경로를 변경하기

fckeditor/editor/filemanager/upload/asp/config.asp 파일에서 아래의 내용을 변경하면 원하는 곳에 저장할 수 있다.

ConfigUserFilesPath = "/files/fck/"


 

5. 이미지 주소 형태 변경하기

이미지를 업로드하게 되면 주소가 /files/fck/image.gif 처럼 전체 경로로 되어있지 않아서 사이트 내에서는 아무런 오류가 없지만, 만약 입력된 내용으로 이메일이라도 보내게 되면 이미지가 하나도 나오지 않게 된다.

이미지 태그가 아래처럼 만들어지기 때문이다.

< img src="/files/fck/image.gif" >


그렇기 때문에 이미지가 어느 서버에 있는지 알수가 없어서 엑스박스로 나오게 된다. 이것은 이미지를 입력할때 해당 이미지의 전체 주소의 형태로 태그가 만들어지면 해결될수 있는 문제이다.

아래의 포스트에 자세한 내용이 있다.

http://blog.naver.com/neofanta.do?Redirect=Log&logNo=120045457520


6. 편집기 안의 툴바에서 폰트목록에 굴림, 돋움체 추가하기

/fckeditor/fckconfig.js 파일을 열자.

아래 내용으로 변경하고 더 원하는 폰트가 있으면 추가한다.

FCKConfig.FontNames  = '굴림;굴림체;돋움;돋움체;Arial;Comic Sans MS;Courier New;Tahoma;Times New Roman;Verdana' ;

 

위처럼 추가를 해도 처음 편집기안에 커서가 위치하게 되면 기본 폰트가 굴림이 아니라 Arial로 되어있다. 매번 변경할 필요 없이 스타일 파일의 기본 폰트를 변경하여 매번 폰트를 바꿔줘야 하는 불편함을 없앨 수 있다.

/fckeditor/editor/css/fck_editorarea.css

body, td
{
 font-family: Gulim, Arial, Verdana, Sans-Serif;
 font-size: 12px;
}




 댓글 (0)


php와 웹서버
페이지: 1 / 1   


   서브 도메인설정 팁3
   mod_rewrite 로 유저사이트를 서브도메인으로3
   서브도메인 자동셋팅 Rewrite(리눅스 BIND,2650
   HTML에서 한글이 깨진다1226
   html문서에 한글 인코딩 지정 방법1546
   PHP 한글 깨짐현상 해결하기(html, mysql2430
   CKEDITOR 설치 및 설정5108
   FCKeditor 설치법 정리15975
   브라우저 기반의 위지윅(WYSIWYG) 에디터(ED3001
     FCKeditor Version 2.1 간단설치2071
    FCK 에디터 설치, 그리고 기본 설정 (FCK E2164
   Tinymce 설치3596
   php-mysql 한글 깨짐 현상2567
   iis 서비스 설치3204
   윈도우용 mysql사용을 위한 환경설정3237
   윈도우용 mySql5 설치와 설정 13293
   제1강 php의 개념과 웹상에 게시된 php에 대한3256
   아파치의 httpd.conf 환경 설정3227
   윈도우용 php 5 설치3501
   아파치(Apache) 웹서버 설치3410
   php와 웹 강좌 - 초급부터 간단한 방명록을 작3296
≪ [1]   ≫

복수단어 검색은 공백(space)로 구분해 주세요.



 
최근 글
[손님]
9
10
156
163
322
515
1287
471
543
299
459
4057
977
1083
1326
 
인기 글
[손님]
6712
[자나가다] (3) 자유게시판이라...
5459
[김준수] (1) 모의고사 풀이
8200
7755
4861
5980
21301
5301
5707
5158
5736
4839
19433
[홈마스타] [RE] input type=\\
6798
6250