tinyMCE 에디터 XE에 적용하기

전부터 HABYeditor 라는 웹편집기를 사용해왔었다.
HABYeditor는 어느분이 htmlarea 를 변형하여 만들어 판매했었는데 개인용은 가격이 저렴해서 구입한 후 일부 수정하여 사용했었다. 그러나 IE9와 사파리 같은 브라우저에서 일부 호환이 되지 않는 문제가 발생하고, XE로 넘어오면서XE에 결합하는 방법을 알수가 없어서 그냥 단독 에디터로만 사용해왔다. 지금은 지원이 끊긴상태인거 같은데, 아무튼 이미지 다이알로그상자에서 곧바로 배경이미지를 넣은 테이블로 변형이 가능해서 웹메일 보낼때 배경있는 메일을 보내는데 즐겨 사용했었다.

HABYeditor 개발하신 분이 툴바라던가 다이알로그박스 부분을 잘 정리하셨던지 htmlarea에 비해 예쁘고 단정한것이 나름 훌륭한 에디터다. 어떤 면에서는 호환성도 좋다고 할수 있다. tinyMCE가 열리지 않는 ipad에서조차 HABYeditor는 열린다. 다만 별 효용성은 없지만...

사용하는 웹 에디터를 비교해 보면 대략 아래와 같다-순전히 내 개인적인 생각이지만...

HABYeditor - 디자인 예쁘고, 안정적인데 일부 웹브라우저 호환성 떨어짐. 다이알로그 등을 변형하기가 쉽다. 이미지브라우저가 DB를 이용하는데, 원하는 이미지만 공개할 수 있다. 설정이 어디가 잘못됐는지 삭제하면 DB에선 지워지는데 실제 파일은 남아있다.

CKEditor -  디자인이 둥글둥글하지만 그다지 좋아하는 스타일은 아님. CKFinder 이미지브라우저를 설정했더니 이미지 관리가 되는데 이미지 비공개를 설정할 수 없다는 단점이 있음. 나름 꼼수를 부려서 로그인 안한경우는 특정 폴더 이미지를 가져오도록 설정해서 비슷한 효과를 얻고 있음. 생각보다 잘 작동하지 않는 브라우저가 있음.

TinyMCE - 설정하느라 애먹었음. 내가 지식이 없어서지 생각보다 설정이 어렵지는 않은것 같음. 이미지 브라우저가 없어 처음에는CKFinder를 설정하려고 하다가 KCFinder 라는 무료 브라우저를 발견. 대박! 추후 XE의 기본 브라우저로 들어간다기에 TinyMCE + 수식편집기 + KCFinder + XE 조합을 고민함. 고민만.... TinyMCE 단독 설정 끝내고, 인터넷 찾다가 다른분이 XE에 결합한 내용을 보고 비슷한 구조면 되지 않을까 생각하여 폴더에 그대로 덮어씌워가며 최신버전을 넣어봤더니...되네...완전대박. 30분만에 우연히 XE와 TinyMCE 결합 성공. 구조는 같고 파일 2개정도면 변경하면 되는거 같음....와우...

-- 공통된 문제점 : 모두다 대충 유행하는 웹브라우저에서 열리지만 IPAD 안열림...이거만 되면 좋겠는데...IOS 업그레이드하면 될라나 고민 중...

-- 앞으로 할일 : TinyMCE 이모티콘 다양하게 하기, 이미지를 배경으로한 테이블 팝업 만들기

____ TinyMCE를 XE에 세팅하는 방법 _________________________________

1. TinyMCE 다운로드 (여기클릭)
2.  /XE폴더/modules/editor/skins/tinyMCE 폴더에 업로드(각 파일 위치 아래 참조)
   • tinyMCE 의 하위 폴더

     [폴더]editor	이 폴더안의 자료는 코드 수정한것 없음
     [폴더]images	이미지만 달랑 1개 있음. 수정할 거 없음
     [폴더]js	tinyMCE의 jscripts 폴더임
     	[폴더]tiny_mce
     		[폴더]langs	한글 언어파일 설치
     		[폴더]plugins	플러그인 모두 복사	수식편집 등 추가
     		[폴더]themes	테마 모두 복사	테마 내용 일부 변형
     		[폴더]utils	그대로 복사
     		license.txt tiny_mce.js tiny_mce_popup.js tiny_mce_src.js	이것도 그대로 복사
     	xe_interface.js	이것 편집
     editor.html	이거 편집해야 함
     skin.xml
     ※ KCFinder 는 별도로 설치하고 경로와 함수를 설정하면 가져오게 됨 ....

3. 각 파일의 편집 내용과 설정 방법은 생각이 날때마다 리플로 달립니다.