locked
Htmleditorextender Set default font family RRS feed

  • Question

  • User-1835835255 posted

    How would you set the default font family type to Georgia of an html editor extender.  The html editor extender default font type is Arial when page loads but when the page loads I want it to set it to Georgia automatically.

    I saw one post to set it through javascript for font size.  

    <script type='text/javascript'>
         setTimeout(function(){ document.getElementById('<%= YourHtmlEditorExtender.ClientID %>').getElementsByTagName('select')[1].value = 3; }, 1000);
    </script>

    How would you do this for font family or do it somehow with css?

    Thanks

    Friday, March 11, 2016 7:59 PM

Answers

  • User2103319870 posted

    chjones2008

    How would you do this for font family or do it somehow with css?

    You can set the defaault font to Editor by using below css style

     <style>
                .ajax__html_editor_extender_texteditor {
                    font-family: Georgia !important;
                }
            </style>

    If you want to set the font dropdown also to Georgia, you can use the below approach. But you need to find the Font Dropdownlist controlid using the F12 Developer tools 

    Then use the below Jquery function to set the value in dropdownlist

    <script type='text/javascript'>
            setTimeout(function () {
                document.getElementById('HtmlEditorExtender1FontName').options[2].selected = true;
            }, 0);
        </script>

    Please note that you need to add this after the HTMLEditor control

    Complete Code

    <html xmlns="http://www.w3.org/1999/xhtml">
    <head runat="server">
        <title></title>
        <script src="https://code.jquery.com/jquery-2.1.4.js"></script>
    </head>
    <body>
        <form id="form1" runat="server">
            <div>
                <asp:ScriptManager ID="ScriptManager1" runat="server"></asp:ScriptManager>
                <asp:TextBox ID="TextBox1" runat="server"></asp:TextBox>
                <ajaxToolkit:HtmlEditorExtender ID="HtmlEditorExtender1" runat="server" TargetControlID="TextBox1"></ajaxToolkit:HtmlEditorExtender>
            </div>
            <style>
                .ajax__html_editor_extender_texteditor {
                    font-family: Georgia !important;
                }
            </style>
        </form>
        <script type='text/javascript'>
            setTimeout(function () {
                document.getElementById('HtmlEditorExtender1FontName').options[2].selected = true;
            }, 0);
        </script>
    </body>
    </html>

    • Marked as answer by Anonymous Thursday, October 7, 2021 12:00 AM
    Friday, March 11, 2016 9:08 PM

All replies

  • User2103319870 posted

    chjones2008

    How would you do this for font family or do it somehow with css?

    You can set the defaault font to Editor by using below css style

     <style>
                .ajax__html_editor_extender_texteditor {
                    font-family: Georgia !important;
                }
            </style>

    If you want to set the font dropdown also to Georgia, you can use the below approach. But you need to find the Font Dropdownlist controlid using the F12 Developer tools 

    Then use the below Jquery function to set the value in dropdownlist

    <script type='text/javascript'>
            setTimeout(function () {
                document.getElementById('HtmlEditorExtender1FontName').options[2].selected = true;
            }, 0);
        </script>

    Please note that you need to add this after the HTMLEditor control

    Complete Code

    <html xmlns="http://www.w3.org/1999/xhtml">
    <head runat="server">
        <title></title>
        <script src="https://code.jquery.com/jquery-2.1.4.js"></script>
    </head>
    <body>
        <form id="form1" runat="server">
            <div>
                <asp:ScriptManager ID="ScriptManager1" runat="server"></asp:ScriptManager>
                <asp:TextBox ID="TextBox1" runat="server"></asp:TextBox>
                <ajaxToolkit:HtmlEditorExtender ID="HtmlEditorExtender1" runat="server" TargetControlID="TextBox1"></ajaxToolkit:HtmlEditorExtender>
            </div>
            <style>
                .ajax__html_editor_extender_texteditor {
                    font-family: Georgia !important;
                }
            </style>
        </form>
        <script type='text/javascript'>
            setTimeout(function () {
                document.getElementById('HtmlEditorExtender1FontName').options[2].selected = true;
            }, 0);
        </script>
    </body>
    </html>

    • Marked as answer by Anonymous Thursday, October 7, 2021 12:00 AM
    Friday, March 11, 2016 9:08 PM
  • User-1835835255 posted

    Does it matter that the control is inside of a LoginView control called LoginView1?

    Thanks

    Friday, March 11, 2016 9:32 PM
  • User2103319870 posted

    Does it matter that the control is inside of a LoginView control called LoginView1?

    Yes the control id will change accordingly. Post your sourcecode if possible

    Friday, March 11, 2016 9:34 PM
  • User-1835835255 posted

    Hey it worked I changed the name of the field to the one i found. Thanks a bunch

    Friday, March 11, 2016 9:36 PM