CKEditor ( 웹에디터 / 위지위그 리치 텍스트 에디터 / HTML 편집기 )

CKEditor ( 웹에디터 / 위지위그 리치 텍스트 에디터 / HTML 편집기 )

CKEditor ( CK에디터 )

홈페이지 : https://ckeditor.com/

나도 처음 써본다.

일단, 위 홈페이지 접속후에 하단에 보면 CKEditor 5와 CKEditor 4 가 있다.

위키백과에 CKEditor 을 검색해보면 아래와 같은 내용이 적혀 있다.

[CKEditor 4]

CKEditor 4는 구글 크롬, 모질라 파이어폭스, 사파리, 마이크로소프트 엣지, 오페라, 인터넷 익스플로러 10과 11의 최신 안정판을 포함한 대부분의 인터넷 브라우저와 완전히 호환된다. 모바일 환경에서는 사파리(iOS6 이상)와 크롬(안드로이드)와 대체적으로 호환된다.

[CKEditor 5]

CKEditor 5는 구글 크롬, 파이어폭스, 사파리, 오페라, 마이크로소프트 엣지와도 호환된다. 그러나 인터넷 익스플로러 11은 아직 지원하지 않는다.

출처 : https://ko.wikipedia.org/wiki/CKEditor

CKEditor ( CK에디터 ) - 선택

파일을 다운받아서 사용할 수도 있지만, 처음이니 간단하게 맛보기를 해보자.

아래 링크를 통하면 CKEditor CDN 이라는 것이 있다.

CKEditor 4 : https://ckeditor.com/ckeditor-4/download/

CKEditor CDN

CKEditor CDN comes with SSL support and provides over 50 edge locations on 6 continents around the world.

총 세가지 버전이 있다.

Basic Package

<script src="//cdn.ckeditor.com/4.9.2/basic/ckeditor.js"></script>

Standard Package

<script src="//cdn.ckeditor.com/4.9.2/standard/ckeditor.js"></script>

Full Package

<script src="//cdn.ckeditor.com/4.9.2/full/ckeditor.js"></script>

CKEditor ( CK에디터 ) - 적용

<form>
     <textarea name="editor1" id="editor1" rows="10" cols="80">
             This is my textarea to be replaced with CKEditor.
     </textarea>
     <script>
             // Replace the <textarea id="editor1"> with a CKEditor
             // instance, using default configuration.
             CKEDITOR.replace( 'editor1' );
     </script>
</form>

소스코드 복사해서 붙여넣기하면 끝이다. 끝~!