Alternative Ways to Do Site-specific Rich Text Editor CSS?

Question

I've been wanting to implement site-specific rich text css classes but have come onto an issue. I can't change anything global in this environment. The tutorials require me to change an EditorPage.aspx file. I am not able to do this. Is there any other way to set up site specific css classes for the rich text editor?

I'm on Sitecore 7.5.

Thanks!

Answer 1

This is very similar to a previous Stackoverflow question which I answered about Multtiple RTE Class Styles, which I followed up with a blog post which includes details about loading site specific css styles in Sitecore rich text editor.

Create a new EditorConfiguration class inheriting from Sitecore.Shell.Controls.RichTextEditor.EditorConfiguration and override the SetupStylesheets() method. Then register that new Configuration Type in the 'core' database against your HTML Editor Profile, then set the source of the RTE field in your template to your to your Rich Text Profile.

In your SetupStylesheets() method you need to use an xpath query to get the list of site specific css files:

protected override void SetupStylesheets()
{
    string id = WebUtil.GetQueryString("id");
    string query = "/*/content//*[@@id='" +id+ "']/ancestor::*[@@templateid='{root-guid}']//*[@@templateid='{style-folder-guid}']/*";

    IList<Item> stylesheets = Sitecore.Context.ContentDatabase.SelectItems(query);

    foreach (Item item in stylesheets)
    {
        this.Editor.CssFiles.Add(item["Stylesheet"]);
    }

    base.SetupStylesheets();
}