CKEditor不显示任何工具栏

Question

I declare my CKEditor with this code :

<ckeditor width="600px" id="ckeditorMessage" visible="true" customConfigurationsPath="/styles/js/config.js">                                    
    <attribute name="value">
    </attribute>
</ckeditor>

According to all tutorials I found, it is enough to show the CKEditor. But, my CKEditor just showed like this:

I build it inside ZK Framework 7 and the CKEditor version is 4.

This error appear in my console. Hope this help

maven dependecies in build path. There is ckez in there:

Answer 1

try this instead, in your .java file insert this code:

public static CKEditorConfig createConfig() 
{
    CKEditorConfig config = new CKEditorConfig();       
    List<List<String>> list = new ArrayList<List<String>>();
    List<String> subList = new ArrayList<String>();
    subList.add("Source");
    subList.add("-");
    subList.add("Bold");
    subList.add("Italic");
    subList.add("BulletedList");
    list.add(subList);
    config.addConfigValue("toolbar", list);     

    return config;
} 

}

and put this to your jsp file

<% CKEditorConfig textArea = new CKEditorConfig();
    textArea = CKEditor.createConfig();
    textArea.addConfigValue("width", "700");
    textArea.addConfigValue("height", "350");       %>
        <textarea id="txtDescription" name="txtDescription"></textarea>
    <ckeditor:replace replace="txtDescription" basePath="CKEditor/" config="<%=textArea%>"></ckeditor:replace><br><br>

Answer 2

Could you try this version :

<dependency>
    <groupId>org.zkoss.zkforge</groupId>
    <artifactId>ckez</artifactId>
    <version>4.4.6.1</version>
</dependency> 

Oke, I checked your project, removing all the redundant dependencies and it came to this POM :

<dependencies>
    <!-- Zkoss dependencies -->
    <dependency>
        <groupId>org.zkoss.zk</groupId>
        <artifactId>zk</artifactId>
                     <version>7.0.4</version>
    </dependency>
    <dependency>
        <groupId>org.zkoss.zk</groupId>
        <artifactId>zul</artifactId>
                    <version>7.0.4</version>
    </dependency>
    <dependency>
        <groupId>org.zkoss.zk</groupId>
        <artifactId>zkplus</artifactId>
                    <version>7.0.4</version>
    </dependency>
    <dependency>
        <groupId>org.zkoss.zk</groupId>
        <artifactId>zkbind</artifactId>
                    <version>7.0.4</version>
    </dependency>
    <dependency>
        <groupId>org.zkoss.zk</groupId>
        <artifactId>zhtml</artifactId>
                    <version>7.0.4</version>
    </dependency>
    <dependency>
        <groupId>org.zkoss.zk</groupId>
        <artifactId>zkmax</artifactId>
                    <version>7.0.4</version>
    </dependency>
    <dependency>
        <groupId>org.zkoss.zk</groupId>
        <artifactId>zkex</artifactId>
                    <version>7.0.4</version>
    </dependency>
    <dependency>
        <groupId>org.zkoss.common</groupId>
        <artifactId>zweb</artifactId>
                    <version>7.0.4</version>
    </dependency>
    <!-- ckeditor -->
    <dependency>
        <groupId>org.zkoss.zkforge</groupId>
        <artifactId>ckez</artifactId>
                    <version>4.4.6.1</version>
    </dependency>
</dependencies>

Zul page :

<window title="new page title" border="normal" apply="org.zkoss.bind.BindComposer" viewModel="@id('vm') @init('be.chillworld.TestVM')">
    <ckeditor customConfigurationsPath="/js/ckeditor-config.js" value="@bind(vm.text)"></ckeditor>
</window>

With the folder js is under Web Pages .

Content of javascript file :

CKEDITOR.editorConfig = function(config) {
    config.resize_enabled = false;
    config.toolbar = 'Complex';
    config.toolbar_Simple = [[ 'Bold', 'Italic', '-', 'NumberedList', 'BulletedList', '-', 'Link', 'Unlink', '-', 'About' ] ];
    config.toolbar_Complex = [[ 'Bold', 'Italic', 'Underline', 'Strike', 'Subscript','Superscript', 'TextColor', 'BGColor', '-', 'Cut', 'Copy', 'Paste', 'Link', 'Unlink'],
                              [ 'Undo', 'Redo', '-', 'JustifyLeft', 'JustifyCenter','JustifyRight', 'JustifyBlock' ], 
                              [ 'Table', 'SpecialChar','Styles', 'Format', 'Font', 'FontSize', 'Maximize'] ];
   //config.fontSize_defaultLabel = '12'; // set font size label to 12.
   //config.font_defaultLabel = 'Arial'; // set font family label to arial.
   config.removePlugins = 'elementspath'; // remove bottom bar

};

And I get for both ckez versions the complete ckeditor in the screen.
Now, there is a javaScript error when using the 3.6.0.1, what we don't have in the 4.4.6.1 version.

Now, I tested a little more and added a fault in the ckeditor-config.js what resulted in the same issue as you have => no more toolbar, but other js fault.

So try the posted ckeditor-config.js file, and put it in the correct place.
See in tab network of developertools that the ckeditor-config.js has status 200, so we know it's loaded.
If that doesn't work, try it without the js file, this should be resulting in a full toolbar.