gnuboard 에서 summernote 에디터 사용 autosave 적용하기
링크
컨텐츠 정보
- 10,591 조회
- 0 추천
- 목록
본문
그누보드5 팁자료실
gnuboard 에서 summernote 에디터 사용 autosave 적용하기gnuboard 에서 summernote 에디터 사용 autosave 적용하기
v:\g5s\js\autosave.js 파일 수정 합니다
function autosave() { $("form#fwrite").each(function() { if(g5_editor != "") { if (g5_editor.indexOf("ckeditor4") != -1 && typeof(CKEDITOR.instances.wr_content)!="undefined") { this.wr_content.value = CKEDITOR.instances.wr_content.getData(); // summernote data 설정 } else if (g5_editor.indexOf("summernote") != -1 ) { this.wr_content.value = $("#wr_content").code(); } // summernote data 설정
// 임시저장된 글 제목과 내용을 가져와서 제목과 내용 입력박스에 노출해 줌 $(document).on( "click", ".autosave_load", function(){ var $li = $(this).parents("li"); var as_id = $li.data("as_id"); var as_uid = $li.data("uid"); $("#fwrite input[name='uid']").val(as_uid); $.get(g5_bbs_url+"/ajax.autosaveload.php", {"as_id":as_id}, function(data){ var subject = $(data).find("item").find("subject").text(); var content = $(data).find("item").find("content").text(); $("#wr_subject").val(subject); if(g5_editor != "") { if (g5_editor.indexOf("ckeditor4") != -1 && typeof(CKEDITOR.instances.wr_content)!="undefined") { CKEDITOR.instances.wr_content.setData(content); // summernote 내용 로드 } else if (g5_editor.indexOf("summernote") != -1 ) { $("#wr_content").code(content); } // summernote 내용 로드
https://11q.kr/g5s/bbs/board.php?bo_table=s11&wr_id=1717&sfl=wr_subject&stx=summernote
자료 참조 사용에 너무나 편리 합니다 모바일에서 사진 추가가능등관련링크
그누보드5 를 위한 Summernote 에디터 플러그인
bootstrap 을 사용하는 위지윅 에디터를 gnuboard 플러그인 형태로 구성하였습니다.
* 플러그인 설치
다운로드 : https://github.com/easylogic/gnuboard5-summernote/archive/master.zip
git clone : https://github.com/easylogic/gnuboard5-summernote.git
두가지 형태로 소스를 받은 후에
gnuboard 의 plugin/editor/ 디렉토리에 summernote 이름으로 넣어주세요.
* 플러그인 사용
[관리자 모드 > 환경 설정 > 기본 환경 설정] 메뉴의 [홈페이지 기본환경 설정 > 에디터 선택] 에서 summernote 를 선택해주세요.
* 지원 기능
- summernote 기본 기능
- drag&drop 형태로 Image Upload 지원
- video 태그 입력 플러그인
* 이미 bootstrap css 를 사용하는 경우
editor.lib.php 에서 사용하지 않는 css 를 제거해주시면 됩니다.
질문이나 기능에 대한 문의는 https://github.com/easylogic/gnuboard5-summernote 여기에 이슈 달아주세요.
감사합니다.
----
추가사항 : autosave 적용하기
auto save 를 적용 하기 위해서는 하드 코딩이 필요합니다.
일단 /js/autosave.js 를 열어서 아래 2가지를 추가 해주세요.
function autosave () {
...
// summernote data 설정
} else if (g5_editor.indexOf("summernote") != -1 ) {
this.wr_content.value = $("#wr_content").code();
}
...
}
// autosave 내용 로드
$(document).on( "click", ".autosave_load", function(){
...
// summernote 내용 로드
} else if (g5_editor.indexOf("summernote") != -1 ) {
$("#wr_content").code(content);
}
...
}
bootstrap 을 사용하는 위지윅 에디터를 gnuboard 플러그인 형태로 구성하였습니다.
* 플러그인 설치
다운로드 : https://github.com/easylogic/gnuboard5-summernote/archive/master.zip
git clone : https://github.com/easylogic/gnuboard5-summernote.git
두가지 형태로 소스를 받은 후에
gnuboard 의 plugin/editor/ 디렉토리에 summernote 이름으로 넣어주세요.
* 플러그인 사용
[관리자 모드 > 환경 설정 > 기본 환경 설정] 메뉴의 [홈페이지 기본환경 설정 > 에디터 선택] 에서 summernote 를 선택해주세요.
* 지원 기능
- summernote 기본 기능
- drag&drop 형태로 Image Upload 지원
- video 태그 입력 플러그인
* 이미 bootstrap css 를 사용하는 경우
editor.lib.php 에서 사용하지 않는 css 를 제거해주시면 됩니다.
질문이나 기능에 대한 문의는 https://github.com/easylogic/gnuboard5-summernote 여기에 이슈 달아주세요.
감사합니다.
----
추가사항 : autosave 적용하기
auto save 를 적용 하기 위해서는 하드 코딩이 필요합니다.
일단 /js/autosave.js 를 열어서 아래 2가지를 추가 해주세요.
function autosave () {
...
// summernote data 설정
} else if (g5_editor.indexOf("summernote") != -1 ) {
this.wr_content.value = $("#wr_content").code();
}
...
}
// autosave 내용 로드
$(document).on( "click", ".autosave_load", function(){
...
// summernote 내용 로드
} else if (g5_editor.indexOf("summernote") != -1 ) {
$("#wr_content").code(content);
}
...
}
--------------------------------------\r\n♠ 출처는 링크 참조 바랍니다. https://11q.kr ♠
관련자료
-
링크
댓글 0
등록된 댓글이 없습니다.