본문 바로가기

개발개발개발/프로그래밍과제

프로그래밍과제 - 웹페이지에 CK EDITOR 붙히기

웹페이지에 CK EDITOR 붙히기

게시판, 문서관리 프로그램에 필수적으로 들어가는것이 HTML 에디터, 이지윅 에디터이다.

 

그냥 TEXTAREA는 단순TEXT만 붙혀넣기가 가능하다. 

이지윅 에디터는 HTML페이지를 붙혀넣으면 그대로 복사되고, 저장된다.

 

CK EDITOR는 Javascript로 붙힐수 있어, 서버사이드 언어  JSP, ASP, PHP 모든 언어에서 가능하다.

 

프로그래밍 과제 

CK EDITOR를 Javascript로 INCLUDE 하여 에디터를 보이게하고,

저장버튼을 만들어, 에디터의 내용을 다음페이지로 보내서, HTML 변환 내용으로 출력하라.

게시판이나 DB에 저장하는것은 아직 필요없다.

 

에디터로 수정해서 넣으면, 바로 그 HTML 내용을 출력할수 있게 만들어야 한다.

게시판 반영없이, index.php 파일로만 넣어서 확인 가능하다. POST 값을 index.php가 받아서

<? echo htmlspecialchars($_POST['ekeditor_html']); ?>

 

 

 

CK에디터 붙히기 구현화면

 

 

CKEDITOR 공식 홈페이지 

 

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

 

 

CK에디터 공식홈페이지 다운로드




 

HTML 소스

 

 



<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>CKEditor</title>
<script src="https://cdn.ckeditor.com/4.12.1/standard/ckeditor.js"></script>
</head>
<body>
<textarea name="editor1"></textarea>
<script>
CKEDITOR.replace( 'editor1' );
</script>
</body>
</html>




<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>CKEditor</title>
<script src="https://cdn.ckeditor.com/4.12.1/standard/ckeditor.js"></script>
</head>
<body>
<textarea name="editor1"></textarea>
<script>
CKEDITOR.replace( 'editor1' );
</script>
</body>
</html>

 

 

 

 

 

 

 

 

 

 

 

 

https://dmswlvjvl.blog.me/221398455105

 

 

CK에디터 실제화면