TinyMCE 4 theme_advanced_fonts

v1n_vampire picture v1n_vampire · May 16, 2013 · Viewed 17.8k times · Source


I'm trying to add custom font family in TinyMCE Editor version 4.0b1 and keep failing.
All default fonts show, custom fonts like 'Century Gothic' or 'Gill Sans MT' are not showing. Is theme_advanced_fonts not working in TinyMCE 4? I can't find any TinyMCE 4 documentation for this.

tinymce.init({
  selector: "textarea",
  plugins: [
      "advlist autolink lists link image charmap print preview anchor",
      "searchreplace visualblocks code fullscreen",
      "insertdatetime media table contextmenu paste"
  ],
  toolbar: "undo redo | bold italic | alignleft aligncenter alignright alignjustify | bullist numlist | link image | fontselect fontsizeselect | forecolor backcolor",
  convert_urls: false,
  content_css: 'http://www.mydomain.com/css/fonts.css',
  theme_advanced_font_sizes : "8px,10px,12px,14px,16px,18px,20px,24px,32px,36px",
  theme_advanced_fonts : "Andale Mono=andale mono,times;"+
                         "Arial=arial,helvetica,sans-serif;"+
                         "Arial Black=arial black,avant garde;"+
                         "Book Antiqua=book antiqua,palatino;"+
                         "Comic Sans MS=comic sans ms,sans-serif;"+
                         "Courier New=courier new,courier;"+
                         "Century Gothic=century_gothic;"+
                         "Georgia=georgia,palatino;"+
                         "Gill Sans MT=gill_sans_mt;"+
                         "Gill Sans MT Bold=gill_sans_mt_bold;"+
                         "Gill Sans MT BoldItalic=gill_sans_mt_bold_italic;"+
                         "Gill Sans MT Italic=gill_sans_mt_italic;"+
                         "Helvetica=helvetica;"+
                         "Impact=impact,chicago;"+
                         "Iskola Pota=iskoola_pota;"+
                         "Iskola Pota Bold=iskoola_pota_bold;"+
                         "Symbol=symbol;"+
                         "Tahoma=tahoma,arial,helvetica,sans-serif;"+
                         "Terminal=terminal,monaco;"+
                         "Times New Roman=times new roman,times;"+
                         "Trebuchet MS=trebuchet ms,geneva;"+
                         "Verdana=verdana,geneva;"+
                         "Webdings=webdings;"+
                         "Wingdings=wingdings,zapf dingbats"
});

Answer

v1n_vampire picture v1n_vampire · Jun 19, 2013

Looks like TinyMCE 4 has been updated, custom fonts works now.

Check this link for the CSS font source: http://www.tinymce.com/wiki.php/Configuration:content_css

Check this link for the custom font setting: https://www.tinymce.com/docs/configure/content-formatting/#font_formats

The weird thing is, some of the fonts work (the font style on the custom font list name is correct - green), some not (custom font listed, but the style is not the supposed font style - red)

TinyMCE 4 custom font preview