laravel ckeditor 深色主题

Question

Hello every one,

我在网上搜索了 CKEditor 的深色皮肤以及如何实际插入它。

我只是想分享一下我是如何让它简单地工作的我实际上对官方暗黑[=27=做了我认为有趣的编辑]

我在这里发布了这个问题和答案，因为我在这里没有找到任何相关主题。我想以一种简单详细的方式分享这个非常具体的知识和解决方案，让每个人都更容易和直接

加上这是一个完整的黑暗主题，而不是官方的。

谢谢

Answer 1

详细答案如下：

首先安装 CKEditor，如果您将它用于 laravel 项目 follow these steps
成功运行后，Download this skin folder到CKEditor skins文件夹，对于laravel你会在路径中找到它：

public/vendor/unisharp/laravel-ckeditor/skins

在粘贴皮肤文件夹到skins目录后，打开config.js表单CKEditor基本目录-public/vendor/unisharp/laravel-ckeditor for laravel - AND 将其内容替换为：

/**
 * @license Copyright (c) 2003-2017, CKSource - Frederico Knabben. All rights reserved.
 * For licensing, see LICENSE.md or http://ckeditor.com/license
 */

CKEDITOR.editorConfig = function( config ) {
    // Define changes to default configuration here.
    // For complete reference see:
    // http://docs.ckeditor.com/#!/api/CKEDITOR.config

    // The toolbar groups arrangement, optimized for two toolbar rows.
    config.toolbarGroups = [
        { name: 'basicstyles', groups: [ 'basicstyles', 'cleanup' ] },
        { name: 'paragraph',   groups: [ 'list', 'indent', 'blocks', 'align', 'bidi' ] },
        { name: 'styles' },
        { name: 'colors' }
    ];

    // Remove some buttons provided by the standard plugins, which are
    // not needed in the Standard(s) toolbar.
    config.removeButtons = 'Underline,Subscript,Superscript';

    // Set the most common block elements.
    config.format_tags = 'p;h1;h2;h3;pre';

    // Simplify the dialog windows.
    config.removeDialogTabs = 'image:advanced;link:advanced';

    config.skin = 'ckeditor-basic-moono-dark-biskrem';
};

结果

这里是截图

解释

// The toolbar groups arrangement, optimized for two toolbar rows.
    config.toolbarGroups = [
        { name: 'basicstyles', groups: [ 'basicstyles', 'cleanup' ] },
        { name: 'paragraph',   groups: [ 'list', 'indent', 'blocks', 'align', 'bidi' ] },
        { name: 'styles' },
        { name: 'colors' }
    ];

这只是为了将编辑器缩小到基本工具

最后是这行代码：

config.skin = 'ckeditor-basic-moono-dark-biskrem';

实际将编辑器皮肤设置为我们的深色主题 ckeditor-basic-moono-dark-biskrem 表示 skins 文件夹中的皮肤文件夹名称

laravel ckeditor 深色主题

laravel ckeditor dark theme

php

ckeditor

ckeditor4.x

详细答案如下：

结果

解释