Installing a GUI Text Editor in Drupal 7, TinyMCE and CKEditor Wysiwig

You are left high and dry with an initial install of Drupal 7 in terms of text editing.

You can add text and code to content text fields but there is no default GUI text editor which you do get with other CMS'es such as WordPress and Joomla. If the Drupal site is to be passed over to a client for content managing who has no experience with HTML or CSS then this is an absolute necessity. Possibly Drupal 8 will arrive with a default text editor as part of the core product. 

The initial install and configuration of the text editor can be a bit confusing and initmidating to a novice Drupal user but once your up and running that pain wil be history.

Which Text Editor

There are a many text editors out there, this guide will use TinyMCE and CKEditor, TinyMCE is the bundled editor in WordPress and Joomla and CKEditor is also a very popular choice, you can install both in Drupal - plus many more.

Install Wysiwig

The installation process requires a Drupal module and also the editors downloaded from their development home sites.

The key Drupal module you'll need is:

Wysiwig

Install this module into your site and enable it.

wysiwig-drupal-module

Install the Text Editors

Now download the text editors, download the latest stable releases:

TinyMCE

CkEditor

Unzip these and upload them to:

/public_html/yourdrupalsite/sites/all/libraries/

 

Configure the Text Editors

Once they are uploaded you then can configure the Wysiwig Module  - you can do this from the modules page as above or:

 
Home » Administration » Configuration » Content authoring » Wysiwyg profiles
 
assign-editor-to-text-format
Configure HTML and Plain Text Formats to use what editor. The last thing to do is to switch on what you want to see in the editor - click edit... then Buttons and Plugins and check box away:
 
configure-text-editor-display
 
Thats it you should now see a familiar GUI text editor for your input text fields, use the permissions screen to control what type of user can see them.
 
 

Tags: