Installing Drupal TinyMCE 3.5.8

Warning

Note that the instructions to install the TinyMCE editor provided by the “Wysiwyg” module (as specified under “Configure” or at “Configuration” => “Content Authoring” => “Wysiwyg Profiles”) are not correct: you are asked to download TinyMCE from URL “https://www.tinymce.com/download/”, but the current version, version 4, is not supported by Drupal 7 at present.

Download TinyMCE 3.5.8

First, install the "Wysiwyg" editor integration module, “wysiwyg-7.x-2.2”.

Navigate to the TinyMCE archive at URL:

http://archive.tinymce.com/download/older.php

Scroll down to locate “TinyMCE 3.5.8”. Click in the “Prod” link to download file “tinymce_3.5.8.zip” (Figure 1):

Figure 1 - Download TinyMCE

Install TinyMCE 3.5.8

Navigate to folder “C:\Bitnami\drupal-7.43-0\apps\drupal\htdocs\sites\all\libraries”. Copy file “tinymce_3.5.8.zip” to this folder and unzip it. The folder will now contain a folder called “tinymce_3.5.8”, within which will be another folder called “tinymce”. Copy folder “tinymce” and all of its subfolders to the “libraries” folder. The “libraries” folder should now contain the following "tinymce" files and folders (Figure 2):

Figure 2 - Libraries Folder

Delete file “tinymce_3.5.8.zip” and folder “tinymce_3.5.8” from the “libraries” folder.

Login to Drupal as an administrator and click on the “Configuration” menu. Within the “Content Authoring” section click on the “Wysiwyg Profiles” link (Figure 3):

Figure 3 - Editor Configuration

For each text format that you wish to be edited using the TinyMCE editor, select “TinyMCE 3.5.8” from the “Editor” dropdown and then press the “Save” button at the bottom of the page.

Figure 4 - Assign Text Formats

Once the editor is assigned to a text format, an “Edit” link will appear on the right under the “Operations” header. Click on each “Edit” link in turn. Click on the “Buttons and Plugins” link to show the functions that can be enabled for the editor (Figure 5):

Figure 5 - Editor Functions

Click on all the checkboxes for which the editor functionality is required. If you’re unsure, then it’s best to enable all functions other than “BBCode” (Figure 6).

Figure 6 - Enable Selected Functions

Note that “BBCode” (Bulletin Board Code) is a simplified mark-up language that is sometimes used to format message board posts, and which is translated into a subset of HTML before the corresponding web page is published. In general, the “BBCode” function should be disabled as it doesn't support the full HTML specification (it also requires additional configuration settings to work correctly). If it is enabled, then certain common functionality, such the embedding of images within web pages, won’t work correctly.

At the bottom of the page press the “Save” button.

Verify Installation

Click on the “Home” menu icon and then click the “Add New Content” link under the “Welcome” header (Figure 7):

Figure 7 - Default Home Page

When the “Add Content” page appears, click on the “Basic Page” Link (Figure 8):

Figure 8 - Create Home Page Content

When the “Create Basic Page” appears, select a text format for which you have configured the TinyMCE editor from the “Text Format” dropdown. The editor icons corresponding to the set of editor functions that you enabled will be shown at the top of the “Body” text area (Figure 9):

Figure 9 - Editor Icons

Everything Open-Source

Home

Everything Open-Source