Customizing and Extending the Editor

[John]

The reason I want an editor is to add rich content BUT not unsustainable content. Because the way we build sites includes skinning things like choosing fonts and colors make content a heavy issue when updating the skin. If the custom colors selected don't match then content conflicts with the new look and feel and thus makes things less sustainable.

My resolution is to use styles instead of colors and/or font selections. Can we put up some nice clarification in the docs on how to modify and work with the toolbar and customize it towards these goals?

Extending the editor... I also want to be able to say drop a template inside the editor. Another thing that would be great is we often work with 960 Grid layouts. It would be great to be able to manage content for those scenarios. I am not asking Kendo to build in all these features but it would be superb if we had an idea how to extend these functionalities. We liked the work by Jay Slavat and his MarkeItUp! editor but he did not have enough support to build it out to that level and retired active development. Certainly I am not after a code editor here but the ability to build some of the extension plugins for the editor would be a WIN WIN.

[Alex Gyoshev]

Hello John,

Currently, you can add a stylesheet that will be applied to the editor content area (see the thread "inject css into editor"). This will allow you to include the 960.gs styles. Apart from that, we intend to introduce the ability to write custom tools. Do you have any specific requirements on which editor tools you intend to customize in your plug-in? Do you want to create an additional editor dialog, just a simple button, or a drop-down? We will introduce some documentation on using custom tools for the official release, so if you are more specific about your requirements, we will address them faster.

Kind regards,
Alex Gyoshev
the Telerik team

[Jerome]

Alex,
As a follow up question, I need to limit the font color palette to a pre-defined set. I cannot see any documentation or threads related to that topic. My idea was to the able to do something like this (imagine a model in MVC where one of the properties is "Content").
                        Html.Kendo()
                            .EditorFor(m => m.Content)
                            .Name("Content")
                            .Tools(tools => tools
                                .FontSize(items => items
                                .Add("8", "8")
                                .Add("10", "10")
                                .Add("12", "12")
                                )
                                .FontColor(items=>items
                                .Add("myblue", "#488B9B")
                                .Add("myred", "#BC141A")
                                .Add("myorange", "#CA7700")
)                         
                            )
                            .Render();
Is that possible? Thanks.

[Alex Gyoshev]

Hello Jeromy,

The functionality to configure the color picker palette has just been added for the upcoming 2013.Q2 release next week. The newly introduced API looks like this:

.FontColor(config => config
     .Palette(new string[] { "#ff0000", "#0ff000", "#abcdef" })
)

Regards,
Alex Gyoshev
Telerik

[Nariman]

Hi,

Could you please let me know (when using Kendo UI js) how to change the Editor's colorPicker Palette to "Basic" and Columns to 24? 

[Ianko]

Hi Nariman,

You can configure the "basic" palette by following this example:

$("#editor").kendoEditor({
    tools: [
      {
        name: "foreColor",
        palette: "basic"
      }
    ]
});

As for the columns, the colorPicker in Editor widget does not support this option. If you think that this is useful to have in the widget configuration you can put your suggestion in the Kendo User Voice portal—http://kendoui-feedback.telerik.com/forums/127393-kendo-ui-feedback.

Regards,
Ianko
Telerik