editor
English시작하기

시작하기

5분 안에 글쓰기 창에 82editor를 붙이는 방법.

82editor는 의존성이 없는 순수 JavaScript 에디터입니다. 빌드 도구가 없는 PHP·JSP 게시판이라면 CDN 두 줄, npm을 쓰는 프로젝트라면 패키지 하나면 됩니다. 라이선스 키, 가입, 결제가 없습니다.

CDN으로 붙이기

가장 빠른 방법입니다. 기존 <textarea> 를 그대로 두고 에디터를 씌우면, 폼을 전송할 때 HTML이 textarea 값으로 함께 넘어갑니다.

<link rel="stylesheet" href="https://82editor.com/cdn/v1.0.0/82editor.css">
<script src="https://82editor.com/cdn/v1.0.0/82editor.min.js"></script>

<textarea id="content" name="content"></textarea>
<script>
  Editor82.createEditor('#content', { toolbar: 'board', height: 400 });
</script>

npm으로 설치하기

npm i @82editor/core
import { createEditor } from '@82editor/core';
import '@82editor/core/styles.css';

const editor = createEditor('#editor', {
  placeholder: '내용을 입력하세요',
  toolbar: 'board',
  height: 400,
});

editor.on('change', (html) => console.log(html));

내용 꺼내기와 넣기

const html = editor.getHTML();   // 저장할 HTML
editor.setHTML('<p>불러온 글</p>');
editor.getText();                // 글자만
editor.isEmpty();                // 빈 글인지

다음 단계