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

Is it possible to set RadEditor button defaults such as 'Font Name' to Arial

13 Answers 219 Views
Editor
This is a migrated thread and some comments may be shown as answers.
John
Top achievements
Rank 1
John asked on 31 Aug 2009, 08:37 PM
Greetings,

As the question states, I'm trying to set the default for the 'Font Name' drop down on the RadEditor.  I'd like to set the font style and size to Arial, 12pt.

Is this possible?  I have custom buttons on the editor and I know it's possible to set indexes on dropdowns but I don't know if Telerik will allow me to set such indexes for these predefined buttons.  It doesn't look like the Tools File provides any access to this area.

Thanks!
John

13 Answers, 1 is accepted

Sort by
0
Shinu
Top achievements
Rank 2
answered on 01 Sep 2009, 05:24 AM
Hi John,

Try the following client side code for setting the default font style and size.

ASPX:
 
<telerik:RadEditor ID="RadEditor1" OnClientLoad="OnClientLoad" runat="server"
</telerik:RadEditor> 

JavaScript:
 
<script type='text/javascript'
function OnClientLoad(editor, args) 
  var style = editor.get_contentArea().style; 
  style.fontFamily= 'Arial'
  style.fontSize= 12 + 'px'
</script> 
 

-Shinu.
0
John
Top achievements
Rank 1
answered on 01 Sep 2009, 12:20 PM
Shinu,

Appreciate this code.  This does solve the problem in a round-about way.  I was hoping also to reflect this setting in the button itself.

Is there a way to change the font type and font size buttons so they reflect what the content area is set to?

Thanks!
0
Rumen
Telerik team
answered on 03 Sep 2009, 11:08 AM
Hello John,

Please, try the following code to set the FontName and RealFontSize header values:

<script type='text/javascript'>  
function OnClientLoad(editor, args)  
{  
    var style = editor.get_contentArea().style;  
    style.fontFamily= 'Arial';  
    style.fontSize= 12 + 'px';  
 
    var tool = editor.getToolByName("FontName");  
 
    if (tool)  
    {  
            tool.set_value("Arial"); 
    } 
     
    var tool2 = editor.getToolByName("RealFontSize");  
 
    if (tool2)  
    {  
            tool2.set_value("12px"); 
    } 
}  
</script>  
 <telerik:RadEditor ID="RadEditor1" OnClientLoad="OnClientLoad" runat="server">  
</telerik:RadEditor>  


Sincerely,
Rumen
the Telerik team

Instantly find answers to your questions on the new Telerik Support Portal.
Watch a video on how to optimize your support resource searches and check out more tips on the blogs.
0
John
Top achievements
Rank 1
answered on 03 Sep 2009, 07:36 PM
Thanks very much !
0
Gaurav
Top achievements
Rank 1
answered on 02 Mar 2011, 02:44 PM
Hi,

I am using the same code to set the default font. this is working fine in IE but not working in mozilla.

<script type='text/javascript'>  
function OnClientLoad(editor, args)  
{  
    var style = editor.get_contentArea().style;  
    style.fontFamily= 'Arial';  
    style.fontSize= 12 + 'px';  
 
    var tool = editor.getToolByName("FontName");  
 
    if (tool)  
    {  
            tool.set_value("Arial"); 
    } 
     
    var tool2 = editor.getToolByName("RealFontSize");  
 
    if (tool2)  
    {  
            tool2.set_value("12px"); 
    } 
}  
</script>  
 <telerik:RadEditor ID="RadEditor1" OnClientLoad="OnClientLoad" runat="server">  
</telerik:RadEditor>  

Thanks
Gaurav
0
Rumen
Telerik team
answered on 02 Mar 2011, 05:34 PM
Hi Gaurav,

The only difference in Firefox that I can see is that the FontName dropdown does not show 12px. You can fix this by setting a small timeout

 if (tool) { setTimeout(function () { tool.set_value("Arial"); }, 100); }

