如何在tinymce中更改默认字体大小？

Question

我正在使用jquery tinymce编辑器.默认字体大小为10.我想更改默认字体大小.我怎样才能做到这一点,

Answer 1

您需要使用tinymce 的content_css设置来设置自己的自定义css文件(确保此设置指向css文件的有效位置).在初始化tinymce时,将所有其他css设置(来自核心的文件)插入到编辑器iframes后,此文件将被插入到编辑器中.因此,您放置在文件中的所有设置都将覆盖之前所做的设置(通过tinymce).

示例: 将默认字体大小设置为11px.自定义css文件的内容(我在我的安装中将其命名为content.css):

body {
    font-family: Verdana,Arial,Helvetica,sans-serif;
    font-size: 11px;
}

如何使用此设置:

tinyMCE.init({
 ...
 // you do not need to include it yourself, tinymce will do this for you, 
 // but you will need to give tinymce the location of your css file
 content_css : "http://www.myserver.com/css/content.css", 
     ...
});

Answer 2

我以这种方式在我的项目中使用过

tinymce.init({
  selector:"#txt1",
  setup : function(ed)
  {
    ed.on('init', function() 
    {
        this.execCommand("fontName", false, "tahoma");
        this.execCommand("fontSize", false, "12px");
    });
  }  
}); 

这比仅仅更改'content.css'中的属性值更好的方法

Answer 3

只需将此行添加到选项中即可

content_style: ".mce-content-body {font-size:15px;font-family:Arial,sans-serif;}",

所以它看起来像这样

tinymce.init({
    selector: "textarea",theme: "modern",width: '100%',min_height:350 ,menubar:false,
     content_style: ".mce-content-body {font-size:15px;font-family:Arial,sans-serif;}",
    browser_spellcheck : true,
    plugins: 
    [
         "advlist autolink link image lists charmap print preview hr anchor pagebreak",
         "searchreplace wordcount visualblocks visualchars insertdatetime media nonbreaking",
         "table contextmenu directionality emoticons paste textcolor responsivefilemanager code"
    ],
   toolbar1: " undo redo preview code | \n\
                 link  bold italic underline | hr | image responsivefilemanager media |unlink anchor  | ",
   image_advtab: true ,

   external_filemanager_path:"/tinymce/filemanager/",
   filemanager_title:"Responsive Filemanager" ,
   relative_urls: false,
    remove_script_host : false,
   external_plugins: { "filemanager" : "/tinymce/filemanager/plugin.min.js"}
 });

Answer 4

<script type="text/javascript">
    tinyMCE.init({
        mode : "textareas",
            setup : function(ed)
            {
                // set the editor font size
                ed.onInit.add(function(ed)
                {
                ed.getBody().style.fontSize = '10px';
                });
            },
            });
</script>