Configure HTML Rich Text Editor in CRM

CK editor

Recently, i added RichText Editor in MS CRM by supported way, thus thought that let’s share it.

Adding RichText editor in MS CRM is very easy. I used a solution i found on code share and modified that as per my requirements. Here are the steps to add that in MS CRM,

  1. We can convert simple multiline text field to HTML rich Text field here are the steps for it
  2. I already got a solution on Soho blog, I just customized as per my requirements
  3. You can download it from here HTMLEditor_1_1_0_0_managed.zip / HTMLEditor_1_1_0_0.zip (its look like PDF, but it’s a CRM solution zip, I used this way because WordPress not allows to upload zip files.  ;))
  4. Import this solution into CRM org
  5. Create a new HTML web resource  with following code

 

<!DOCTYPE html>

<html xmlns=”http://www.w3.org/1999/xhtml”&gt;

<head>

<title></title>

http://../WebResources/mag_/htmleditor/ckeditor.js

http://ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js

 

CKEDITOR.timestamp = null;

var Xrm;

$(document).ready(function () {

var Xrm = parent.Xrm;

var voeb_eckdaten = Xrm.Page.getAttribute(“description”).getValue();

document.getElementById(‘editor1’).value = voeb_eckdaten;

CKEDITOR.instances.editor1.on(‘blur’, function () {

var value = CKEDITOR.instances.editor1.getData();

Xrm.Page.getAttribute(“description”).setValue(value);

});

});

</head>

<body>

<textarea class=”ckeditor” cols=”80″ id=”editor1″ name=”editor1″ rows=”10″></textarea>

</body>

</html>

 

Now, lets add it on form

  1. Open CRM form editor, add a section and insert  newly created web resource

r1

r2

r3

Save and publish the changes

Refresh your CRM from, our new HTML rich text will look like this, ref below image ..

r4

  1. In above code, ‘description’ is a attribute on CRM form where we are going to store our HTML formatted text.
  2. This will implement basic functionality, ref above image
  3. All this has been developed using ‘CK Editor’, you may download it from here ,Download basic pack, we will customize this
  4. Let say, I want underline functionality as well in basic CK Editor solution then just open your saved folder  ‘ckeditor_4.5.9_basic’ >> ckeditor  >> samples >> index.html
  5. CK1
  6. Now, click on ‘Toolbar Configurator’, it will gives you a visual code editor, it will helps you to configure command ribbon as per your wish.
  7. From ‘sample’ folder open ‘index.html’
  8. CK2
  9. Click ‘Toolbar Configurator’, it will lead to next window, as shown below
  10. CK3
  11. Check / Uncheck the feature from view and click on ‘Get toolbar config’, your configuration code is ready as shown below
  12. CK4
  13. Just copy this code and open ‘Configuration’ file from CRM solution (which has been imported earlier ) and pest this configuration and publish the changes.
  14. In similar way, we can configure standers and full version of CK editor.
  15. We can make CK Editor read only / editable by condition as well
  16. That’s it.

thanks.

 

Hope  it will help.

Advertisements

One thought on “Configure HTML Rich Text Editor in CRM

  1. Pingback: Make Rich text editor read only | CRM Practice

Leave a Reply

Fill in your details below or click an icon to log in:

WordPress.com Logo

You are commenting using your WordPress.com account. Log Out / Change )

Twitter picture

You are commenting using your Twitter account. Log Out / Change )

Facebook photo

You are commenting using your Facebook account. Log Out / Change )

Google+ photo

You are commenting using your Google+ account. Log Out / Change )

Connecting to %s