로그인

검색

Extra Form

// Toolbar configuration generated automatically by the editor based on config.toolbarGroups.
config.toolbar = [
    { name: 'document', groups: [ 'mode', 'document', 'doctools' ], items: [ 'Source', '-', 'Save', 'NewPage', 'ExportPdf', 'Preview', 'Print', '-', 'Templates' ] }, 

20210917_153242.jpg


    { name: 'clipboard', groups: [ 'clipboard', 'undo' ], items: [ 'Cut', 'Copy', 'Paste', 'PasteText', 'PasteFromWord', '-', 'Undo', 'Redo' ] },

20210917_153429.jpg


    { name: 'editing', groups: [ 'find', 'selection', 'spellchecker' ], items: [ 'Find', 'Replace', '-', 'SelectAll', '-', 'Scayt' ] },

20210917_153630.jpg


    { name: 'forms', items: [ 'Form', 'Checkbox', 'Radio', 'TextField', 'Textarea', 'Select', 'Button', 'ImageButton', 'HiddenField' ] },

20210917_153719.jpg


    '/',
    { name: 'basicstyles', groups: [ 'basicstyles', 'cleanup' ], items: [ 'Bold', 'Italic', 'Underline', 'Strike', 'Subscript', 'Superscript', '-', 'CopyFormatting', 'RemoveFormat' ] },

20210917_153805.jpg


    { name: 'paragraph', groups: [ 'list', 'indent', 'blocks', 'align', 'bidi' ], items: [ 'NumberedList', 'BulletedList', '-', 'Outdent', 'Indent', '-', 'Blockquote', 'CreateDiv', '-', 'JustifyLeft', 'JustifyCenter', 'JustifyRight', 'JustifyBlock', '-', 'BidiLtr', 'BidiRtl', 'Language' ] },

20210917_153904.jpg


    { name: 'links', items: [ 'Link', 'Unlink', 'Anchor' ] },

20210917_153951.jpg


    { name: 'insert', items: [ 'Image', 'Flash', 'Table', 'HorizontalRule', 'Smiley', 'SpecialChar', 'PageBreak', 'Iframe' ] }, '/',

20210917_154055.jpg


    { name: 'styles', items: [ 'Styles', 'Format', 'Font', 'FontSize' ] },

20210917_154207.jpg


    { name: 'colors', items: [ 'TextColor', 'BGColor' ] },

20210917_154239.jpg


    { name: 'tools', items: [ 'Maximize', 'ShowBlocks' ] },

20210917_154314.jpg


    { name: 'others', items: [ '-' ] },
    { name: 'about', items: [ 'About' ] }  20210917_154357.jpg


];

 

 

// Toolbar groups configuration.
config.toolbarGroups = [
    { name: 'document', groups: [ 'mode', 'document', 'doctools' ] },
    { name: 'clipboard', groups: [ 'clipboard', 'undo' ] },
    { name: 'editing', groups: [ 'find', 'selection', 'spellchecker' ] },
    { name: 'forms' },
    '/',
    { name: 'basicstyles', groups: [ 'basicstyles', 'cleanup' ] },
    { name: 'paragraph', groups: [ 'list', 'indent', 'blocks', 'align', 'bidi' ] },
    { name: 'links' },
    { name: 'insert' },
    '/',
    { name: 'styles' },
    { name: 'colors' },
    { name: 'tools' },
    { name: 'others' },
    { name: 'about' }
];

 


[XE 전용]

