13


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"
});
4

5 回答 5

7

看起来 TinyMCE 4 已经更新，自定义字体现在可以使用了。

检查此链接以获取 CSS 字体源： http ://www.tinymce.com/wiki.php/Configuration:content_css

检查此链接以获取自定义字体设置： https ://www.tinymce.com/docs/configure/content-formatting/#font_formats

奇怪的是，有些字体有效（自定义字体列表名称上的字体样式是正确的 - 绿色），有些不是（列出了自定义字体，但样式不是假定的字体样式 - 红色）

TinyMCE 4 自定义字体预览

于 2013-06-19T06:56:15.427 回答
6

看起来 theme_advanced_fonts 有问题并且尚未修复。我正在使用带有 style_formats 的替代解决方案来定义字体

tinymce.init({
        ...
        toolbar: "styleselect",
        style_formats: [
            {title: 'Open Sans', inline: 'span', styles: { 'font-family':'Open Sans'}},
            {title: 'Arial', inline: 'span', styles: { 'font-family':'arial'}},
            {title: 'Book Antiqua', inline: 'span', styles: { 'font-family':'book antiqua'}},
            {title: 'Comic Sans MS', inline: 'span', styles: { 'font-family':'comic sans ms,sans-serif'}},
            {title: 'Courier New', inline: 'span', styles: { 'font-family':'courier new,courier'}},
            {title: 'Georgia', inline: 'span', styles: { 'font-family':'georgia,palatino'}},
            {title: 'Helvetica', inline: 'span', styles: { 'font-family':'helvetica'}},
            {title: 'Impact', inline: 'span', styles: { 'font-family':'impact,chicago'}},
            {title: 'Symbol', inline: 'span', styles: { 'font-family':'symbol'}},
            {title: 'Tahoma', inline: 'span', styles: { 'font-family':'tahoma'}},
            {title: 'Terminal', inline: 'span', styles: { 'font-family':'terminal,monaco'}},
            {title: 'Times New Roman', inline: 'span', styles: { 'font-family':'times new roman,times'}},
            {title: 'Verdana', inline: 'span', styles: { 'font-family':'Verdana'}}
        ],
        ...
});

结果：使用 style_formats 定义字体

于 2013-05-26T09:39:09.513 回答
4 
tinymce.init({
        ...
        字体格式：
                "默认='myFontFace', Arial, Helvetica, Tahoma, Verdana, sans-serif;"+
                "Arial=arial,helvetica,sans-serif",
        ...
});
于 2014-08-07T12:35:38.700 回答
3

在 tinymce 4 中，theme_advanced_fonts 已重命名为 font_formats。

您可以从 https://www.tinymce.com/docs/configure/content-formatting/#font_formats找到详细信息

于 2016-05-06T03:57:17.050 回答
2

从 tinyMCE 4 中删除了“高级”和“简单”主题。添加的新主题称为“现代”。

http://www.tinymce.com/wiki.php/Tutorial:Migration_guide_from_3.x

于 2013-07-06T05:39:26.927 回答