+1-888-365-2779
Try Now
More in this section

Forums / Designing with Sitefinity / Custom CSS in editor drop down

Custom CSS in editor drop down

34 posts, 0 answered
  1. Meister
    Meister avatar
    262 posts
    Registered:
    09 Nov 2007
    04 Feb 2008
    Link to this post
    i've followed the example here to change the editor so it displays custom CSS classes i can use
    http://www.sitefinity.com/support/forums/support-forum-thread/b1043S-bachag.aspx

    however, the classes dropdown is empty
    Is there another guide i can follow which may help?
  2. Nikifor
    Nikifor avatar
    232 posts
    Registered:
    18 May 2013
    06 Feb 2008
    Link to this post
    Hello Quade,

    By default, Generic Content uses the CSS classes available in the current page. However, it can be configured to load external CSS files instead. So it is best to put your styles in an external .css file (e.g. Styles1.css) and specify the path to it in the \Sitefinity3.1\WebSites\[YourProject]\Sitefinity\Admin\ControlTemplates\Generic_Content\EditorTemplate.ascx like this:

    <radE:RadEditor runat="server" ID="RadEditor1"
        ConfigFile="~/Sitefinity/Admin/ControlTemplates/EditorConfigFile.xml"
        CssFiles="~/Styles1.css"
        SkinsPath="~/Sitefinity/Admin/Themes/Default/Skins/Editor/"
        Skin="Sitefinity" ConvertFontToSpan="true" ConvertToXhtml="true" NewLineBr="false"
        Height="360px" Width="98%">

    Then edit the
     
    \Sitefinity3.1\WebSites\[YourProject]\Sitefinity\Admin\ControlTemplates\EditorToolsFile.xml to display the Apply CSS Class dropdown:

    <tool name="ApplyClass" enabled="true"/>

    Finally, in the same file, add your classes to the classes collection to populate the Apply CSS dorpdown as shown below.

    <classes>
       <class name="Links class" value="a.link" />
       <class name="Images class" value="
    .img" />
    </classes>

    You could find more information in the RadEditor online help (Toolbars and DropDowns sections). We would recommend the following RadEditor articles:

    1. CSS Styles
    2. External CSS Files
    3. Using CSS Styles


    Hope this helps. Do let us know if you need any further assistance.

    All the best,
    Nikifor Hristov
    the Telerik team

    Instantly find answers to your questions at the new Telerik Support Center
  3. amckell
    amckell avatar
    4 posts
    Registered:
    19 Jul 2007
    11 Feb 2008
    Link to this post

    I've seen this example in several threads, and I think there may be an issue/bug with using external styles to populate the Apply Styles dropdown.  If I have a style ".link" and I add it to the EditorToolsFile.xml as <class name="link" value=".link" />, I will see it show in the dorpdown like it should.  However, this example lists a style of "a.link" added to the EditorToolsFile.xml as <class name="Links class" value="a.link" />. I have found that using a value like this in an external stylesheet will NOT be reflected in the dropdown.  Am I doing something incorrectly?


    Also, I have the EditorTemplate CssFiles property pointed at my external stylesheet.  I was under the impression that if I do not list any <class> elements in the EditorToolsFile.xml, the Apply Style dropdown will be populated with all styles in the external stylesheet.  I do see many styles appear from my stylesheet, but there are also RadEditor styles that appear.  Is there a way to filter out those Rad styles so the dropdown gets populated with only styles it finds in my external stylesheet?

    Help would be greatly appreciated.


  4. Rebecca
    Rebecca avatar
    536 posts
    Registered:
    24 Sep 2012
    12 Feb 2008
    Link to this post
    Hello amckell,

    We are sorry but we could not reproduce this behavior with the current version of Sitefinity. Here is what we did:

    1. Created MyCss.css file and placed it in ~/Sitefinity/Admin/ControlTemplates/ folder. See attachment.

    2. In ~/Sitefinity/Admin/ControlTemplates/Generic_Content/EditorTemplate.ascx added this:
    <radE:RadEditor runat="server" ID="RadEditor1"
        ConfigFile="~/Sitefinity/Admin/ControlTemplates/EditorConfigFile.xml"
        CssFiles="~/Sitefinity/Admin/ControlTemplates/MyCss.css"

    3. In ~/Sitefinity/Admin/ControlTemplates/EditorConfigFile.xml we changed this:

        <property name="CssFiles">
            <item>~/Sitefinity/Admin/ControlTemplates/MyCss.css</item>

    4. In ~/Sitefinity/Admin/ControlTemplates/EditorToolsFile.xml we changed this:

        <classes>
            <class name="Red" value=".redbg1" />
            <class name="Blue" value=".bluebg1" />

        </classes>

    Please look at Results.jpg to see what we got as a result. There are no RadEditor styles in the Apply Css Class dropdown.
    Our suggestion is that you follow the steps above and use the provided sample css file. If the result in not the same as the one in Results.jpg, please provide your .css file, EditorTemplate.ascx, EditorConfigFile.xml and EditorToolsFile.xml so we can test locally.

    Greetings,
    Rebecca
    the Telerik team

    Instantly find answers to your questions at the new Telerik Support Center
  5. Nicko
    Nicko avatar
    16 posts
    Registered:
    10 Mar 2008
    22 Apr 2009
    Link to this post
    Hi Rebecca

    Does this still apply to version 3.6?

    We were running version 3.2 and have recently upgraded to 3.6 to resolve a number of bugs.

    We used to have the custom css styles appear in the apply styles dropdown of the editor, but this is no longer so after applying the 3.6 patch.
    We have re-enabled the apply styles button in the EditorToolsFile.xml but it shows no custom styles.

    In our 3.2 and 3.6 installation I can't find a file you refer to in step 3 of your instructions - ~/Sitefinity/Admin/ControlTemplates/EditorConfigFile.xml does this have anything to do with our issue?

    Can you perhaps list some steps to take to enable this in 3.6?

    Thanks
    Nicko
  6. Ivan Dimitrov
    Ivan Dimitrov avatar
    16072 posts
    Registered:
    25 Nov 2016
    22 Apr 2009
    Link to this post
    Hello Nicko,

    Please give a try to the steps below:

    1. Open ~/Sitefinity/Admin/ControlTemplates/EditorToolsFile.xml file
    2. Specify the path to the css file - thus you are specifying a file which collects your css classes.

    <root>   
    ...   
      ....  
      <cssFiles>   
        <item name="~/Sitefinity/Admin/ControlTemplates/MyCustomStyles.css" />   
      </cssFiles>  
       ...   
    ...   
    </root>   


    3. Delete <class> elements which are child elements of an element <classes>:

    <class name="Css Classes" value=".FirstClass" />    
    <class name="EditorToolsFile.xml" value=".SecondClass" />    
     

    Check out External CSS Files . From version 3.6 we are using built in and external templates, so that any changes you want to make to a template require to map this template.

    Sincerely yours,
    Ivan Dimitrov
    the Telerik team

    Instantly find answers to your questions on the new Telerik Support Portal.
    Check out the tips for optimizing your support resource searches.
  7. Brian
    Brian avatar
    15 posts
    Registered:
    23 Apr 2009
    23 Jun 2009
    Link to this post
    I have reviewed many post and the all say edit this file Sitefinity\Admin\ControlTemplates\Generic_Content\EditorTemplate.ascx  to get apply styles to work.  However in my build (the most recent) I do not have this file.  Actually, There are not any any user controls under that Generic_Content Folder.

    I have done a search for that file and I don't see any of them that would work.

    Do these instructions change for 3.6?  How do I edit the applyClass when there is no EditorTemplate.ascx  Am I supposed to install it from somewhere?
  8. Radoslav Georgiev
    Radoslav Georgiev avatar
    3370 posts
    Registered:
    01 Feb 2016
    23 Jun 2009
    Link to this post
    Hi Brian,

    Since, Sitefinity 3.6 SP2 is using embedded templates, if you want to edit the template you will have to download the ExternalTemplates.zip file. You have to download the file corresponding to your version of Sitefinity from the Downloads section your Client.Net account (look at attached image for reference). After you download the external templates you can choose the template you want to edit and edit it. For more information on how to make it work please read:  Introduction to ControlsConfig file and Mapping a control to use external template blog posts in the Sitefinity Blogs. In your version of Sitefinity, the templates for editing generic content items in the Generic Content Module is called  ContentEditView.ascx.

    To put it in a nutshell, after you have chosen the .ascx file you want to edit, copy it to the Sitefinity\Admin\ControlTemplates\Generic_Content folder and map it in your App_Data\Configuration\Telerik.Sitefinity.Configuration.ControlsConfig.xml file. By default this folder and file do not exist in the App_Data directory. You will have to manually create/copy them. The contents of the Telerik.Sitefinity.Configuration.ControlsConfig.xml after you have mapped your template should look something like this:

    <?xml version="1.0" encoding="utf-8"?>  
    <controlsConfig>  
       <viewMap>  
          <!-- Provides user interface for editing a content item in the Generic Content module.-->  
          <viewSettings hostType="Telerik.Cms.Engine.WebControls.Admin.ContentItemEdit`1[[Telerik.Cms.Engine.WebControls.Admin.ContentItemsView, Telerik.Cms.Engine]]" layoutTemplatePath="~/Sitefinity/Admin/ControlTemplates/Generic_Content/ContentEditView.ascx" />  
        </viewMap>  
    </controlsConfig>  

    From there on you can repeat what Ivan Dimitrov has described in the previous post.

    Kind regards,
    Rado
    the Telerik team

    Instantly find answers to your questions on the new Telerik Support Portal.
    Check out the tips for optimizing your support resource searches.
  9. Tyler Smith
    Tyler Smith avatar
    7 posts
    Registered:
    03 Dec 2004
    19 Oct 2009
    Link to this post
    Hi Rado -

    Hs this process changed in version 3.7? I followed the instructions in your last post, then completed the instructions in Ivan's post before that however I do not see my CSS styles. One item that I could not complete was "3. Delete <class> elements which are child elements of an element <classes>:" since that code did not exist in my file.

    Any help would be greatly appreciated!

    : Greg
  10. Radoslav Georgiev
    Radoslav Georgiev avatar
    3370 posts
    Registered:
    01 Feb 2016
    20 Oct 2009
    Link to this post
    Hi Tyler Smith,

    Thank you for using our services.

    Can you, please specify for which drop down you are trying to use. By default the ApplyClass tool is not set to appear in the editor, by default you see the FormatBlock tool (Paragraph Styles dropdown). If this is the tool you are referring to the steps to add new classes can be found here.

    If you are talking about the ApplyClass dropdown, you should first add it to the toolbar:
    <tools name="DropdownToolbar" dockable="false">
        ...
        <tool name="ApplyClass"/>
      </tools>

    and then go through the steps. The way you do it has not changed in 3.7. The EditorToolsFile does contain the <classes> section. I have attached the default one that comes with your installation.

    Greetings,
    Radoslav Georgiev
    the Telerik team

    Instantly find answers to your questions on the new Telerik Support Portal.
    Watch a video on how to optimize your support resource searches and check out more tips on the blogs.
  11. Greg Mattison
    Greg Mattison avatar
    15 posts
    Registered:
    14 Jul 2005
    21 Oct 2009
    Link to this post
    I am trying to apply the custom style list to the drop down in the list.

    I have followed the directions above and it does see the custom style sheet.

    When I try to apply the style class list to the drop down I get a blank list with only clear style

    This is an example of that I added to the tools xml file

    <classes>   
      <class name="Heading1" value="H1" />
      <class name="Heading2" value="H2" />
      <class name="Heading3" value="H3" />
      <class name="normal" value="p" />    

    </classes>


    Am I missing somthing or is there a step by step document on how to do this that I am missing?

  12. Ivan Dimitrov
    Ivan Dimitrov avatar
    16072 posts
    Registered:
    25 Nov 2016
    21 Oct 2009
    Link to this post
    Hi Greg Mattison,

    As I see it point 3 says
    "3. Delete <class> elements which are child elements of an element <classes>:" and point 2 says :2. Specify the path to the css file - thus you are specifying a file which collects your css classes.

    Kind regards,
    Ivan Dimitrov
    the Telerik team

    Instantly find answers to your questions on the new Telerik Support Portal.
    Watch a video on how to optimize your support resource searches and check out more tips on the blogs.
  13. Greg Mattison
    Greg Mattison avatar
    15 posts
    Registered:
    14 Jul 2005
    21 Oct 2009
    Link to this post
    if you remove 
      <class name="Heading1" value="H1" />
    and just let the styles link in the whole css.
    How do you give the style a more freindly name in the dropdown like Heading1 or redlink instead of h1 or .myredlink?

    We are trying to have the styles be applied in the edit window so they will look the same as the published page.
  14. Ivan Dimitrov
    Ivan Dimitrov avatar
    16072 posts
    Registered:
    25 Nov 2016
    26 Oct 2009
    Link to this post
    Hello Greg Mattison,

    We sent reply to your support request, please take a look at it.

    Regards,
    Ivan Dimitrov
    the Telerik team

    Instantly find answers to your questions on the new Telerik Support Portal.
    Watch a video on how to optimize your support resource searches and check out more tips on the blogs.
  15. Meister
    Meister avatar
    262 posts
    Registered:
    09 Nov 2007
    25 Nov 2009
    Link to this post
    Hi

    i too am having a right pain getting this working
    here is what i've done:

    added the controlsconfig.xml into appdata/configuration and specified

    <

     

    viewSettings hostType="Telerik.Cms.Engine.WebControls.Admin.ContentItemEdit`1[[Telerik.Cms.Engine.WebControls.Admin.ContentItemsView, Telerik.Cms.Engine]]" layoutTemplatePath="~/Sitefinity/Admin/ControlTemplates/Generic_Content/ContentEditView.ascx" />

    added the file and resx to the correct location

    Edited EditorToolsFile.xml
     -switched on apply class
    -removed classes section
    added:

     

    <

     

    cssFiles>

     

    <

     

    item name="~/EditorCustomStyles/EditorCustomStyles.css" />

     

    </

     

    cssFiles>
    i've edited the above css file with a .test  class

    however i still dont see anything in the drop down, just a clear option

    help!

     

  16. Ivan Dimitrov
    Ivan Dimitrov avatar
    16072 posts
    Registered:
    25 Nov 2016
    25 Nov 2009
    Link to this post
    Hi Quade,

    Try removing class attributes from EditorToolsFile and work programmatically.

    public void Page_Load(object sender, EventArgs e)
        {
            // LOAD CERTAIN CSS CLASSES FROM YOUR STYLE SHEET
            Editor.CssClasses.Add("Links class ", "a.link");
            Editor.CssClasses.Add("some class ", ".something");
        }


    Sincerely yours,
    Ivan Dimitrov
    the Telerik team

    Instantly find answers to your questions on the new Telerik Support Portal.
    Watch a video on how to optimize your support resource searches and check out more tips on the blogs.
  17. Meister
    Meister avatar
    262 posts
    Registered:
    09 Nov 2007
    25 Nov 2009
    Link to this post
    Thanks Ivan
    I need to stream in all classes in a CSS file though

    out of interest, which code behind file do i edit for that? (can you give me name and location please)

    THanks
  18. Ivan Dimitrov
    Ivan Dimitrov avatar
    16072 posts
    Registered:
    25 Nov 2016
    25 Nov 2009
    Link to this post
    Hello Quade,

    As far as I see it you have mapped ContentEditView. So for this template you need to load the css classes. Just to let you know there are not problems at our end with the other suggestions in the thread.

    Kind regards,
    Ivan Dimitrov
    the Telerik team

    Instantly find answers to your questions on the new Telerik Support Portal.
    Watch a video on how to optimize your support resource searches and check out more tips on the blogs.
  19. Meister
    Meister avatar
    262 posts
    Registered:
    09 Nov 2007
    25 Nov 2009
    Link to this post
    Thanks Ivan, i'm sure its something simple but i just cant seem to get it working

    the requirement is to have all the editors showing an apply class drop down box
    and ideally, have it show all the classes in a CSS file.

    Based on this, do i need ContentEditView mapped?
    i.e. is there a better way of doing what i'm trying to acheive

    thanks

  20. Radoslav Georgiev
    Radoslav Georgiev avatar
    3370 posts
    Registered:
    01 Feb 2016
    25 Nov 2009
    Link to this post
    Hi Quade,

    You should map the templates where you want the custom CSS styles showing. This is the only way.

    Kind regards,
    Radoslav Georgiev
    the Telerik team

    Instantly find answers to your questions on the new Telerik Support Portal.
    Watch a video on how to optimize your support resource searches and check out more tips on the blogs.
  21. Adam
    Adam avatar
    33 posts
    Registered:
    23 Feb 2009
    16 Mar 2010
    Link to this post
    Hi Guys,

    I have had no luck getting this to work through the xml file either. Is this a bug? I just need to inform the client.

    <root>
      <tools dockable="false">
        <tool name="Bold" shortcut="CTRL+B"/>
        <tool name="Italic" shortcut="CTRL+I"/>
        <tool name="JustifyLeft" />
        <tool name="JustifyCenter" />
        <tool name="JustifyRight" />
        <tool name="JustifyFull" />
        <tool name="InsertOrderedList" />
        <tool name="InsertUnorderedList" />
        <tool separator="true"/>
        <tool name="ApplyClass" enabled="true"/>
      </tools>
      <tools name="MainToolbar" dockable="false">
        <tool name="AjaxSpellCheck" shortcut="F7"/>
        <tool name="PasteFromWordNoFontsNoSizes" />
        <tool name="PastePlainText" />
        <tool separator="true"/>
        <tool name="Undo" shortcut="CTRL+Z"/>
        <tool name="Redo" shortcut="CTRL+Y"/>
        <tool separator="true"/>
      </tools>
      <tools name="InsertToolbar" dockable="false">
        <tool name="LibraryImageManager" text="Insert an image"/>
        <tool name="LibraryDocumentManager" text="Insert a document"/>
        <tool name="LinkManager" text="Insert a link" shortcut="CTRL+K"/>
        <tool name="Unlink" shortcut="CTRL+SHIFT+K"/>
        <tool name="FlashManager" />
        <tool name="MediaManager" />
      </tools>
      <tools name="DropdownToolbar" dockable="false">
        <tool name="FormatBlock"/>
        <tool name="FormatStripper"/>
        <tool name="ToggleScreenMode" />
      </tools>
      <links>
        <link name="telerik" href="http://www.telerik.com">
          <link name="Products" href="http://www.telerik.com/products">
            <link name="r.a.d.controls suite" href="http://www.telerik.com/radcontrols" />
            <link name="r.a.d.navigation suite" href="http://www.telerik.com/radnavigation" />
            <link name="r.a.d.editor" href="http://www.telerik.com/radeditor" />
            <link name="r.a.d.designer" href="http://www.telerik.com/raddesigner" />
            <link name="r.a.d.spell" href="http://www.telerik.com/radspell" />
            <link name="r.a.d.chart" href="http://www.telerik.com/radchart" />
            <link name="r.a.d.menu" href="http://www.telerik.com/radmenu" />
            <link name="r.a.d.treeview" href="http://www.telerik.com/radtreeview" />
            <link name="r.a.d.panelbar" href="http://www.telerik.com/radpanelbar" />
            <link name="r.a.d.rotator" href="http://www.telerik.com/radrotator" />
            <link name="r.a.d.tabstrip" href="http://www.telerik.com/radtabstrip" tooltip="Tooltip" />
          </link>
          <link name="Purchase" href="http://www.telerik.com/purchase" />
          <link name="Support" href="http://www.telerik.com/support" />
          <link name="Client.Net" href="http://www.telerik.com/clientnet" />
        </link>
        <link name="Microsoft">
          <link name="Main Site" href="http://www.microsoft.com" />
          <link name="MSDN Online" href="http://msdn.microsoft.com" />
          <link name="Windows Update" href="http://windowsupdate.microsoft.com" />
        </link>
        <link name="Search Engines">
          <link name="Google" href="http://www.google.com" />
          <link name="Yahoo" href="http://www.yahoo.com" />
          <link name="AltaVista" href="http://www.altavista.com" />
        </link>
      </links>
      <snippets>
        <snippet name="Order Confirmation">
          <![CDATA[
                        <div style="width:300px;border:2px outset #D8D2BD;padding:34px;font-family:Arial, Verdana; font-size:11px;background-color:#F1EFE6;">
                        Dear ____________________,<br />
                        Thank you for inquiring about ____________. Your request will be processed in 48 hours and shipped at the address you have provided.
                        <br /><br />
                            <b>Please, contact us if you have any problems.</b>
                        </div>
                    ]]>
        </snippet>
        <snippet name="Email Signature">
          <![CDATA[
                        <div style="margin-top:30px;width:80%;border-top:1px dotted gray;padding-top:4px;font-family:Arial, Verdana; font-size:11px;">
                        <b>John Wigham</b><br />
                        Senior Web Developer<br />
                            <a href="#">john@mysite.com</a>
                            <br />
                                <br />
                                    <i>Disclaimer: The contents of this e-mail are privileged and confidential and intended for the addressees at the specified e-mail addresses only.</i>
                        </div>
                    ]]>
        </snippet>
        <snippet name="Problem Report Feedback">
          <![CDATA[
                        <div style="width:300px;border:2px outset #D8D2BD;padding:34px;font-family:Arial, Verdana; font-size:11px;background-color:#F1EFE6;">
                        Hi ____________________,<br />
                        Thank you for reporting this issue. We have verified the problem and it is logged in our system. We will notify you once we have a solution.
                        <br /><br />
                            <b>Please, contact us if you have any problems.</b>
                        </div>
                    ]]>
        </snippet>
      </snippets>
      <symbols></symbols>
      <fontNames>   </fontNames>
      <fontSizes>
      </fontSizes>
      <realFontSizes>
        <item value="11px"></item>
        <item value="12px"></item>
        <item value="13px"></item>
        <item value="14px"></item>
        <item value="18px"></item>
        <item value="22px"></item>
      </realFontSizes>
      <colors></colors>
      <paragraphs></paragraphs>
      <classes>
        <class name="Quote" value=".quote" />
      </classes>
      <dialogParameters></dialogParameters>
      <languages></languages>
      <contextMenus>
      </contextMenus>
    </root>
  22. Ivan Dimitrov
    Ivan Dimitrov avatar
    16072 posts
    Registered:
    25 Nov 2016
    16 Mar 2010
    Link to this post
    Hello Adam,

    You can take a look at the following articles.

    Introduction to Toolbars
    Using the ToolsFile.xml
    CSS Styles
    External CSS Files

    You should add ApplyClass toolbar or specify css classes. Below are some tips.

    Through EditorToolsFile file

    1. Open ~/Sitefinity/Admin/ControlTemplates/EditorToolsFile.xml file
    2. Specify the path to the css file, which you need the editor to use:

    <root>    
       
    ...    
       
      <cssFiles>    
       
        <item name="~/Sitefinity/Admin/ControlTemplates/MyCSS.css" />    
       
      </cssFiles>    
       
    ...    
       
    </root>

    3. Delete the <class> elements which appear as child elements of an element <classes>:

    <class  name="Add CssClasses:"  value=".test" />    
    <class name="EditorToolsFile.xml" value=".test1" />

    Programmatically. 1. Map the external template for the desired view.
    2. Add inline code to the template and specify your css file with the custom classes.

    <script type="text/C#" runat="server">
       
        protected void Page_Load(object sender, EventArgs e)
        {
            Editor.CssFiles.Add("~/test/s.css");
        }
       
    </script>


    Other options

    Working with ToolsFile

    Apply value property as  the name of your css class.

    <classes
      <class name="Heading1" value="H1" />
      <class name="Heading2" value="H2" />
      <class name="Heading3" value="H3" />
      <class name="normal" value="p" />  
      
    </classes>


    Your class section should look as in the sample below:

    Copy Code
    <classes>
        <class name="RED" value=".BackGroundRed" />
        <class name="Blue" value=".BackGroundBlue" />
    </classes>

    As you can see we are applying css classes from our stylesheet.

    .BackGroundBlue
    {
      background-color: Blue;
    }
    .BackGroundRed
    {
      background-color: Red;
    }


    Note that you should have added the path to your css stylesheet in the desired template

    <telerik:RadEditor
      
                    runat="server"
                    ID="Editor"
                    ContentAreaCssFile="~/Sitefinity/Admin/Themes/Default/AjaxControlsSkins/Sitefinity/EditorContentArea.css"
                    ToolsFile="~/Sitefinity/Admin/ControlTemplates/EditorToolsFile.xml"                 
                    Skin="WebBlue"                   
                    NewLineBr="False"
                    Width="95%"
                    ContentFilters="FixUlBoldItalic,FixEnclosingP,IECleanAnchors,MozEmStrong,ConvertFontToSpan,ConvertToXhtml,IndentHTMLContent">
                    <ImageManager ViewPaths="~/Images" UploadPaths="~/Images" DeletePaths="~/Images" />
                    <MediaManager ViewPaths="~/Files" UploadPaths="~/Files" DeletePaths="~/Files" />
                    <FlashManager ViewPaths="~/Files" UploadPaths="~/Files" DeletePaths="~/Files" />
                    <DocumentManager ViewPaths="~/Files" UploadPaths="~/Files" DeletePaths="~/Files" />
                    <CssFiles>
                        <telerik:EditorCssFile Value="~/Sitefinity/Admin/Themes/Default/AjaxControlsSkins/Sitefinity/EditorCssFile.css" />
                       <telerik:EditorCssFile Value="~/Files/style.css"/>
                    </CssFiles>
                </telerik:RadEditor>


    Regards,
    Ivan Dimitrov
    the Telerik team

    Do you want to have your say when we set our development plans? Do you want to know when a feature you care about is added or when a bug fixed? Explore the Telerik Public Issue Tracking system and vote to affect the priority of the items.
  23. Richard
    Richard avatar
    24 posts
    Registered:
    25 Apr 2008
    26 Mar 2010
    Link to this post
    This is insane. For years you've been posting multiple different methods just to add the ability to apply custom styles with the editor. This should be configurable from the GUI in the Administration section or perhaps a new Styles section. This is not an unusual request and frankly it's not something that should be so complex that it takes a .Net developer to do it, a content designer should be able to add styles to the editor. Adding a user interface to this would also protect us from changes in Sitefinity that tend to break or overwrite things that are done by modifying the program files.

    So, I'm still trying to make this work. I have added classes and a CSS file path to my EditorToolsFile.XML but I have no CSS menu in the editor. What turns that on?
  24. Ivan Dimitrov
    Ivan Dimitrov avatar
    16072 posts
    Registered:
    25 Nov 2016
    26 Mar 2010
    Link to this post
    Hi Richard,

    As you can see from the articles below this is how the RadEditor control should be configured. We just use this control in Sitefinity's GenericContent control and backend views. Anyhow, we will consider to implement backend UI section from where you could configure some of the base RadEditor's settings in Sitefinity 4.0.

    You could try to use the simplest option from all suggested where you have to
    Delete the <class> elements which appear as child elements of an element <classes>: and add only path to the css file, which you need the editor to use:

    Best wishes,
    Ivan Dimitrov
    the Telerik team

    Do you want to have your say when we set our development plans? Do you want to know when a feature you care about is added or when a bug fixed? Explore the Telerik Public Issue Tracking system and vote to affect the priority of the items.
  25. Richard
    Richard avatar
    24 posts
    Registered:
    25 Apr 2008
    26 Mar 2010
    Link to this post
    The RadEditor documentation shows an Apply CSS menu. I have made the changes suggested but that menu doesn't exist in the Sitefinity generic content editor. How does one turn it on?

    I have been able to modify the Paragraph menu but have only gotten that to work for inline styles, not CSS classes.
  26. Adam
    Adam avatar
    33 posts
    Registered:
    23 Feb 2009
    26 Mar 2010
    Link to this post
    Hi Ivan,

    This is the article I went off of originally. Based on this thread, it sounds like it is not working for many people using the config xml files. I'm using 3.7 sp2.

    thanks
  27. Ivan Dimitrov
    Ivan Dimitrov avatar
    16072 posts
    Registered:
    25 Nov 2016
    28 Mar 2010
    Link to this post
    Hi Adam,

    I attached a video that illustrates that there is no problem with setting the css classes for RadEditor through EditorToolsFile.xml if you have followed the suggested steps.

    All the best,
    Ivan Dimitrov
    the Telerik team

    Do you want to have your say when we set our development plans? Do you want to know when a feature you care about is added or when a bug fixed? Explore the Telerik Public Issue Tracking system and vote to affect the priority of the items.
  28. Richard
    Richard avatar
    24 posts
    Registered:
    25 Apr 2008
    28 Mar 2010
    Link to this post
    Ivan,

    Thanks, but at the beginning of the video your generic content editor already had an Apply CSS menu. Mine in 3.7 SP2 does not. How is that menu activated in the first place?
  29. Ivan Dimitrov
    Ivan Dimitrov avatar
    16072 posts
    Registered:
    25 Nov 2016
    28 Mar 2010
    Link to this post
    Hello Richard,

    You could take a look at Using the ToolsFile.xml which explains how to enable this DropDown. The same link is provided in one of the previous posts.

    Sincerely yours,
    Ivan Dimitrov
    the Telerik team

    Do you want to have your say when we set our development plans? Do you want to know when a feature you care about is added or when a bug fixed? Explore the Telerik Public Issue Tracking system and vote to affect the priority of the items.
  30. Richard
    Richard avatar
    24 posts
    Registered:
    25 Apr 2008
    28 Mar 2010
    Link to this post
    Well, Ivan, that's one of the problems I have. I love Sitefinity, but I work 40+ hours a week developing my code and every time I need to dig around in the Sitefinity internals to do that it just slows me down. So thanks for the link to the RadControl document, but many of the small details like file names and paths are not the same in Sitefinity. For me it would have been quicker just to mention that renaming ~/Sitefinity/Admin/ControlTemplates/EditorToolsFileAll.xml to EditorToolsFile.xml will enable all of the menus rather than making me Google the correct filename and path, etc. But I do finally have it working.

    Again - developing CSS styles is not the role of a .NET developer in my shop, so it would be greatly appreciated if these could be added through some mechanism that a content designer can use. Obviously I'm not going to give a content designer access to EditorToolsFile.xml.
Register for webinar
34 posts, 0 answered
1 2