setup/개발 관련2010. 4. 7. 14:51


#FCKeditor 설정하기 1-2
설정을 하는 방법에는 설치한 경로내에 있는 설정파일들을 직접 열어서 수정한다.
하지만 버전이 업데이트 되는 경우 그 때마다 설정파일을 새로 찾아 수정을 해야 하는 번거로움을 줄이고자
개인 설정 파일을 만들어서 설정 내용들을 별도로 관리하는 방법을 이용한다.

FCKeditor가 불러올 때 기본 설정을 먼저 불러온 후 개인 설정을 불러와서 해당 설정 부분만을 다시 변경하는
방법이다.


1. 개인 설정 파일을 만든다.
    개인 설정 파일 : myfckconfig.js (본인이 원하는 경로에 원하는 이름으로 만든다.)
    경로 : http://localhost/myfckconfig.js
    
     소스예>
     FCKConfig.AutoDetectLanguage = true ;
     FCKConfig.DefaultLanguage  = 'kr' ;

     FCKConfig.ToolbarSets["MyToolbar"] = [
           ['Cut','Copy','Paste','PasteText','PasteWord'],
           ['Undo','Redo','-','Bold','Italic','Underline','StrikeThrough'],
           '/',
           ['OrderedList','UnorderedList','-','Outdent','Indent'],
           ['Link','Unlink','Anchor'], 
           ['Style'],
           ['Table','Image','Flash','Rule','SpecialChar'],
           ['About']
           ] ;

      위 소스 내용처럼 본인이 원하는데로 설정할 수 있다.

      [언어 설정]
      FCKConfig.AutoDetectLanguage = true : 페이지에 설정된 언어로 자동설정(기본 true)
      FCKConfig.DefaultLanguage = 'kr' : 언어설정(기본 en)

      [툴바 설정]
      FCKConfig.ToolbarSets["MyToolbar"] = [생략]
       : MyToolbar 는 본인이 만든 설정 이름이며 내용에는 본인이 원하는 툴바들로 구성할 수 있다.

      [업로드 설정]
      var _FileBrowserLanguage = 'php' ;
      var _QuickUploadLanguage = 'php' ;

      * 기타 설정 참고
      [링크 브라우저 설정 : 기본 true]
      FCKConfig.LinkBrowser = true ;

      [이미지 브라우저 설정 : 기본 true]
      FCKConfig.ImageBrowser = true ;

      [플래시 브라우저 설정 : 기본 true]
      FCKConfig.LinkBrowser = true ;

      [링크 업로드 설정 : 기본 true]
      FCKConfig.LinkBrowser = true ;

      [이미지 설정 자세히 탭 설정 : 기본 true]
      FCKConfig.LinkBrowser = true ;

      [플래시 설정 자세히 탭 설정 : 기본 true]
      FCKConfig.LinkBrowser = true ;

2. 업로드 설정 : php
    /fckeditor/editor/filemanager/connectors/php/config.php 파일을 연 후 다음과 같이 수정한다.
    $Config['Enabled'] = true ;
    $Config['UserFilesPath'] = '/fck_upload/' ;     // 웹상 경로
    $Config['UserFilesAbsolutePath'] = $_SERVER["DOCUMENT_ROOT"].'/fck_upload/' ; 

3. 만들어 놓은 fckeditor를 사용할 fckeditor_load.php 파일에 다음 자바스크립트 소스를 삽입한다.
    소스예>
    <script type="text/javascript" src="/fckeditor/fckeditor.js"></script>
    <script type="text/javascript">
    <!--    
    window.onload=function()
    {
      var objFCK = new FCKeditor('FCKeditor1');

      objFCK.Config["CustomConfigurationsPath"] = "/myfckconfig.js?";     // 개인 설정 파일 경로
      objFCK.BasePath = "/fckeditor/";   // fckeditor 디렉터리 경로
      objFCK.Width = "70%";
      objFCK.Height = "50%";
      objFCK.value = "";
      objFCK.ToolbarSet = 'MyToolbar' ;    // fckeditor 툴바(개인 설정)
 
      var BasePath = '/fckeditor/';
      var Skin = 'office2003';                   // fckeditor 스킨 타입
      var SkinPath = BasePath + 'editor/skins/' + Skin + '/' ;

      objFCK.Config['SkinPath'] = SkinPath ;   // fckeditor 스킨 변경
      objFCK.ReplaceTextarea();
    }
    //-->
    </script>

    <textarea name="FCKeditor1"></textarea>

참고> 굵은글씨 부분은 본인의 설정에 맞춘다.
참고> http://docs.cksource.com/FCKeditor_2.x/Developers_Guide

4. 제대로 적용되었는지 확인을 한다.
    예>http://localhost/fckeditor_load.php : fckeditor_load.php(본인이 만든 파일)


이미지 아이콘을 눌러 이미지 팝업창을 띄운다.



찾아보기 버튼을 눌러 업로드 할 이미지를 선택한 후 서버로 전송 버튼을 누른다.
업로드 성공 메시지를 확인한다.



업로드 성공한 후 미리보기로 확인 및 추가적인 설정을 할 수 있다.



업로드 이미지가 삽입되었다.
참고> 업로드 관련 에러가 발생하는 경우는 설정부분 다시 한번 차근차근 되집어 본다.

Posted by 은둔고수