首页 文章

TinyMCE 4 theme_advanced_fonts

提问于
浏览
12

我正在尝试在TinyMCE Editor 4.0b1中添加自定义字体系列并继续失败 .
显示所有默认字体,'Century Gothic'或'Gill Sans MT'等自定义字体未显示 . theme_advanced_fonts在TinyMCE 4中不起作用吗?我找不到任何TinyMCE 4文档 .

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

5 回答

  • 5

    看起来TinyMCE 4已经更新,自定义字体现在可以正常工作 .

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

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

    奇怪的是,一些字体工作(自定义字体列表名称上的字体样式是正确的 - 绿色),有些不是(自定义字体列出,但样式不是假定的字体样式 - 红色)

    TinyMCE 4 custom font preview

  • 4

    看起来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'}}
            ],
            ...
    });
    

    结果:
    using style_formats for defining fonts

  • 7
    tinymce.init({
            ...
            font_formats: 
                    "Default='myFontFace', Arial, Helvetica, Tahoma, Verdana, sans-serif;"+
                    "Arial=arial,helvetica,sans-serif",
            ...
    });
    
  • 3

    在tinymce 4中,theme_advanced_fonts已重命名为font_formats .

    你可以找到https://www.tinymce.com/docs/configure/content-formatting/#font_formats的细节

  • 2

    'advanced'和'simple'主题已从tinyMCE 4中删除 . 添加的新主题称为'modern' .

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

相关问题