컴퓨터

그누보드에 Jodit Pro (유료) 에디터 설치하기 #1

컨텐츠 정보

본문

시중에는 게시판에 장착가능한 다양한 위지윅 에디터들이 있습니다.

대표적인 에디터 들의 장단점을 제가 느낀대로 대충 나열하자면..


1. Froala (유료/무료) 



JQuery 기반의 에디터로서 미려한 디자인과 다양한 기능들이 있으며, 많은 이용층을 확보하고 있는 에디터 입니다. 

유료는 상당히 비싼 편에 속하며, React, Vue 도 지원합니다.

무료는 워터마크가 있으며 크게 거슬리지 않는 편입니다.

드레그앤드롭으로 파일 및 동영상 업로드도 가능하며, 다양한 플러그인이 존재합니다.

다만, 디자인 및 온라인 협업 측면에서는 강력하다 할 수 있지만, 각종 소스 정보를 작성하고 소스를 작성해야하는 본 블로그 입장에서는 그다지 기능이 부족한 편이라 테스트만 하고 실 사용은 하지 않았습니다.


2. ckeditor5


가장 보편화 되어 있는 에디터 이며, 무료버전도 거의 기능제한 없이 사용가능하며, 유료버전은 제법 설치가 쉽고 강력한 확장성을 제공합니다. 다만, 유료버전의 경우 매월 $37 라는 비용을 지출해야한다는 부담감이 있습니다.

월사용료를 꾸준히 내야한다는 점도 맘에 안들고 입맛에 맞게 다양하게 수정하고 소스 작성을 해야하는 본 블로그와는 다소 맞지 않는다는 판단하에 패스~


3. Jodit 



Javascript와 TS 기반의 에디터 이며, 소스 입력기와 드래그앤드롭 업로드가 가능하여, 소스 작성을 해야하는 본 블로그와 잘 맞는 에디터로 판단되어 본 게시판도 Jodit 에디터로 작성되었습니다.

V.3대 무료버전과 V.1.2 대의 PRO 버전(가격:$99)이 존재하며,  무제한급에 해당하는 OEM 버전(가격:$399)이 있습니다.

타 에디터들은 소스도 안주면서 비싼 월/년 사용료를 받고 서비스 하는 곳들이 많은데, Jodit은 한번 결제하면 소스까지 몽땅 줍니다.

node.js 용 패키지 소스까지 모두 포함되어 있습니다.


그래서, 큰맘먹고 399$에 OEM 버전으로 질렀습니다.

프로버전도 좋지만 프로버전은 1도메인만 가능했고 OEM은 무제한 도메인 사용이 가능하다는 점 때문에 소주값 아끼면 된다는 생각으로 OEM으로 구매하였습니다.


그러나, 산넘어 산.. 다음 문제들이 저를 가로 막고 있었습니다.

  1. 다운로드 받은 소스를 어떻게 그누보드에 커스트 마이징할 것인가?
  2. 소스 입력기에 하이라이트 적용과 라인번호 적용이 가능한 것인가?  (기본적으로 작성화면은 하이라이트가 적용되어 있지만, 게시판 View 페이지 관련해서는 하이라이트와 라인번호 구현에 관한 방법 또는 도움말이나 예제 소스가 없음)
  3. 패키지에 포함되어 있는 PC/모바일 겸용 이미지 브라우저인 "Jodit Finder" 가 과연 본 블로그에 필요한 기능인가?
  4. 추가적인 기능구현을 위한 소스 수정은 쉬운가?
  5. 충분한 Document 는 존재한가?


참고적으로 그누보드 무료버전 설치에 관한 글은 아래 링크를 참조하시기 바랍니다.


[ Jodit 무료버전 설치 방법 ] 바로가기


그럼, 유료버전 설치 및 설정에 대해 하나하나 문제를 해결해 나가야 겠지요?


첫째, 그누보드(sir.kr)에 커스트마이징을 어떻게 할 것인가?


jodit을 구매 후 아래처럼 홈페이지(https://xdsoft.net/jodit/)에  로그인을 한 후, 이미지 1번 위치에 있는 사용자 -> account (Dash board) 로 이동 후  2번 위치에 있는 "Jodit OEM License" 링크를 누릅니다.



그 다음 화면은 다운로드 가능한 버튼 링크와 도메인 등록을 위한 버튼 링크(MANAGE)가 존재하니 도메인들을 등록하고 다운로드 받으면 됩니다.

도메인 등록시 생성되는 License 코드는 복사하여 나중에 소스 설치시 소스 내에 붙여넣기 해야합니다.


 


다운로드 받은 zip 파일은 압축해제 후 웹서버 그누보드 설치 루트 폴더에 "editor"라는 폴더를 만들어 업로드 하였습니다.

먼저 해야할 사항은 editor 폴더 내에 있는 "config.js"  파일을 엽니다.

Jodit.defaultOptions.license = '4911J-3D7G9-A`5NL-L8CFZ'; <== 도메인 등록시 생성된 코드 값 붙여넣기

Jodit.defaultOptions.language = 'ko'; <== 에디터 메뉴 및 툴버튼 한글지원으로 변경
Jodit.defaultOptions.extraPlugins = [
....... <== 에디터 상단 기능 부여 설정
];
Jodit.defaultOptions.disablePlugins = []; <== 에디터 상단 기능 제외 설정

 

Jodit.defaultOptions.license 값은 임의로 작성하거나, 도메인 등록시 생성된 값과 틀릴 경우, 무료버전처럼 하단에 워터마크가 생성되며, 무료사용기간 카운트다운에 들어가게 됩니다.


이상으로 기본적인 설치에 관한 사항까지 진행하였습니다.

다음 화에서는 그누보드 커스트 마이징에 관한 부분을 진행하도록 하겠습니다.

내용이 길어 여러 개로 나눠 작성하게 된 점 양해 바랍니다.




관련자료

댓글 0
등록된 댓글이 없습니다.
Total 5 / 1 Page
번호
제목
이름

최근글


새댓글


알림 0