EditorModes button labels

[Dev]

How can editor mode tab buttons (preview, HTML, design) be changed in C# code?
- Toggle label on the button
- Change label text on button,
- Toggle icon,
- Change icon.

[Rumen]

Hello,

You can change the localization of the Design, HTML and Preview buttons using the following code

        RadEditor1.Localization.Main.RadEditorDesignMode = "test";
        RadEditor1.Localization.Main.RadEditorHtmlMode = "test";
        RadEditor1.Localization.Main.RadEditorPreviewMode = "test1";

The icons are applied via sprite and they can be controlled only via CSS. You can see which css class to override in the following screenshot.

Greetings,
Rumen
the Telerik team

[Dev]

Thanks for the solution. It sort of works.
Although if the text is removed, the icon dissapears. Also the button width is always the same.
This is unwanted behaviour.

How can I show only the icon, as you do in this sample:
http://www.telerik.com/help/aspnet-ajax/editor-edit-modes.html

[Rumen]

Hi,

You can use the following CSS style to hide the text of the Design, HTML and Preview buttons:

<style type="text/css">
    .reEditorModes a
    {
        width: 26px !important;
        overflow: hidden;
        border: solid 1px #ececec;
    }
    
    .reEditorModes a span
    {
        text-indent: -9999px;
    }
    
    a.reMode_selected
    {
        border: solid 1px #828282;
        background: none #cecece !important;
    }
    </style>

Greetings,
Rumen
the Telerik team