In this article I will give you a step-by-step guide on how to improve the CKEditor in Elgg 1.12Overview

Elgg used to implement TinyMce as a WYSIWYG text editor. After several suggestions done by users, Elgg now comes with CKEditor. However, just like its predecessor it comes with basic text editing tools. That’s why today we are going to learn how to add more features to CKEditor.

Getting Started

1. Download CKEditor Extended from the elgg community. Choose the 1.11 version:

2. Upload & Install the plugin. If you don’t know how to do this, please read this article.

3. Log into your elgg network wit your Administrator account and open the Admin Dashboard:

4. Go to menu “Configure -> Plugins“. Find the CKEditor Extended plugin and activate it:

5. Before using CKEditor Extended, we need to configure its additional settings. Go to menu “Configure -> Settings -> CKEditor Extended“:

6. Here comes a tricky part. The plugin offers a standard set of options that are good but not enough. What you need to do to enable all options is the following. Remove everything from this text box:

7. Paste the code below and save the changes:

toolbar: [['Bold', 'Italic', 'Underline'], [Cut','Copy','Paste','PasteText','PasteFromWord','-','Undo','Redo','Find','Replace','-','SelectAll','-','SpellChecker', 'Scayt','-','Blockquote','CreateDiv',
	'-','JustifyLeft','JustifyCenter','JustifyRight','JustifyBlock','-','BidiLtr','BidiRtl']],
removeButtons: 'Subscript,Superscript', // To have Underline back
allowedContent: true,
baseHref: elgg.config.wwwroot,
removePlugins: 'contextmenu,tabletools,resize',
defaultLanguage: 'en',
language: elgg.config.language,
skin: 'moono',
uiColor: '#EEEEEE',
contentsCss: elgg.get_simplecache_url('css', 'elgg/wysiwyg.css'),
disableNativeSpellChecker: false,
disableNativeTableHandles: false,
removeDialogTabs: 'image:advanced;image:Link;link:advanced;link:target',
autoGrow_maxHeight: $(window).height() - 100,

8. Now the CKEditor will look like this:

9. And that’s it! Now you have an extended CKEditor.

This Concludes Improve CKEditor in elgg

Looking for quality Elgg Hosting? Look no further than Arvixe Web Hosting!

Happy Hosting!

Rodolfo Hernandez