I'm using CKEditor 4.5.2 with CKFinder 3.0.0 on PHP 5.6. Generally the integration works fine - when I click the CKEditor image button, I can click the "Browse server" button and CKFinder opens, I can select images, and also do uploads.
What doesn't work is the 'Upload' tab in the image2 dialogue. I always get an error saying "The requested resource type is not valid." when I click the "Send to server" button.
In my CKFinder config I have two resource types defined called Images
and Library
; these are essentialy the same except that Library
is read-only - I only want to allow uploads to the Images
type.
There are multiple ways of configuring the integration between CKEditor and CKFinder. I am using a custom JS config file for CKEditor and connecting ckFinder to it using the setupCKEditor
method, as per the docs:
CKFinder.setupCKEditor(ckeditor_1, {
'height': '100%',
'jquery': '/js/jquery-1.11.3.min.js',
'skin': 'jquery-mobile',
'swatch': 'a',
'themeCSS': '/themes/mytheme.min.css',
'filebrowserBrowseUrl': '/ckfinder/ckfinder.html',
'filebrowserImageBrowseUrl': '/ckfinder/ckfinder.html?Type=Images',
'filebrowserImageUploadUrl': '/ckfinder/core/connector/php/connector.php?command=QuickUpload&type=Images'
}, "Images");
I've tried passing the same values to CKEditor in my CKEDITOR.replace
call, and also set them on the config
property in my external config file, yet nothing changes - I still get the same error.
How should I do this? Alternatively, since the CKFinder uploader works fine, how can I disable the upload tab in the image2 dialogue?
Update: here's my current code for creating CKEditor and CKFinder instances:
var ckeditor_1 = CKEDITOR.replace('html', {
"baseHref":"http://mysite.mac.local/",
"toolbarStartupExpanded":true,
"extraPlugins":"symbol",
"customConfig":"/js/ckconfig.js"
});
CKFinder.setupCKEditor( ckeditor_1, {
'height': '100%',
'jquery': '/js/jquery-1.11.3.min.js',
'skin': 'jquery-mobile',
'swatch': 'a',
'themeCSS': '/themes/mytheme.min.css'
}, { type: "Images" } );
And my CKEditor config file:
CKEDITOR.editorConfig = function (config) {
// Define changes to default configuration here. For example:
// config.language = 'fr';
// config.uiColor = '#AADC6E';
config.docType = '<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">';
config.toolbarGroups = [
{name: 'document', groups: ['mode', 'document', 'doctools']},
{name: 'clipboard', groups: ['clipboard', 'undo']},
{name: 'editing', groups: ['find', 'selection', 'spellchecker']},
{name: 'links'},
{name: 'insert'},
{name: 'tools'},
{name: 'others'},
'/',
{name: 'basicstyles', groups: ['basicstyles', 'cleanup']},
{name: 'paragraph', groups: ['list', 'indent', 'blocks', 'align']},
{name: 'styles'},
{name: 'colors'},
{name: 'about'},
{name: 'symbol'}
];
config.removePlugins = 'templates,save,specialchar,image,flash,scayt,forms,wsc,print,iframe,pagebreak';
CKEDITOR.plugins.addExternal('symbol', '/ckeditorplugins/symbol/', 'plugin.js');
config.extraPlugins = 'symbol';
config.templates_replaceContent = false;
config.templates_files = [
'/ckeditorplugins/templates/templates.js'
];
config.allowedContent = true;
config.toolbarCanCollapse = true;
config.fullPage = true;
config.skin = 'bootstrapck';
config.height = 400;
config.uiColor = '#f9dda0';
config.autoParagraph = false;
config.enterMode = CKEDITOR.ENTER_BR;
CKEDITOR.on('instanceReady', function (ev) {
ev.editor.dataProcessor.writer.selfClosingEnd = '>';
});
};