default jhtml font-family

Nov 20, 2009 at 9:40 AM
Edited Nov 20, 2009 at 9:47 AM

hi,

the default font-family in my jhtml editor is Times, but i need to change it to Verdana or something alike, i have try with css but the font stays the same ?

(i am able to change the font family if you click "view source" but cant change it in the editor preview)

thanks

Jan 8, 2010 at 9:54 AM

Hi Cris,

Simply create a CSS file with the font-family declaration set on the <body> tag selector. Then, add the path to the CSS file in your jHTMLEditor options. For example:

 

<script type="text/javascript">
$(document).ready(function() {
    $('textarea').htmlarea({
        css: '/css/editor.css'
    });
});
</script>

Hope this helps.

Regards,
Martin 

 

Jan 18, 2011 at 10:19 AM

Hello Martin,

I am also having the same problem. I want to change the default font of the editor and I applied as you wrote but no result. Can you please show me an example with javascript and css.

Feb 9, 2011 at 3:47 AM

This is a great plugin.  Thanks. 

This is the only issue I'm having.  I tried the following and still could not get the font within the jHtmlArea textarea to use these settings.

    $("#eventDescriptionEdit").htmlarea({
	toolbar: [
	  "html", "|", "forecolor", "|", "bold", "italic", "underline", "|", "increaseFontSize", "decreaseFontSize", 
	  "indent", "outdent", "|", "orderedList", "unorderedList", "|", "link", "unlink"
	],
	css: 'jHtmlAreaCustom.css'
    });

where the jHtmlAreaCustom.css file contains

/*
 * Custom styles to force font size in jHtmlArea
 *
 */

body { font-family: Verdana,Arial,sans-serif/*{ffDefault}*/; font-size: 1.1em/*{fsDefault}*/; }

I also tried setting style for text and textarea elements with the same result of no change to the jHtmlArea within my jQuery UI dialog.
Feb 19, 2013 at 3:56 PM
Hi
Any news on this? I'm also not able to use default css for the jhtmlarea.
Thanks

Cornelia Sihota
Dec 10, 2013 at 8:25 PM
Edited Dec 10, 2013 at 8:27 PM
you can use jquery to change the default font styling
$(".jHtmlArea iframe").contents().find("body").css('color','blue').css('font-family','cursive');