[CLOSED] Setting a theme for HtmlEditor on the client

  1. #1

    [CLOSED] Setting a theme for HtmlEditor on the client

    Hi,

    I've been sifting through various threads on this forum trying to find the pattern to apply a standard theme to HtmlEditor control on the client. So far, no luck. When I use

    Ext.net.ResourceMgr.setTheme(result, skinName);
    on the page, it doesn't affect the HtmlEditor style, probably because it renders an iframe element on the page.

    There's another approach that I've found out there:

    var editorBody = htmlEditor.getEditorBody();
    var styles = {};
    styles["color"] = "#696969";
    Ext.DomHelper.applyStyles(editorBody, styles);
    Although it works, it requires setting all the CSS rules locally instead of simply applying a class. Also, I'm not sure why HtmlEditor has to be treated differently than any other controls on the page. Am I missing anything here? Please suggest the proper method to deal with the issue at hand.
    Last edited by Baidaly; Nov 27, 2013 at 12:17 PM. Reason: [CLOSED]
  2. #2
    Hi @vadym.f,

    A setTheme call affects to an HtmlEditor for me. At least, its toolbar's appearance changes.

    Does it not change for you? If so, please provide a test case.

    Or do you expect any more styling applied to HtmlEditor? If so, please clarify what exactly.
  3. #3
    Hi Daniil,

    Yes, there's no issue with the toolbar. It's the editor itself that doesn't seem to be affected by the changing theme when a call to Ext.net.ResourceMgr.setTheme() is made.
  4. #4
    The editor's content? Could you, please, point me what should be themed with a screenshot?
  5. #5
    Hi Daniil,

    Here's a fragment of my code. I have designated CSS rules for HtmlEditors but have to apply them separately when changing the theme on the client. It's working fine but I'm curious if there's any way not to worry about providing HtmlEditors a special treatment of this kind. Please let me know if you require more info.

    var editorBody = htmlEditor.getEditorBody();
    var styles = {};
    switch (Ext.net.ResourceMgr.theme) {
              case "blue":
                      styles["background-color"] = "#F2F6FB !important";
                      break;
              case "gray":
                      styles["background-color"] = "#F9F9F9 !important;";
                      break;
              case "slate":
                      styles["background-color"] = "#F1F5F6 !important";
                      break;
    }
    Ext.DomHelper.applyStyles(editorBody, styles);
  6. #6
    Hello!

    As HtmlEditor is a editable browser's window with own context it cannot know anything what you change in parent context, so you need to do it manually and your solution is good for this case.
  7. #7
    Thanks for the insight! It seems to me there're no shortcuts here :) Please mark this question as resolved.

Similar Threads

  1. [CLOSED] Problem changing the Theme on the client side
    By vadym.f in forum 2.x Legacy Premium Help
    Replies: 4
    Last Post: Aug 02, 2013, 12:41 PM
  2. Setting Theme
    By kumarxlnt in forum 1.x Help
    Replies: 1
    Last Post: Oct 21, 2009, 10:21 AM
  3. Replies: 5
    Last Post: Jan 27, 2009, 10:19 AM
  4. [CLOSED] Error while setting theme in web.config
    By Jurke in forum 1.x Legacy Premium Help
    Replies: 5
    Last Post: Nov 25, 2008, 6:54 AM
  5. Replies: 2
    Last Post: Feb 20, 2008, 6:05 AM

Tags for this Thread

Posting Permissions