Page 1 of 1

CKeditor 4.6 for OC 3 - Config Toolbars

Posted: Tue Sep 17, 2024 3:20 am
by michael2820
If U like me want to use CKEditor in Opencart 3. x, this post is for U. First you have to install it of course ;-) Then:
CKeditor 4.x Toolbar Buttons Configuration: I use this content in the file /admin/view/javascript/ckeditor/config.js
Be aware of the last 3 characters!
***************************

Code: Select all

/**
 * @license Copyright (c) 2003-2022, CKSource Holding sp. z o.o. All rights reserved.
 * For licensing, see https://ckeditor.com/legal/ckeditor-oss-license
 */

CKEDITOR.editorConfig = function( config ) {
	config.filebrowserWindowWidth = '800';
	config.filebrowserWindowHeight = '500';
	config.resize_enabled = true;

	config.htmlEncodeOutput = false;
	config.entities = false;
	config.allowedContent = true;
	config.extraPlugins = 'opencart,codemirror';
	config.codemirror_theme = 'monokai';
	
	config.toolbar = [
    { name: 'document', items: [ 'Source' ] },
	{ name: 'styles', items: [ 'Styles', 'Format', 'Font', 'FontSize' ] },
	{ name: 'colors', items: [ 'TextColor', 'BGColor' ] },
	{ name: 'paragraph', items: [ 'NumberedList', 'BulletedList', 'Outdent', 'Indent', 'Blockquote', 'JustifyLeft', 'JustifyCenter', 'JustifyRight', 'JustifyBlock' ] },
	{ name: 'links', items: [ 'Link', 'Unlink' ] },
	{ name: 'insert', items: [ 'Bwimage', 'Image', 'Table', 'HorizontalRule', 'Smiley', 'SpecialChar', 'Iframe' ] },
	]};

Re: CKeditor 4.6 for OC 3

Posted: Tue Sep 17, 2024 5:12 pm
by JNeuhoff
So what is the issue? OpenCart 3.0.4.0 uses the Summernote editor, not the CKEditor. If you are experiencing any problems with a CKEditor than you have to contact the extension author for this.

Re: CKeditor 4.6 for OC 3 - Config Toolbars

Posted: Tue Sep 17, 2024 7:00 pm
by michael2820
Neuhoff: I have edited my post

Re: CKeditor 4.6 for OC 3 - Config Toolbars

Posted: Tue Sep 17, 2024 7:01 pm
by michael2820
this is full config. Edit until you are happy :D

CKEDITOR.editorConfig = function( config ) {
config.skin = 'bootstrapck';
// Define changes to default configuration here. For example:
// config.language = 'fr';
// config.uiColor = '#AADC6E';
config.toolbar_Full =
[
{ name: 'document', items : [ 'Source','-','Save','NewPage','DocProps','Preview','Print','-','Templates' ] },
{ name: 'clipboard', items : [ 'Cut','Copy','Paste','PasteText','PasteFromWord','-','Undo','Redo' ] },
{ name: 'editing', items : [ 'Find','Replace','-','SelectAll','-','SpellChecker', 'Scayt' ] },
{ name: 'forms', items : [ 'Form', 'Checkbox', 'Radio', 'TextField', 'Textarea', 'Select', 'Button', 'ImageButton',
'HiddenField' ] },
'/',
{ name: 'basicstyles', items : [ 'Bold','Italic','Underline','Strike','Subscript','Superscript','-','RemoveFormat' ] },
{ name: 'paragraph', items : [ 'NumberedList','BulletedList','-','Outdent','Indent','-','Blockquote','CreateDiv',
'-','JustifyLeft','JustifyCenter','JustifyRight','JustifyBlock','-','BidiLtr','BidiRtl' ] },
{ name: 'links', items : [ 'Link','Unlink','Anchor' ] },
{ name: 'insert', items : [ 'Image','Flash','Table','HorizontalRule','Smiley','SpecialChar','PageBreak','Iframe' ] },
'/',
{ name: 'styles', items : [ 'Styles','Format','Font','FontSize' ] },
{ name: 'colors', items : [ 'TextColor','BGColor' ] },
{ name: 'tools', items : [ 'Maximize', 'ShowBlocks','-','About' ] }
];

config.toolbar_Basic =
[
['Bold', 'Italic', '-', 'NumberedList', 'BulletedList', '-', 'Link', 'Unlink','-','About']
];
};

Re: CKeditor 4.6 for OC 3 - Config Toolbars

Posted: Tue Sep 17, 2024 7:38 pm
by JNeuhoff
Ah, OK, thanks for sharing this code on this forum.