Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

How do I change the Font Style in ACE editor?

I am using ACE editor on my page,

<script src="ace-builds-master/src-noconflict/ace.js" type="text/javascript" charset="utf-8">
</script>
<script>
    var editor = ace.edit("editor");
    editor.setTheme("ace/theme/cobalt");
    editor.getSession().setMode("ace/mode/geco");
</script>

By default it is showing a font, I want to change my font to 'Tahoma 10pt'.

How do I do that?


2 Answers

To change font you can either add a css rule for #editor. or use

editor.setOptions({
  fontFamily: "tahoma",
  fontSize: "10pt"
});

But Ace only supports monospace fonts for now, and tahoma isn't monospace, so cursor position will be wrong.

like image 192
a user Avatar answered Sep 05 '25 04:09

a user


To my knowledge there is no shortcut to directly change Ace's font family other than editor.setOptions().

However you can set the font size in pixels directly by calling:

editor.setFontSize(10) // will set font-size: 10px
like image 36
Jivan Avatar answered Sep 05 '25 05:09

Jivan