K 웹에디터 기능 및 특징

글쓰기에 필요한 모든 도구를
하나의 에디터에 담았습니다

K 웹에디터는 서식, 이미지, 표, 동영상, 코드까지 다루는 WYSIWYG 웹에디터입니다. 웹 접근성 검증과 AI 작성, 자동저장, 안전한 저장 처리까지 갖춰 홈페이지와 서비스의 글쓰기 환경을 한 단계 높여 드립니다.

도입 문의하기 솔루션 소개 전화 1644-2646

• "/" 입력으로
  블록 메뉴
• 웹 접근성
  자동 검증
• 8개 언어
  화면 지원
• 자동저장
  내용 복원

핵심 기능

• 쓰는 대로 보이는 편집 (WYSIWYG)제목, 글꼴, 글자 크기, 굵게·기울임·밑줄·취소선, 위·아래 첨자, 글자색·배경색, 정렬, 줄 간격, 번호·글머리 목록, 들여쓰기·내어쓰기까지 익숙한 도구로 HTML 지식 없이도 글을 꾸밀 수 있습니다.
  본문에서 "/"를 입력하면 블록 메뉴가 열려 필요한 요소를 바로 넣을 수 있습니다.
• 웹 접근성 검증툴바의 접근성 검증 버튼으로 대체 텍스트, 제목, 링크, 표, 명도 대비를 점검할 수 있습니다.
  결과 항목을 누르면 본문의 해당 위치로 이동해 바로 고칠 수 있어, 웹접근성을 지키는 글쓰기가 쉬워집니다.
• 이미지 · 동영상 삽입이미지를 드래그하거나 클릭해 여러 장을 한 번에 올릴 수 있고(JPG, PNG, GIF, WebP), 대체 텍스트·캡션·링크를 지정하며 드래그로 순서를 바꿀 수 있습니다.
  본문 이미지를 더블클릭해 다시 편집할 수 있고, YouTube·Vimeo 동영상 주소로 동영상을 삽입할 수 있습니다.
• AI 작성 도우미툴바의 AI 버튼으로 작성할 내용을 입력하면 서버의 AI 연동을 통해 글을 만들어 본문에 넣을 수 있습니다.
  AI 기능은 로그인한 사용자만 쓸 수 있으며, API 키는 서버에서만 관리됩니다.
• 표 · 인용구 · 코드 블록표는 우클릭 메뉴로 행·열 추가와 삭제, 셀 병합·분할을 하고 테두리, 셀 간격, 너비 같은 표 스타일을 바꿀 수 있습니다.
  인용구는 기본, 컬러, 아이콘, 알림박스, 말풍선, 특수 스타일 갤러리에서 고르고, 코드 블록은 언어를 지정해 넣을 수 있습니다.
• 안전한 저장 처리입력된 HTML은 허용 목록 기반으로 정화되고, 서버에 저장할 때 한 번 더 정화됩니다.
  로그인 세션과 CSRF 토큰, 요청 횟수 제한, 업로드 파일 크기 제한으로 업로드와 저장 기능을 보호합니다.

툴바 기능 한눈에 보기

• 파일
  • 새 문서
  • 파일 열기 (HTML · TXT)
  • 템플릿
  • 레이아웃
  • PDF로 저장
  • 인쇄
  • 쪽 나누기
• 편집
  • 실행 취소 · 다시 실행
  • 잘라내기 · 복사
  • 전체 선택
  • 찾기 / 바꾸기
  • 서식 제거
• 삽입
  • 링크
  • 이미지
  • 동영상
  • 표
  • 인용구
  • 코드 블록
  • 수평선
  • 접기(펼치기)
  • 체크리스트
  • 목차
  • 날짜·시간
  • 특수문자
• 서식
  • 제목 · 글꼴 · 글자 크기
  • 줄 간격
  • 굵게 · 기울임 · 밑줄 · 취소선
  • 위·아래 첨자
  • 인라인 코드
  • 글자색 · 배경색
  • 정렬 · 양쪽 정렬
  • 목록 · 들여쓰기
• 도구
  • 웹 접근성 검증
  • AI 작성
  • 전체화면
  • 도움말
• 화면 구성
  • 편집 · HTML · 미리보기 탭
  • 글자 수 · 공백 제외 · 단어 수
  • 높이 조절
  • 우클릭 메뉴

작성자가 편한 기능

• 자동저장과 복원작성 중인 내용을 자동으로 저장하고, 다시 열면 복원 여부를 물어 갑작스러운 종료에도 글을 지킵니다.
• 링크 미리보기 카드주소를 넣으면 서버를 통해 해당 페이지의 정보를 가져와 카드 형태로 보여줍니다.
• 외부 이미지 가져오기외부 이미지 주소를 서버로 가져와 내 서버에 저장할 수 있습니다.
• PDF 저장작성한 문서를 PDF 파일로 저장할 수 있습니다.
• HTML 소스 보기 · 다운로드작성한 결과를 HTML 소스로 확인하고 .html 파일로 내려받을 수 있습니다.
• 반응형 툴바화면 폭에 맞춰 툴바가 조정되어 모바일 화면에서도 사용할 수 있습니다.

도입이 쉽습니다

• HTML만으로 적용글쓰기 입력창(textarea)에 클래스 하나를 지정하고 옵션은 data 속성으로 설정하면 되는 선언적 방식입니다.
• 폼과 자동 연동폼을 제출할 때 작성한 내용이 입력창에 자동으로 동기화되어 기존 게시판과 쉽게 연결됩니다.
• 가벼운 순수 JavaScript별도의 프레임워크 없이 동작하는 순수 JavaScript 에디터로, 다크 모드와 Bootstrap 5 환경과도 어울립니다.

<textarea id="editor" class="editor" data-height="420"></textarea>
<script src="WebEditor.js"></script>

필요에 맞게 확장하세요

• 업로드 방식 교체이미지 업로드 핸들러를 교체해 기존 서버의 업로드 방식에 맞출 수 있습니다.
• 툴바 버튼 추가필요한 기능을 커스텀 툴바 버튼으로 추가하고 원하는 버튼만 골라 구성할 수 있습니다.
• 플러그인 · 이벤트플러그인 등록과 이벤트 훅, 선택 영역·모달 API를 제공해 서비스에 맞는 기능으로 확장할 수 있습니다.

다국어 화면

• 한국어
• English
• 日本語
• 中文(简体)
• 中文(繁體)
• Tiếng Việt
• Bahasa Indonesia
• Français

구축절차

1. 1구축 상담 및 견적적용할 사이트와 필요한 기능을 알려 주세요.
2. 2구축 계약 체결상담 내용을 바탕으로 계약을 체결합니다.
3. 3K 웹에디터 적용사이트의 글쓰기 화면에 에디터를 적용합니다.
4. 4비용 결제 및 사용비용 결제 후 K 웹에디터를 사용합니다.

도입 문의하기