default jhtml font-family

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


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)


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() {
        css: '/css/editor.css'

Hope this helps.



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.

	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
Any news on this? I'm also not able to use default css for the jhtmlarea.

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');