TinyMCE #
Find similar titles

Structured data

Category: Programming

TinyMCE 에디터 #

WYSIWYG에디터의 일종으로 WYSIWYG에디터는 크게 desktop-based와 JavaScript-based로 나눌 수 있는데, TinyMCE 에디터는 LGPL 라이센스의 JavaScript-based WYSIWYG 온라인 에디터이다.

특징 #

모바일 지원 웹에디터
40개 이상의 다양한 기능의 편집 기능
주요 5대 브라우저(Mozilla, MSIE, FireFox, Opera and Safari) 크로스 브라우징 지원
디자인 커스마이징 지원
다양한 언어 지원
AJAX 사용 가능
Plugin 추가 가능

설정 #

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
<head>
    <meta http-ｅquiv="Content-Type" content="text/html; charset=utf-8" />
    <script type="text/javascript" src="./3.2.7/tiny_mce.js"></script>
    <script type="text/javascript">
    // TinyMCE 사용을 위한 설정 정의
    tinyMCE.init({
        // General options
        mode : "textareas", // 위지웍 에디터로 사용할 HTML 요소는 textarea로 지정한다.
        theme : "advanced", // TinyMCE는 여러가지 테마를 지원해준다. 그중 advanced 테마를 사용
        plugins : "safari, pagebreak, style, layer, table, save, advhr, advimage, advlink, emotions, iespell, inlinepopups, insertdatetime, preview, media, searchreplace, print, contextmenu, paste, directionality, fullscreen, noneditable, visualchars, nonbreaking, xhtmlxtras, template",
        language: "ko", // 사용할 언어는 한국어로 지정

        // Theme options
        // theme_advanced_buttons1~3의 변수를 변경함으로써 메뉴를 배치할 수 있다.
        theme_advanced_buttons1 : "code, |, undo, redo, |, cut, copy, paste, pastetext, pasteword, |, search, replace, |, removeformat, cleanup",
        theme_advanced_buttons2 : "bold, italic, underline, strikethrough, |, sub, sup, |, bullist, numlist, |, justifyleft, justifycenter, justifyright, justifyfull, |, outdent, indent, |, blockquote, |, link, unlink, image, media, |, forecolor, backcolor",
        theme_advanced_buttons3 : "formatselect,fontselect,fontsizeselect,|,tablecontrols,preview,|,fullscreen,help",
        theme_advanced_toolbar_location : "top", // 툴바는 상단에 위치
        theme_advanced_toolbar_align : "left",
        theme_advanced_statusbar_location : "bottom",
        theme_advanced_resizing : false // 위지웍 에디터를 인위적으로 변경 불가능. true로 설정할 경우 마우스로 크기를 변경할 수 있다.
    });
    </script>
</head>
<body>

<textarea>