{ name: 'clipboard', groups: [ 'xecomponent'], 'emoticon', 'image_link', 'poll_maker', 

20210917_154445.jpg

 


[추가 플러그인]  20210917_170219.jpg

'btgrid', 'simplebutton'

 

  • < 플러그인의 toolbar 표시 부분 기본 형식  >

        init: function(editor) {
          
           // Add widget
           editor.ui.addButton('btgrid', {
             label: lang.createBtGrid,
             command: 'btgrid',
             toolbar: 'insert',                 // toolbar groub into which the button will be added
             icon: this.path + 'icons/btgrid.png'
           });    

     


  1. 26
    Dec 2025
    11:24

    stickers v3.0

    😀 stickers Ckeditor 4 Plugins stickers Add-on installation instructions If you want to add the plugin manually, you will need to: 1. Extract the downloaded plugin .zip into the plugins folder of your CKEditor installation. Example: http://e...
    Read More
  2. 26
    Dec 2025
    00:08

    glasspannel - 글래스모피즘 패널 생성기

    glasspannel 글래스모피즘이 적용된 반투명한 패널을 만들어 줍니다. 설치경로 : /plugins/glasspannel/ config.js 추가 config.extraPlugins = 'glasspannel'; addButton : 'GlassPannel' Download : glasspannel_v1.0.zip - unsplash API 적용, 배경이미지 ...
    Read More
  3. 25
    Dec 2025
    23:49

    rainbowcode - Code Snippet과 Syntex Highlight 을 적용한 소스코드 입력을 위한 플러그인

    rainbowcode CKEditor 플러그인 소스코드를 본문에 입력할 수 있는 Code Snippet 플러그인으로 Syntex Highlight를 적용하여 문법에 따른 색상값을 적용하여 소스코드 구분이 쉽다. 의존 플러그인 : 아래 플러그인이 같이 설치되어 있어야 함. - lineutils - w...
    Read More
  4. 18
    Dec 2025
    21:40

    CKEditor 4 Toolbar 접고/펴기

    CKEditor 4 의 Toolbar 를 접었다 폈다 할 수 있는 아이콘을 만들고, 기본 상태를 설정합니다. 바로 이렇게요. config.js 파일에 아래의 내용을 추가합니다. // 툴바 접고 펴기 config.toolbarCanCollapse = true; config.toolbarStartupExpanded = true;
    Read More
  5. 18
    Nov 2023
    11:24

    rhymix (XE) - ckeditor에 Google Fonts 넣는 방법

    Google Fonts - Hi Melody 넣기 구글폰트에서 제공하는 예쁜 한글 글꼴 Hi Melody를 Rhymix 홈페이지에 넣어 보도록 하겠습니다. Rhymix 웹편집기 ckeditor와 조합하여 언제든 게시글에 예쁜 구글폰트를 넣을 수 있습니다. 1. 구글폰트를 검색해서 원하는 폰트...
    Read More
  6. 08
    Jul 2023
    09:33

    Plugins / Font Awesome fortyTwo(fa42)

    Font Awesome fortyTwo ckeditor Plugins fa42 적용 방법입니다. fa42 는 Font-awesome 최신버전인 6.4.0 을 적용할 수 있습니다. Font-awesome 의 버전이 어떤 의미가 있는지 모르지만 최신 경향이 반영된 아이콘이 추가되었거나 그런정도의 차이가 있을 듯 ...
    Read More
  7. 30
    Dec 2021
    12:57

    Rhymix 에서 CSS 로 배경이미지(body) 적용시 CKeditor4 입력창에도 배경이 들어가는 문제

    Rhymix 에서 body 스타일에 배경이미지를 적용하면 body 스타일이 CKeditor 입력란에도 적용되어 버림. Rhymix/modules/editor/skins/ckeditor/css/default.less 파일의 .cke_wysiwyg_div 스타일에 background 스타일을 적용하면 해당 색상으로 입력란 배경이 ...
    Read More
  8. 28
    Dec 2021
    22:13

    ckeditor 색상 값 정리

    root/modules/editor/skins/ckeditor/css/default.css body.cke_editable { padding: 5px; background-color: transparent; } // html.cke_panel_container, html.cke_panel_container body { background-color: transparent; }
    Read More
  9. 17
    Sep 2021
    15:46

    Ckeditor Toolbar 등록 이름

    // Toolbar configuration generated automatically by the editor based on config.toolbarGroups. config.toolbar = [ { name: 'document', groups: [ 'mode', 'document', 'doctools' ], items: [ 'Source', '-', 'Save', 'NewPage', 'ExportPdf', 'Preview...
    Read More
Board Pagination Prev 1 Next
/ 1