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

A couple ssues with Rad Editor and content styling

5 Answers 96 Views
Editor
This is a migrated thread and some comments may be shown as answers.
Albert Shenker
Top achievements
Rank 1
Veteran
Iron
Albert Shenker asked on 28 Sep 2011, 04:54 PM
Rad Editor is  great tool, but there are some important defincincies that I believe Telerik really needs to address before it can be used as true content editor.

1) The content the user creates and "sees" on the screen does not necessarily match the html markup generated by rad Editor and therefore does not match the appearance of the content in other environments. If a user specifies some content should be styled with a particular class.. and that class is not defined anywhere on the partiuclar page the content gets displayed in, then obviously the style will not appear as it does when the use saved the content. This behavior is totally expected. On the other hand, if the user creates some content and on screen it shows "verdana" as the font, it may not actually be set to verdana in the markup, and the content will therefore not look like it does in the editor. For example, when the editor first loads, the FontNames dropdown accepts the default font from the browser and the realFontSize dropdown does the same. So, as the user creates content, this is the font name/size which is used in the editor content area by default. The user assumes that their content will look like this when they save it. However, the Verdana font name and size are not actually applied to the content. They are only what is used in the content display area of the editor. and so you have users creating content that they think will look one way, when it actually looks like something else. This can be a nightmare when creating content which can be used in multiple environments.. (web, print, email, phone, etc.). Ideally, when rad editor loads, we should be able to specify the default font name/size (as well as other parameters, like color, styling, etc.). This is the default font which appears in the rad editor content area AND, when the user types in some content, these font styles will also be applied in the markup generated by Rad Editor. Since the user assumes what they see on screen is what the content will look like, there must always be a font name/size selected and applied in the generated markup. Only in this way can users be sure what they see in rad Editor is what they'll get when the content is saved.

2) It has been mentioned in other threads and I assume Telerik is working on this, but the xhtml markup which rad editor generates does not conform to the styling requirements of some email clients... most notably Outlook. This is particularly true when it comes to image declarations. As someone who need to build email content editors, this is an important feature that should be implemented.

5 Answers, 1 is accepted

Sort by
0
Rumen
Telerik team
answered on 03 Oct 2011, 11:24 AM
Hi Albert,

Straight to the points:
1.1) If the class is not defined anywhere on the partiuclar page the content gets displayed in, then obviously the style will not appear as it does when the use saved the content - This is how the Apply Class dropdown works by design. The dropdown applies a class attribute with the selected class value. If you would like you can implement your own custom dropdown that applies inline style(s) instead of a className attribute.

It is also up to the front end developer / site designer to provide the same set of classes loaded in the ApplyClass dropdown (when it is available on the toolbar) which are available in the admin site (where RadEditor resides) to the public site where the generated content appears.

1.2) Default browser font and the font attributes: This browser behavior is discussed in the following KB article: No FONT tags are applied when I type text in the editor.

2) Yes, we are currently working to provide better output for Outlook. We plan f0r Q3 2011 to enhance the ConvertInlineStylesToAttributes content filter to convert the inline <img> width and height style attribute values to standalone width and height attributes.

Best regards,
Rumen
the Telerik team
If you want to get updates on new releases, tips and tricks and sneak peeks at our product labs directly from the developers working on the RadControls for ASP.NET AJAX, subscribe to their blog feed now
0
Albert Shenker
Top achievements
Rank 1
Veteran
Iron
answered on 03 Oct 2011, 02:17 PM
1.1). Like I said, this is expected behavior and is fine.

1.2) I'm not sure wht you say this is browser behavior when it has to do with the markup that RadEditor generates. Anyhow, the proposed solution may or may not work in certain scenarios, but it hardly seems like a very good idea to set the default font to some font size that happens to not be in your lost of default font sizes. What if we want the default size to be  a standard size that IS in your list of sizes? What if your list of sizes changes at some point? As you can see, this solution would not suffice in those cases. I assume Telerik has complete control over the content their editor generates. Why not make it so it ALWAYS generates font properties? As I mentioned in my email, in the vast majority of cases, content developers want to know what their content is going to look like, and setting a default font and having it applied to the markup is the only way to do this. If Telerik is concerned that some people would rather have slightly smaller markup generated, then they can make this behavior a property of the Editor. Nevertheless, I can't imagine a scenario where slight markup efficiency improvement trumps the benefit of being able to predict what your content is going to look like. I can't stress how important this issue is. I am developing a CMS system for a customer of mine. RadEditor, though tremendous in so many ways is not suitable for this simply because of this one behavior. Users must be able to predict what ther content will look like and if no default font can be set, other than some font which doesn't exist in your list, then that eliminates the control from potential use as a true content editor.
0
Rumen
Telerik team
answered on 06 Oct 2011, 12:20 PM
Hello Albert,

1.2) The content area of RadEditor is an editable IFRAME / DIV element which uses the Rich Text Editing engine of the browser under which its operates. The Rich Text Editing engines of the different browsers are written and provided by the browsers developers and offer limitations as the discussed one which cannot be always avoided. The reported problem is a browser behavior and you can reproduce it in a standard editable DIV / IFRAME by executing the execCommand("FontName", false, "DefaultBrowserFontName") command to the selected content in it. You will notice that the browser will not apply a font tag most likely to reduce the amount of content.

Best wishes,
Rumen
the Telerik team
If you want to get updates on new releases, tips and tricks and sneak peeks at our product labs directly from the developers working on the RadControls for ASP.NET AJAX, subscribe to their blog feed now
0
Albert Shenker
Top achievements
Rank 1
Veteran
Iron
answered on 06 Oct 2011, 01:44 PM
would it not be possible to wrap all of the editor content in a styled span tag? One would only have to make sure that the font settings in the editor mtched the style settings in the tag. 
0
Rumen
Telerik team
answered on 06 Oct 2011, 02:46 PM
Hi Albert,

You can also try the following code to wrap the initial content or the empty content of RadEditor in a span tag with the desired default font formatting, e.g.

Copy Code
<telerik:radeditorrunat="server"OnClientLoad="OnClientLoad"ID="RadEditor1">
</telerik:radeditor>
<scripttype="text/javascript">
function OnClientLoad(editor) {
  setTimeout(function() {
   var tool = editor.getToolByName("RealFontSize");
   tool.set_value("12px");
   var args = new Telerik.Web.UI.EditorCommandEventArgs("RealFontSize", null, "32px");
    editor.fire("RealFontSize", args);
    editor.fire("FontName", { value: "Arial" });
  }, 0);
}
</script>

You can modify the values depending on your requirements. This could be helpful for your scenario.



Greetings,
Rumen
the Telerik team
If you want to get updates on new releases, tips and tricks and sneak peeks at our product labs directly from the developers working on the RadControls for ASP.NET AJAX, subscribe to their blog feed now
Tags
Editor
Asked by
Albert Shenker
Top achievements
Rank 1
Veteran
Iron
Answers by
Rumen
Telerik team
Albert Shenker
Top achievements
Rank 1
Veteran
Iron
Share this question
or