How do I pass in config info to CKEditor using the jQuery adapter?
I'm using the latest CKeditor with jQuery adapter.
I have successfully got it to work, and display.
However, as I am completely new to CKeditor, how do I pass in config variables using the jQuery method?
This is what I've got
$( '#i开发者_如何学JAVAnput-content' ).ckeditor('', {
toolbar: 'basic'
});
I think from what I've read, the first argument is meant to be a callback, and the 2nd the config. But doing this has not changed the editor at all.
How do I use these config properties etc using the jQuery adapter?
I have accomplished this using this code. Hopefully this helps.
Here is the html:
<textarea id="txtMessage" class="editor"></textarea>
and here is the javascript:
try {
var config =
{
height: 180,
width: 515,
linkShowAdvancedTab: false,
scayt_autoStartup: true,
enterMode: Number(2),
toolbar_Full: [['Styles', 'Bold', 'Italic', 'Underline', 'SpellChecker', 'Scayt', '-', 'NumberedList', 'BulletedList'],
['Link', 'Unlink'], ['Undo', 'Redo', '-', 'SelectAll']]
};
$('textarea.editor').ckeditor(config); }
I passed an empty function...
$('textarea#my').ckeditor($.noop, {
property: 'value'
});
jQuery(function(){
var config = {
toolbar:
[
['Bold', 'Italic', 'Underline', '-', 'NumberedList', 'BulletedList', '-', 'Undo', 'Redo', '-', 'SelectAll'],
['UIColor']
]
};
jQuery('#textAreaElement').ckeditor(config);
});
var config = {
toolbar:
[
['Source','-','Save','NewPage','Preview','-','Templates'],
['Maximize', 'ShowBlocks','-','About']
],
coreStyles_bold: { element : 'b', overrides : 'strong' }
};
Simply add the respective config object, above I added coreStyles_bold, All I did is change the "=" from the CK API documentation to a ":"
$(document).ready(function(){
$('.reply').click(
function(event){
// Event click Off Default
event.preventDefault();
// CKEditor
$(function(){
var config = {toolbar:[['Bold', 'Italic', '-', 'Link', 'Unlink']]};
//<?php /*echo"var config = {toolbar:[['Bold', 'Italic', '-', 'Link', 'Unlink']]};" ;*/ ?>
// DOM class = "cke"
$('textarea.cke').ckeditor(function(){}, config);
});
return false;
});
});
There is an official documentation for it, see jQuery Adapter
The ckeditor() method accepts two optional parameters:
- A callback function to be executed when the editor is ready.
- Configuration options specific to the created editor instance:
$( 'textarea' ).ckeditor({ uiColor: '#9AB8F3' });
Not sure if this is a new feature of CKEDITOR, but just want to share my solution (in case it helps anyone looking for this now):
$("textarea.youreditor").ckeditor
(
{
customConfig: "/path/to/custom/config.js"
}
);
... and my config looks like this (simply copied the default config.js):
CKEDITOR.editorConfig = function(config)
{
config.toolbar_Full =
[
{ name: 'basicstyles', items : [ 'Bold','Italic','Underline','Strike','Subscript','Superscript','-','RemoveFormat' ] },
{ name: 'paragraph', items : [ 'NumberedList','BulletedList','-','Outdent','Indent','-','JustifyLeft','JustifyCenter','JustifyRight','JustifyBlock'] },
{ name: 'insert', items : [ 'Image','Flash','Table','HorizontalRule','Smiley','SpecialChar','PageBreak','Iframe' ] },
{ name: 'colors', items : [ 'TextColor','BGColor' ] }
];
};
精彩评论