====== TinyMCE HTML Wysiwyg Editor ======
* [[http://tinymce.moxiecode.com/|TinyMCE Homepage]]
===== IE에서 한글 첫글자 문제 =====
* IE에서 첫 글자로 한글을 쓰면 몇글자 쓰다가 안써지는 문제가 발생한다.
* ''forced_root_block: false''가 핵심 해결책이라고 한다.
* [[http://wiki.moxiecode.com/index.php/TinyMCE:Configuration/forced_root_block|forced_root_block]]에 관하여
* [[http://wiki.moxiecode.com/index.php/TinyMCE:FAQ#TinyMCE_produce_P_elements_on_enter.2Freturn_instead_of_BR_elements.3F|P태그 대신 BR 넣게 하기와, P 태그를 써야만 하는 이유]]를 참조하여 정확한 원인과 해결책을 찾을 것.
*
tinyMCE.init({
forced_root_block : false,
force_br_newlines : true,
force_p_newlines : false
});
* 저거 보다는 차라리 내용이 비어 있을 경우에 ''
tinyMCE.init({
theme : "advanced",
mode : "textareas",
plugins : "insertdiv,여기에,쉼표로,구분해서,플러그인,디렉토리이름을,적는다",
});
==== 주요 플러그인 ====
* [[http://sourceforge.net/tracker/?func=detail&aid=2770218&group_id=103281&atid=738747|Firefox,Chrome,Opera Link auto detect]] : 링크 문자열을 자동으로 인지하여 태그로 감싼다. IE에서는 원래 자동으로 된다.
===== 에디터 컨텐츠 제어 =====
* **tinyMCE.setContent("'+input_text+'");** : 에디터에 직접 내용을 넣을 수 있다.
* JavaScript을 이용해 Form을 submit 할 때는 submit 전에 **tinyMCE.triggerSave()**를 실행해 줘야 한다. triggerSave() 가 원래 textarea에 에디터에서 입력된 내용을 삽입 해 준다.
===== Tab 누를 때 툴바 건너뛰어 에디터 창으로 =====
* http://iamzed.com/2007/06/20/using-jquery-to-skip-the-tinymce-editor-toolbar-when-using-the-tab-key/
*
tinyMCE.init({
mode : "exact",
elements : "about",
theme: "advanced",
…all your advanced options…
init_instance_callback : "setTabIndex"
});
function setTabIndex()
{
$(".mceToolbarContainer > *").attr("tabIndex", "-1");
}
**tabIndex** 가 중간의 I 가 대문자임에 주의할 것. IE에서는 tabindex로 하면 안된다고함.
===== 허용 HTML Tag/Attribute 추가하기 =====
* [[http://tinymce.moxiecode.com/wiki.php/Configuration:extended_valid_elements|TinyMCE - extended_valid_elements]] 를 사용한다.
tinyMCE.init({
...
extended_valid_elements : "img[class|src|border=0|alt|title|hspace|vspace|width|height|align|onmouseover|onmouseout|name]"
});