<script type='text/javascript'>
    function OnClientLoad(editor, args) {
        var style = editor.get_contentArea().style;
        style.fontFamily = 'Arial';
        style.fontSize = 12 + 'px';
 
        var tool = editor.getToolByName("FontName");
 
        if (tool) {
            setTimeout(function () {
                tool.set_value("Arial");
            }, 100);
        }
 
        var tool2 = editor.getToolByName("RealFontSize");
 
        if (tool2) {
            tool2.set_value("12px");
        }
    
</script> 
 <telerik:RadEditor ID="RadEditor1" OnClientLoad="OnClientLoad" runat="server"
</telerik:RadEditor>


Kind regards,
Rumen
the Telerik team
Registration for Q1 2011 What’s New Webinar Week is now open. Mark your calendar for the week starting March 21st and book your seat for a walk through all the exciting stuff we ship with the new release!
0
Gaurav
Top achievements
Rank 1
answered on 03 Mar 2011, 05:45 AM
Hi Telerik,

Everything is fine. on page load font has been set. But ASA I click on editable area, default font ('Arial') changed with 'Font Name'.
I want ASA User click on editable area, default font must be show which is working fine in IE but not in mozilla. I am using 3.6.14 version of mozilla.

Pls see attachment.


One thing more I would like to clear when I am saving font in database at that time in code behind I get like this

string text=radTopTextbox.Content.Trim();//radTopTextbox is the id of telerik:RadEditor

text=<span style="font-family: arial;">Top text 1<br /> qweqwe</span>

Now font is saving like 'arial'. while it must be save like 'Arial'
that why at the time to display default font it is displaying like 'arial'.
0
Rumen
Telerik team
answered on 08 Mar 2011, 03:04 PM
Hi Gaurav,

1) See and try the solution provided in the following forum: RadEditor : Font Name : Initial value never gets set in Firefox.

2) It is the ConvertToXhtml filter of RadEditor that converts all attributes and theirs values to lowercase. If you want you can convert the font names on the server using the String.Replace method, e.g.

string text=radTopTextbox.Content.Replace("font-family: arial;", "font-family: Arial;");

Kind regards,
Rumen
the Telerik team
Registration for Q1 2011 What’s New Webinar Week is now open. Mark your calendar for the week starting March 21st and book your seat for a walk through all the exciting stuff we ship with the new release!
0
Shekhar
Top achievements
Rank 1
answered on 15 Nov 2011, 08:53 AM
Can u provide me the url of same link that are mention above.
i am facing the same problem
0
Shinu
Top achievements
Rank 2
answered on 15 Nov 2011, 10:11 AM
0
Shekhar
Top achievements
Rank 1
answered on 15 Nov 2011, 11:14 AM
Hi Shinu,

Thanx a lot its working f9.
0
Sanjay
Top achievements
Rank 1
answered on 01 Nov 2014, 08:08 AM
Thanks Team,

Its really help full. It has resolved my Problem.
0
Abdallah
Top achievements
Rank 1
answered on 13 Nov 2014, 05:15 PM
I need to set  the fontFamily to Lato , I know that Lato is not figuring the font family list 
how can I set the font family to Lato  ?

is the below  implementation works ?


ASPX:
<telerik:RadEditor ID="RadEditor1" OnClientLoad="OnClientLoad" runat="server"> 
</telerik:RadEditor> 



JavaScript:
<script type='text/javascript'>
function OnClientLoad(editor, args) 

  var style = editor.get_contentArea().style; 
  style.fontFamily= 'Lato';



</script> 
Tags
Editor
Asked by
John
Top achievements
Rank 1
Answers by
Shinu
Top achievements
Rank 2
John
Top achievements
Rank 1
Rumen
Telerik team
Gaurav
Top achievements
Rank 1
Shekhar
Top achievements
Rank 1
Sanjay
Top achievements
Rank 1
Abdallah
Top achievements
Rank 1
Share this question
or