[smart editor] 스마트에디터 사용방법 php

1) 스마트 에디터 다운로드

https://github.com/naver/smarteditor2 

https://github.com/naver/smarteditor2/releases << 이전버전 다운로드

2) 인클루드 해야될 파일들

<script type="text/javascript" src="/smarteditor/js/HuskyEZCreator.js" charset="utf-8"></script>

<script type="text/javascript" src="/js/smarteditor.js" charset="utf-8"></script>

3) 자바스크립트 코딩

 //전역변수선언

var oEditors = [];

 

nhn.husky.EZCreator.createInIFrame({

oAppRef: oEditors,

elPlaceHolder: "smarteditor",

sSkinURI: "/smarteditor/SmartEditor2Skin.html",

htParams : {

// 툴바 사용 여부 (true:사용/ false:사용하지 않음)

bUseToolbar : true,            

// 입력창 크기 조절바 사용 여부 (true:사용/ false:사용하지 않음)

bUseVerticalResizer : true,    

// 모드 탭(Editor | HTML | TEXT) 사용 여부 (true:사용/ false:사용하지 않음)

bUseModeChanger : true,

}

});

 

//전송버튼 클릭이벤트

$("#board-form-submit-smart").click(function(){

//id가 smarteditor인 textarea에 에디터에서 대입합니다.

oEditors.getById["smarteditor"].exec("UPDATE_CONTENTS_FIELD", []); << textarea 1개일경우

oEditors.getById["smarteditor"].exec("UPDATE_CONTENTS_FIELD", []); << textarea 여러개일경우

oEditors.getById["smarteditor2"].exec("UPDATE_CONTENTS_FIELD", []); << textarea 여러개일경우

oEditors.getById["smarteditor3"].exec("UPDATE_CONTENTS_FIELD", []); << textarea 여러개일경우

 

// 이부분에 에디터 validation 검증

 

//폼 submit

$("form").submit();

});

//스마트에디터 render 

renderEditor(['smarteditor']); << textarea 1개일경우

renderEditor(['smarteditor','smarteditor2','smarteditor3']); << textarea 여러개일경우

4) file_uploader_html5.php 파일 변경(위치 : smarteditor\sample\photo_uploader\file_uploader_html5.php)

 + $uploadDir = '../../../images/board/contents/'; <<<< 이미지 저장경로 지정

 + $sFileInfo .= "&sFileURL=/images/board/contents/".$file->name; <<<< 이미지 src정보지정