Ben Langhinrichs

Photograph of Ben Langhinrichs

IBM Champion logo

E-mail address - Ben Langhinrichs







Recent posts

Fri 28 Sep 2018

We need more than baby steps



Thu 27 Sep 2018

BOGO Benefit - AppsFidelity



Thu 20 Sep 2018

BOGO Servers (to celebrate Domino 10)


October, 2018
SMTWTFS
 01 02 03 04 05 06
07 08 09 10 11 12 13
14 15 16 17 18 19 20
21 22 23 24 25 26 27
28 29 30 31

Search the weblog





























Genii Weblog

CKEditor #2 - Use in Classic Domino web design

Thu 7 Jun 2018, 10:44 AM



by Ben Langhinrichs
This is the second in a series of short posts on configuring CKEditor which is used by default in XPages for rich text fields. In this, I will show how CKEditor can be added to a Classic web application on Domino, and how  to make the same toolbar changes as I showed in the first article in the series
 
1) Add links to CKEditor in the HTMLHeadContent 
For reason that become clear laters, I create a computed field called HTMLBodyContent on a subform which has the rich textb field and CKEditor parts, and then include that field in the HTMLHeadContent section of the form which includes the subform.
 
Inline JPEG image
 
Inline JPEG image
 
 
2) Add code to activate CKEditor to the JS Header 
On the subform with the rich text field and HTMLBodyContent field, I add content to the JS Header section. The most important part is circled.
 
Inline JPEG image
 
 
3) See the results on the web using the default toolbar from config.js
This uses the default toolbar defined in the config.js file in the CKEditor directory on your server. (In another article, we will discuss how this can be replaced with a custom configuration.) I cut off the part of the toolbar for purpose of display on this blog.
 
Inline JPEG image
 
 
4) Modify JS Header to create a custom toolbar 
In the doLoadCKEditor function, add extra parameters as shown here. I set the skin to use and the toolbar, but other parameters can be set using this same format.
 
Inline JPEG image
 
 
5) See the results on the web using the custom toolbar
Always remember to clear the browser cache after each change, a otherwise you won't see the changes when you expect.
 
Inline JPEG image
 
All topics in the series
CKEditor - customizing and empowering the toolbar (intro)
CKEditor #1 - Basic toolbar configuration
CKEditor #2 - Use in Classic Domino web design
 

Copyright © 2018 Genii Software Ltd.

What has been said:

No documents found

Have your say:

Name *:
E-mail:
e-mail addresses will not be displayed on this site
Comment *:


<HTML is not allowed>
Linking: Add links as {{http://xxx|title}}, and they will be activated once approved
Blocked? Unable to post a comment? Please read this for a possible explanation...