使用django-ckeditor添加CKEditor 4 detail插件遇按钮不显示问题

1. 修正settings.py的CKEDITOR_CONFIGS配置格式 #

别用字符串拼接，得用元组列表配置externalPlugins，同时要把插件名加到extraPlugins里，还要给工具栏加上Detail按钮。正确配置示例：

CKEDITOR_CONFIGS = {
    'default': {
        # 保留你原来的其他配置
        'extraPlugins': ','.join(['detail']),  # 指定要加载的插件名
        'externalPlugins': [
            ('detail', '/static/js/lib/ckeditor-plugins/detail/plugin.js'),
        ],
        # 把Detail按钮加到工具栏，比如插入到已有工具栏组中
        'toolbar': [
            # 你的其他工具栏项...
            ['Bold', 'Italic', 'Detail'],  # 这里加入Detail按钮
        ],
    }
}

注意：externalPlugins里的路径必须是浏览器能直接访问的绝对路径，开头的/不能丢，要和你能打开plugin.js的路径完全一致。

2. 确认静态文件服务正常 #

检查Django的STATIC_URL设置（比如STATIC_URL = '/static/'），开发环境确保DEBUG=True，生产环境要运行过python manage.py collectstatic，保证插件文件夹被正确收集到静态文件目录。

3. 强制刷新浏览器缓存 #

浏览器大概率缓存了旧的CKEditor配置，按Ctrl+Shift+R强制刷新页面，再看网络面板里有没有加载plugin.js。

4. 检查插件代码是否正确 #

直接在浏览器打开插件的plugin.js地址，确认代码能正常访问，而且插件里要正确注册按钮，比如代码里得有类似这样的内容：

CKEDITOR.plugins.add('detail', {
    init: function(editor) {
        editor.ui.addButton('Detail', {
            label: '插入详情块',
            command: 'detail',
            icon: this.path + 'icons/detail.png', // 如果有图标文件的话
            toolbar: 'insert'
        });
        // 插件的其他逻辑代码
    }
});

要是插件没正确注册按钮，工具栏肯定出不来。

5. 升级django-ckeditor版本 #

如果以上都没问题，可能是django-ckeditor版本太旧，不支持externalPlugins的元组列表配置，升级到最新稳定版试试：

pip install --upgrade django-ckeditor

内容的提问来源于stack exchange，提问作者Phil Gyford