관리 메뉴

이사작전.com IT Blog

[반응형 에디터] 마케터를 위한 summernote 최고의 옵션 셋팅 본문

Front/jQuery

[반응형 에디터] 마케터를 위한 summernote 최고의 옵션 셋팅

말랑고양 플랫폼공작소 2019.02.04 00:34

안녕하세요. 이사작전입니다. 오늘은 개발사의 요구사항이 반영된 summernote 셋팅을 공유하려합니다. 글자크기 조절, 사진업로드 등 필수옵션이 선별되어 있습니다.


1. 소스코드 공개

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
<script>
    $(document).ready(function() {
      $('#nttCn').summernote({
        placeholder: '홍보 포스팅을 자유롭게 입력해주세요.',
        height: 500,
        lang: 'ko-KR',
        toolbar: [
                    // [groupName, [list of button]]
                    ['Font Style', ['fontname']],
                    ['style', ['bold''italic''underline']],
                    ['font', ['strikethrough']],
                    ['fontsize', ['fontsize']],
                    ['color', ['color']],
                    ['para', ['paragraph']],
                    ['height', ['height']],
                    ['Insert', ['picture']],
                    ['Insert', ['link']],
                    ['Misc', ['fullscreen']]
                 ]
      });
    });
</script>
cs

2. 적용 결과


감사합니다. 도움이 되었다면 '좋아요' 눌러주세요.

추가로 궁금하거나 질문사항이 있다면 댓글남겨주세요. 감사합니다.

reference : https://summernote.org/

#summernote #에디터 #반응형에디터

0 Comments
댓글쓰기 폼