이 데모에서 해볼 수 있는 것
- Inline: 편집하는 동안에만 툴바가 나타나고, 페이지 레이아웃 안에 그대로 놓입니다.
- Iframe: 편집 영역이 별도 프레임에서 돌아 페이지 스타일의 영향을 받지 않습니다.
- Document: 워드프로세서처럼 종이 크기의 문서로 보여 줍니다.
- Preview: 편집 도구 없이 사용자가 볼 모습 그대로 보여 줍니다.
이렇게 해봅니다
- 1에디터 위의 모드 버튼을 누르세요.
- 2같은 문서가 모드마다 어떻게 달라지는지 비교해 보세요.
- 3에디터 아래 설정 코드를 내 프로젝트에 그대로 옮겨 쓰세요.
실제 에디터입니다. 아무 곳이나 눌러 바로 편집해 보세요
에디터 모드편집하는 동안에만 툴바가 나옵니다. 문서 안을 눌러 보세요.
이 모드의 설정
const editor = new SynapEditor('editor', {
"editor.type": "inline"
}, html);