Rich Text Editor (WYSIWYG) in CRM 2013

Question

Sometimes it is useful to have the HTML editor in CRM interface. It is possible to implement the editor directly to CRM 2013. As editor we will use ckeditor which allows to

Answer 1

1. Identify the field where you would like to use the rich text editor.

2. Create html-webresource which will define ckeditor. Go to Settings-Customizations-Customize the System-Web Resources.

3. In html editor of web resource, select the Source tab and insert the following code:

Note: As you can see, there are a few important sections

a) The following code loads the ckeditor and jquery from web so that they don't have to be installed on server.

b) Function getTextFieldName() which gets the name of target field where should be rich text editor placed. This information is obtained from query string. This will allow to use this web resource on multiple forms.

c) Initialization of ckeditor itself - setting the target field and properties of ckeditor. Also binding the editor with predefined textarea on the page.

4. Open the form designer on the form where you would like to use ​WYSIWYG editor. Create a text field with sufficient length (e.g. 100 000 chars) which will hold the html source code.

5. Insert the iframe on the form. As a webresource use the resource created in previous steps. Also define Custom Parameter(data) where you should define the name of the text field defined in step 4. In our situation we created new_bodyhtml text field so the parameter holds this value. This value is returned by the getTextFieldName() of the web resource.

6. Do not forget to save and publish all changes in CRM customization otherwise added webresources and updated form are not available.

7. That's all, here is example how it looks like: