Solved

CKEditor - will not function

Posted on 2016-10-28
7
35 Views
Last Modified: 2016-10-31
Hi,

I have custom-built a standard version of CKeditor with plugins, downloaded and installed.

When I try to use it, it doesn't work; the editor does not show at all.  The console log is attached.

This is my call...

<script type="text/javascript">
	CKEDITOR.replace( 'txtBody',
    {
        /*extraplugins: 'youtube',*/
		//uiColor : '#F90',
        uiColor : '#FC0',
		//toolbar : 'Basic',
		//toolbar : 'FOBG',
		on :
		{
			instanceReady : function( ev )
			{
				this.dataProcessor.writer.setRules( 'p',
					{
						indent : false,
						breakBeforeOpen : false,
						breakAfterOpen : false,
						breakBeforeClose : false,
						breakAfterClose : false
					});
			}
		}
    });
</script>

Open in new window


and my config.js:
/**
 * @license Copyright (c) 2003-2016, 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: 'clipboard',   groups: [ 'clipboard', 'undo' ] },
		{ name: 'editing',     groups: [ 'find', 'selection', 'spellchecker' ] },
		{ name: 'links' },
		{ name: 'insert' },
		{ name: 'forms' },
		{ name: 'tools' },
		{ name: 'document',	   groups: [ 'mode', 'document', 'doctools' ] },
		{ name: 'others' },
		'/',
		{ name: 'basicstyles', groups: [ 'basicstyles', 'cleanup' ] },
		{ name: 'paragraph',   groups: [ 'list', 'indent', 'blocks', 'align', 'bidi' ] },
		{ name: 'styles' },
		{ name: 'colors' },
		{ name: 'about' }
	];

	// 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';
};

Open in new window


Without plugins it works OK.

Can anyone tell me what the problem is please?

Cheers,

  Col
localhost-1477669786439.log
0
Comment
Question by:colinspurs
  • 4
  • 3
7 Comments
 
LVL 108

Expert Comment

by:Ray Paseur
ID: 41864162
0
 
LVL 3

Author Comment

by:colinspurs
ID: 41864181
Not really Ray.  They don't seem to have found an answer either, and a search for Aggregate CKeditor.js seems to bring up Drupal-related issues only, and I'm not using that.

Since the plugin-free build works, maybe I could debug by adding one plugin at a time and seeing which one causes the issue.  

On the subject of plugins, do I have to create a new build each time or could I just add a plugin folder from another build into my current one?  I know I have to enable plugins after adding them but the editor should still work even if the plugins don't.

It's been a tough week, all I seem to have been doing is chasing down problems of one kind or another.
0
 
LVL 108

Accepted Solution

by:
Ray Paseur earned 500 total points
ID: 41864224
...plugin-free build works, maybe I could debug by adding one plugin at a time...
That is exactly what I would do!  But since this appears that it may be related to a missing path, if the first plug-in you try fails, take it out and try another plug-in.  It may have something to do with the paths to the plug-ins, and if that's the case, it's likely any plug-in could fail.
1
IT, Stop Being Called Into Every Meeting

Highfive is so simple that setting up every meeting room takes just minutes and every employee will be able to start or join a call from any room with ease. Never be called into a meeting just to get it started again. This is how video conferencing should work!

 
LVL 3

Author Comment

by:colinspurs
ID: 41864309
I've had another play without success...will revisit Monday.  Cheers.
0
 
LVL 108

Expert Comment

by:Ray Paseur
ID: 41864313
Have a good weekend.
1
 
LVL 3

Author Comment

by:colinspurs
ID: 41866982
this appears that it may be related to a missing path, if the first plug-in you try fails, take it out and try another plug-in.  It may have something to do with the paths to the plug-ins, and if that's the case, it's likely any plug-in could fail

I reinstalled a vanilla version, then added one plugin that would be very useful to me.  I used CKEditor's CKbuilder app.  Running CKEditor thereafter showed a lot of bugs with the plugin.  including missing files and incorrect paths, as you indicated Ray.

After my debugging skills ran out I contacted the plugin author who advised downloading the plugin direct, as "CKbuilder has a lot of bugs relating to not loading all files".  I have done this and this particular plugin works OK.

So the moral is, try one plugin at a time, and don't use CKbuilder if it can be avoided.

Cheers
0
 
LVL 3

Author Closing Comment

by:colinspurs
ID: 41866989
With missing files as a clue, I found the errors in the plugin's PHP code, contacted the author, downloaded the plugin directly and all seems OK.

Thanks.
0

Featured Post

Free Trending Threat Insights Every Day

Enhance your security with threat intelligence from the web. Get trending threat insights on hackers, exploits, and suspicious IP addresses delivered to your inbox with our free Cyber Daily.

Join & Write a Comment

This is a PowerShell web interface I use to manage some task as a network administrator. Clicking an action button on the left frame will display a form in the middle frame to input some data in textboxes, process this data in PowerShell and display…
JavaScript can be used in a browser to change parts of a webpage dynamically. It begins with the following pattern: If condition W is true, do thing X to target Y after event Z. Below are some tips and tricks to help you get started with JavaScript …
In this tutorial viewers will learn how to embed Flash content in a webpage using HTML5. Ensure your DOCTYPE declaration is set to HTML5: "<!DOCTYPE html>": Use the <object> tag to embed Flash content.: To specify that the object is Flash content, d…
The viewer will learn how to use and create keystrokes in Netbeans IDE 8.0 for Windows.

747 members asked questions and received personalized solutions in the past 7 days.

Join the community of 500,000 technology professionals and ask your questions.

Join & Ask a Question

Need Help in Real-Time?

Connect with top rated Experts

12 Experts available now in Live!

Get 1:1 Help Now