WYSIWYG

Azarmeen Dastoor, Hinal Pithia, Manraj Sekhon and Uzair Vakani
 * WYSIWYG Editors in Drupal**

**CKEditor**

CKEditor is a WYSIWYG editor - meaning, the text that is viewed on screen can be modified to make it look exactly as it should when it is published. The CKEditor also allows for image and video integration, going beyond the average WYSIWYG editor. The CKEditor takes the form of two rows of toolbars where users can view their formatting palette and choose to modify their text accordingly with the click of a mouse.
 * What is CKEditor?**

Note: If you download the WYSIWYG module, you'll notice there are multiple types of editors you can install. The CKEditor is one of them.

//There's a few different ways of installing this module, but here's how we did it://
 * Installation Guide**
 * If you have the WYSIWYG module already enabled, make sure you disable it (preferably) before installing CKEditor since enabling both modules can cause problems! **
 * 1) Download Drupal's CKEditor module here. Install and enable the module.
 * 2) Download "CKEditor for Drupal 7" from here onto your computer.
 * 3) Extract the .zip archive and open up the folder, titled " ckeditor " (we'll call this " ckeditor[1] ").
 * 4) Open up the nested folder, also titled " ckeditor " (hereon referred as " ckeditor[2] " to avoid confusion) inside " ckeditor[1] ".
 * 5) Use your FTP client and go to **/public_html/sites/all/modules/ckeditor/ckeditor**. You should see only one file titled "COPY_HERE.txt". Go back to your downloaded " ckeditor[2] " folder, and copy all the files from here to the path specified above in the FTP client.
 * 6) In your downloaded copy of CKEditor, open up " ckeditor[1] " and copy the entire folder titled "ckfinder". In your FTP client, go a step back (**/public_html_sites/all/modules/ckeditor**) and paste "ckfinder" here.

Now you can add content using CKEditor with any article or basic page.

Besides the basic formatting of text, here's a list of unique features CKEditor has:
 * Features**
 * HTML code viewer
 * Form, checkbox and radio button add-ons
 * Image and Flash integration
 * Emoticon selection
 * iFrame generator
 * Block viewer

To add or remove features, go to Configuration > Content Authoring > CKEditor. Click on the appropriate profile and choose "edit". Then go to "Editor Appearance". In this section, you can also customize the background colour of the toolbar, choose what icons are placed in each row, and enable spellcheck as you type.

**TinyMCE**

**What is TinyMCE?**

TinyMCE is a WYSIWYG editor that has the ability to convert HTML text area fields to editor instances. TinyMCE is a platform-independent web-base d java script/HTML WYSIWYG editor control and has been released entirely in an open source format. TinyMCE can be applied for use across various content management open source systems such as Drupal and Wordpress.

Note: The TinyMCE module has been replaced by the Wsiwyg API, users should download the 'Wysiwyg API' as it integrates the TinyMCE editor within. According to the Drupal ,"You should only download the TinyMCE module if you are interested in modifying the actual editor itself"

**Installation Guide**

1. visit @http://drupal.org/project/wysiwyg to download the 'WYSIWYG' Module 2. Travel to the bottom of the page and download the '7. x -2.1' zipped folder and install it as a new module in Drupal 3. Enable the new WYSIWYG module. 4. Now visit @http://www.tinymce.com/download/download.php , 5.Using your FTP client, extract the archive and copy its contents into a new folder in the following location: sites/all/libraries/tinymce 6. the actual library can be found at: sites/all/libraries/tinymce/jscripts/tiny_mce/tiny_mce.js

**Features** - Embed image feature - spellcheck as you type - configurable dialog items in table plugins - Javascript plugin <span style="background-color: rgba(255,255,255,0.917969); color: #222222; font-family: arial,sans-serif;">- easy to integrate across various platforms