ICEfaces
  1. ICEfaces
  2. ICE-2767

Make inputRichText stylable and themeable

    Details

    • Type: Improvement Improvement
    • Status: Closed
    • Priority: Major Major
    • Resolution: Fixed
    • Affects Version/s: 1.7Beta1
    • Fix Version/s: 1.7RC1, 1.7
    • Component/s: ICE-Components
    • Labels:
      None
    • Environment:
      All

      Description

      It should be possible to apply CSS styleclass, style attributes to the inputRichText component, as well as have default theme CSS classes applied by the component renderer.

      Depending on how style-able the FCKeditor component is we should at least support setting the background color for the toolbar and editable region so it will fit in with any specific application color scheme better.

        Activity

        Hide
        Adnan Durrani added a comment -

        Just like a custom toolbarset the theme also needs to be defined in the fckconfig.js and currently we have some limitation to changing it dynamically.
        http://www.bitweaver.org/wiki/index.php?page_id=588&tk=bea0ce3999d89fd48f60&s5=1

        Show
        Adnan Durrani added a comment - Just like a custom toolbarset the theme also needs to be defined in the fckconfig.js and currently we have some limitation to changing it dynamically. http://www.bitweaver.org/wiki/index.php?page_id=588&tk=bea0ce3999d89fd48f60&s5=1
        Hide
        Ken Fyten added a comment -

        Is there at least a way to define the background color of the toolbar and editable text area? How difficult is it to customize the FCKeditor lib to pass these value through?

        Show
        Ken Fyten added a comment - Is there at least a way to define the background color of the toolbar and editable text area? How difficult is it to customize the FCKeditor lib to pass these value through?
        Hide
        Adnan Durrani added a comment -

        The FCKEditor allows to define the css file for the Editor area using the config file.

        Changing the style of the editor involves three steps:
        1- Copy the fckeditor/editor/css/fck_editorarea.css file from the FCKEditor distribution and place it into the web app and make the necessary changes to the copied file.

        2- Create a custom js file (e.g. CustomConfig.js) and make the following call into it.
        FCKConfig.EditorAreaCSS = 'http://'+ window.location.host '/'+window.location.pathname.split("/")[1]'path to the css file' ;

        Let say if the "fck_editorarea.css" file has been copied into the following folder "webroot/css", then the above call would look like this:
        FCKConfig.EditorAreaCSS = 'http://'+ window.location.host '/'+window.location.pathname.split("/")[1]'/css/fck_editorarea.css' ;

        3- No refer the custom config file using the customConfigPath attribute (e.g.)
        <ice:inputRichText customConfigPath ="CustomConfig.js"/>

        Show
        Adnan Durrani added a comment - The FCKEditor allows to define the css file for the Editor area using the config file. Changing the style of the editor involves three steps: 1- Copy the fckeditor/editor/css/fck_editorarea.css file from the FCKEditor distribution and place it into the web app and make the necessary changes to the copied file. 2- Create a custom js file (e.g. CustomConfig.js) and make the following call into it. FCKConfig.EditorAreaCSS = 'http://'+ window.location.host '/'+window.location.pathname.split("/") [1] 'path to the css file' ; Let say if the "fck_editorarea.css" file has been copied into the following folder "webroot/css", then the above call would look like this: FCKConfig.EditorAreaCSS = 'http://'+ window.location.host '/'+window.location.pathname.split("/") [1] '/css/fck_editorarea.css' ; 3- No refer the custom config file using the customConfigPath attribute (e.g.) <ice:inputRichText customConfigPath ="CustomConfig.js"/>
        Hide
        Adnan Durrani added a comment -

        *3- No = 3-Now

        Show
        Adnan Durrani added a comment - *3- No = 3-Now

          People

          • Assignee:
            Unassigned
            Reporter:
            Ken Fyten
          • Votes:
            0 Vote for this issue
            Watchers:
            0 Start watching this issue

            Dates

            • Created:
              Updated:
              Resolved: