Forums

Home / Developer Network / Forums / Sitefinity Older Versions (3.x): Designing with Sitefinity > Apply CSS Class Dropdown

• Tim

  Posted on Aug 24, 2011 (permalink)

  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" />
  </tools>
  <classes>
    <class name="Clear Class" value="" />
    <class name="Footnote" value=".FootNote" />
    <class name="Footnote Two" value=".FootNoteTwo" />
  </classes>
  
  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; }
  

  Reply

• Stanislav Velikov Stanislav Velikov

  Posted on Aug 29, 2011 (permalink)

  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)

          {

              this.editControl.CssFiles.Add("~/ControlTemplates/StyleSheet1.css");

          }

  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:
  

  </tools>

      <classes>

          <class name="Clear Class" value="" />

          <class name="Links Class" value="a.link" />

          <class name="Images Class" value=".img" />

          <class name="My Red Text" value=".text" />

          <class name="My Pink Text" value=".pinktext" />

      </classes>

  
  
  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 >>

  Reply

Home / Developer Network / Forums / Sitefinity Older Versions (3.x): Designing with Sitefinity > Apply CSS Class Dropdown