More in this section
Forums / Designing with Sitefinity / Apply CSS Class Dropdown

Apply CSS Class Dropdown

The forums are in read-only mode. In case that you want to directly contact the Progress Sitefinity team use the support center. In our Google Plus group you can find more than one thousand Sitefinity developers discussing different topics. For the Stack Overflow threads don’t forget to use the “Sitefinity” tag.
2 posts, 0 answered
  1. Tim
    Tim avatar
    1 posts
    06 May 2009
    24 Aug 2011
    Link to this post
    I've looked at several different threads and tried to add styles to this dropdown but I'm not having any luck.  Here are the modifications I've made pasted in below.  The only thing I've accomplished is to get the Apply CSS dropdown to show.

    File:  \Sitefinity\Admin\ControlTemplates\EditorToolsFile.xml
    <tools name="DropdownToolbar" dockable="false">
      <tool name="FormatBlock"/>
      <tool name="ApplyClass"/>
      <tool name="FormatStripper"/>
      <tool name="ToggleScreenMode" />
      <class name="Clear Class" value="" />
      <class name="Footnote" value=".FootNote" />
      <class name="Footnote Two" value=".FootNoteTwo" />

    File: \Sitefinity\Admin\Themes\Default\AjaxControlsSkins\Sitefinity\EditorCssFile.css
    .FootNote { color: Red; }
    .FootNoteTwo { color: Blue; }

    File: \Sitefinity\Admin\Themes\Default\AjaxControlsSkins\Sitefinity\EditorContentArea.css
    .FootNote { color: Red; }
    .FootNoteTwo { color: Blue; }

  2. Stanislav Velikov
    Stanislav Velikov avatar
    1113 posts
    18 Sep 2017
    29 Aug 2011
    Link to this post
    Hello Tim,

    To add a class the Apply Css dropdown create a stylesheet file reference it in the Editor codefile:
    protected void Page_Load(object sender, EventArgs e)
    In the toolsFile, you can just add the ApplyClass tool:
    <tool name="ApplyClass" />
    and if you want to customize the way your custom CSS classes are listed in the dropdown, you can achieve this by adding a <classes> section in the toolsfile as well:
            <class name="Clear Class" value="" />
            <class name="Links Class" value="" />
            <class name="Images Class" value=".img" />
            <class name="My Red Text" value=".text" />
            <class name="My Pink Text" value=".pinktext" />

    All the best,
    Stanislav Velikov
    the Telerik team

    Thank you for being the most amazing .NET community! Your unfailing support is what helps us charge forward! We'd appreciate your vote for Telerik in this year's DevProConnections Awards. We are competing in mind-blowing 20 categories and every vote counts! VOTE for Telerik NOW >>

2 posts, 0 answered