This is a migrated thread and some comments may be shown as answers.

Node Inspector customisation

3 Answers 62 Views
Editor
This is a migrated thread and some comments may be shown as answers.
Mathew
Top achievements
Rank 1
Mathew asked on 14 Dec 2008, 11:51 AM
Hello all,

I'd like some advice please - what is the most straightforward way to make adjustments to the Editor's Node Inspector? We wish to remove the options to adjust HTML attributes.

For example, when an image is selected we would like to remove the Width, Height, Alignment, Border Color and Border Width option, but retain Set Image Properties, Tooltip, and Classname. Is there an easy way to "turn off" the undesired options, or do we have to create a custom module with just the features we desire?

Many thanks,
Mathew.

3 Answers, 1 is accepted

Sort by
0
Accepted
Tervel
Telerik team
answered on 16 Dec 2008, 08:40 AM
Hello Mathew,

There are two options to achieve that. One is to create a custom module based on the source code of the NodeInspector module - which is complicated (like the module itself) and error-prone.

The second possibility is to hack the module's configuration array for IMG tags. This can be done by adding the following line of script on the page:

//HACK - We do not advise for using it, but it is an easy one!
Telerik.Web.UI.Editor.Modules.RadEditorNodeInspector.prototype._nodeAttributesArray["IMG"] =
            [ "className", "SetImageProperties", "alt"];



Please note that the module always splits the number of tools in two rows - so by eliminating most of the tools, you will still end up with two rows of tools. This might look a little ugly.

Greetings,
Tervel
the Telerik team

Check out Telerik Trainer, the state of the art learning tool for Telerik products.
0
Mathew
Top achievements
Rank 1
answered on 17 Dec 2008, 11:53 PM
Hello Tervel,

Excellent, thanks - the hack produces the desired functionality. We have a script file dedicated to other minor changes we've made to the editor, so it was straightforward to add another line to it.

Another question in the same area - can we specify the classes that we want to appear in the 'Classname' dropdown, rather than have the entire set available? I'm hoping that there's a similar array that I can alter! Finally, is there a value that can be adjusted to increase the width of the dropdown element itself?

Thanks again,
Mathew.
0
Accepted
Rumen
Telerik team
answered on 20 Dec 2008, 03:52 PM
Hi Mathew,

Currently, the Node Inspector module of RadEditor lists all classes that the editor picks up from the parent page, but not only the classes that apply to the selected element in the content area. I logged this feature in our ToDo list and we will implement this feature for one of the future RadEditor builds. I also updated your Telerik points.

What you can do for the time being is to limit the populated classes in the dropdown by setting the CssClasses property, e.g.

<style type="text/css">
.table { color:red;}
green.table { color: green; }
pink.img { border: 1px solid pink; }
</style>

<telerik:RadEditor runat="server" ImageManager-ViewPaths="~/Images" ID="RadEditor1">
<Content>
<table>
    <tbody>
        <tr>
            <td>test</td>
            <td>test</td>
            <td>test</td>
        </tr>
        <tr>
            <td>test</td>
            <td>test</td>
            <td>test</td>
        </tr>
        <tr>
            <td>test</td>
            <td>test</td>
            <td>test</td>
        </tr>
    </tbody>
</table>
</Content>
<CssClasses>
    <telerik:EditorCssClass Name="greenTable" Value="green.table" />
</CssClasses>
</telerik:RadEditor>

Currently, RadEditor does not offer the ability to resize its modules.

Best regards,
Rumen
the Telerik team

Check out Telerik Trainer, the state of the art learning tool for Telerik products.
Tags
Editor
Asked by
Mathew
Top achievements
Rank 1
Answers by
Tervel
Telerik team
Mathew
Top achievements
Rank 1
Rumen
Telerik team
Share this question
or