带有highlight.js代码的CKEditor

Question

我正在尝试使用highlight.js和CKEditor加载项CodeSnippet。

我让CKEditor工作，包括CodeSnippet加载项，但是我的代码没有被检测到，也没有被编码或缩进，或者像我预期的那样。

读highlight.js它说

这将在预代码标记中找到并突出显示代码；它试图自动检测语言。如果自动检测不适用于您，则可以在class属性中指定语言：

这是我在HTML中调用JavaScript的highlight.js

<script src="{% static 'js/ckeditor/plugins/codesnippet/lib/highlight/highlight.pack.js' %}"></script>
<script>hljs.initHighlightingOnLoad();</script>

这是我的config.js CKEditor

CKEDITOR.editorConfig = function( config ) {.
    config.toolbarGroups = [
        { name: 'basicstyles', groups: [ 'basicstyles', 'cleanup' ] },
        { name: 'paragraph',   groups: [ 'list', 'indent', 'blocks', 'align' ] },
        { name: 'styles' },
        { name: 'colors' },
        { name: 'insert', groups: [ 'codesnippet'] },
    ];


    config.removeButtons = 'Image,Flash,Table,HorizontalRule,Smiley,SpecialChar,PageBreak,Iframe';

    config.format_tags = 'p;h1;h2;h3;pre';

    config.removeDialogTabs = 'image:advanced;link:advanced';
};

Answer 1

这解决了这个问题：

CKEDITOR_CONFIGS = {
    'default': {
        'skin': 'bootstrapck',
        'toolbar': 'Custom',
        'toolbar_Custom': [
            {'name': 'basicstyles', 'items': ['Bold', 'Italic', 'Underline', '-', 'RemoveFormat']},
            {'name': 'paragraph', 'items': ['NumberedList', 'BulletedList']},
            {'name': 'indent', 'items': ['Indent', 'Outdent']},
            {'name': 'codeSnippet', 'items': ['CodeSnippet',]}
        ],
        'codeSnippet_theme': 'school_book',
        'tabSpaces' : 4,
        'extraPlugins': ','.join(
            [
            'codesnippet',
            'widget',
            'dialog',
            ]),
    }
}