웹솔루션개발 22년 노하우! 해피CGI의 모든것

[해피CGI][cgimall] Responsive WYSIWYG Text Editor with jQuery and Bootstrap - LineControl Editor 본문

웹프로그램밍 자료실/JAVA 자료

[해피CGI][cgimall] Responsive WYSIWYG Text Editor with jQuery and Bootstrap - LineControl Editor

해피CGI윤실장 2019. 11. 6. 09:21
문서내의 텍스트 영역이나,
DIV 컨테이너 내에 WYSIWYG 리치 텍스트 편집기를 추가하는 jQuery 플러그인입니다.

장점은
- 반응형이고, 구현하기 쉽습니다.
- 최근 트랜드인 Bootstrap 3 스타일이며, Font Awesome 4 을 이용합니다.
- 에디터 내의 문자열에서 단어수를 세어서 표시해줍니다.


다운로드 받은 파일의 압축을 해제하면 생기는
demo.html 파일을 웹브라우저로 열어서 보면 확인이 가능합니다.



demo.html 파일의 소스코드를 열어서 보면
매우 심플하게 위지윅 에디터를 화면에 출력할수 있는 샘플입니다.


사용방법은

1. HTML문서에 jQuery 라이브러리 및 기타 필요한 리소스를 포함시켜줍니다.




2. jQuery 라이브러리 다은에 jQuery LineControl Editor 플러그인의 JavaScript 및 CSS를 포함시켜주세요.




3. 텍스트 편집기를위한 빈 컨테이너 요소를 작성해주세요.




4. 컨테이너 요소에서 플러그인을 호출해주세요.




대표적으로 많이 사용되는 위지윅에디터인 ckeditor 나 다른 에디터들에 비해서는
기능적으로는 약간 부족한 면이 없지 않아 있지만,
적용하기 쉽고, 간단하고, 가벼운 장점이 있네요.




홈페이지바로가기

Comments