CKEDITOR And Styles configuration with only toolbar

Question

I try to configure CKEDITOR in Oracle Framework "Endeca v 11.1.0" but something is wrong. I can only configure toobar like this :

[
{ name: 'basicstyles', groups: [ 'basicstyles', 'cleanup' ], items: [ 'Bold', 'Italic', 'Underline', 'Strike', 'Subscript', 'Superscript', '-', 'RemoveFormat' ] },
'/',
{ name: 'styles', items: [ 'Styles', 'Format', 'Font', 'FontSize' ] },
{ name: 'colors', items: [ 'TextColor', 'BGColor' ] },
{ name: 'tools', items: [ 'Maximize', 'ShowBlocks' ] },
{ name: 'others', items: [ '-' ] },
{ name: 'about', items: [ 'About' ] }
];

and i cannot configure styles like i want. By default i have sur styles of ckeditor and it is normal. i have not set a good style.js with good configuration.

I want to configure specific style and i have read somes documentation like this : http://docs.ckeditor.com/#!/guide/dev_styles but how can i do that in my configuration :

CKEDITOR.stylesSet.add( 'my_styles', [
// Block-level styles
{ name: 'Blue Title', element: 'h2', styles: { 'color': 'Blue' } },
{ name: 'Red Title' , element: 'h3', styles: { 'color': 'Red' } },
// Inline styles
{ name: 'CSS Style', element: 'span', attributes: { 'class': 'my_style' } },
{ name: 'Marker: Yellow', element: 'span', styles: { 'background-color': 'Yellow' } }
]);

How can i set specific style in toolbar configuration only ?? Thx for help

Answer 1

In 11.1, configuration file location of CK Editor has been changed. It is moved inside a .jar. Check ToolsAndFrameworks\11.1.0\server\workspace\state\sling_ifcr-11.1.0\startup\25\richTextEditor-11.1.0.jar file for build-config.js

Answer 2

Thx for your answer.

My action :

• extract war file "ifcr-11.1.0.war" in "/ToolsAndFrameworks/11.1.0/server/webapps/ifcr-11.1.0.war"
• extract "richTextEditor-11.1.0.jar" in "icfr-11.1.0/WEB-INF/resources/bundles/25"
• make modification on file "richTextEditor-11.1.0/content/ckeditor_4.3.3_full/ckeditor/style.js" for my specific style.

I have open build-config.js but i can't see config for styles.

• i have rebuild package richTextEditor-11.1.0.jar and ifcr-11.1.0.war and restart tomcat and i can't see modification on ToolsAndFrameworks\11.1.0\server\workspace\state\sling_ifcr-11.1.0\startup\25\richTextEditor-11.1.0.jar.

• i have try to delete all files and folder on ToolsAndFrameworks\11.1.0\server\workspace\state\sling_ifcr-11.1.0\startup* and restart tomcat for deploying artifact and other but my folder "ToolsAndFrameworks\11.1.0\server\workspace\state\sling_ifcr-11.1.0\startup\" is empty.

• A crazy thing is my webapp run with succes without this folder and files.

• are there a cache or other ?

Answer 3

I'm going to give advice that you might not find helpful :) Instead of creating a custom editor for use within Experience Manager (and then having to maintain that during upgrades, etc), it might be better instead to give them an editor UI completely separate from XM. Then, when they have their nice HTML to copy and paste it into XM.

Another idea: Instead of creating a Flex editor directly (like what you're doing), create a light-weight Flex editor that launches a popup window (where that would be a webapp hosted outside of XM directly). Then have that popup window return a block of HMTL as text. This would allow you to create a fancy editor but not be constrained by Flex.

I can't share a full code example for my second recommendation, but in Flex you can open a popup windoww by doing:

 ExternalInterface.call("window.open",
       popupUrl, "Select Value",
       "menubar=1,resizeable=1,width=1000,height=800,location=yes,menubar=yes,scrollbars=1,toolbar=1");

... where popupUrl would be the URL of your exteranl web app.

Then, in the webapp, when you want to pass back a value, you can do:

windowOpener = window.opener.document.xmgrSwfElement;
windowOpener.selectValue(path);
window.close();