Custom toolbar with Summernote

前端 未结 2 1829
渐次进展
渐次进展 2020-12-29 03:03

How do I know which functions can be enabled for the toolbar of summernote, and how to do it?

In the API docs all I can find is \"toolbar : Array (optional)\" witho

相关标签:
2条回答
  • 2020-12-29 03:33

    paragraph includes indent and outdent, codeview as it suggests does codeview.

    $('.summernote').summernote({
        toolbar: [
            //[groupname, [button list]]
    
            ['style', ['bold', 'italic', 'underline', 'clear']],
            ['color', ['color']],
            ['para', ['ul', 'ol', 'paragraph']],
            ['view', ['codeview']],
        ]
    });
    

    If you look on the main Summernote website as opposed to the API docs you will see a clear example, that explains how to customise the toolbar. It is on the Deep Dive page and scroll down to Custom Toolbar. It also lists the available toolbar buttons.

    http://summernote.org/#/deep-dive#custom-toolbar

    0 讨论(0)
  • 2020-12-29 03:43

    in settings.js You have basic setting (with all features on):

    toolbar: [
        ['style', ['style']],
        ['font', ['bold', 'italic', 'underline', 'clear']],
        ['fontname', ['fontname']],
        ['color', ['color']],
        ['para', ['ul', 'ol', 'paragraph']],
        ['height', ['height']],
        ['table', ['table']],
        ['insert', ['link', 'picture', 'hr']],
        ['view', ['fullscreen', 'codeview']],
        ['help', ['help']]
      ],
    

    indentation is in 'paragraph'

    0 讨论(0)
提交回复
热议问题