Как изменить размер шрифта по умолчанию в tinymce?

Question

Я использую редактор jquery tinymce.Размер шрифта по умолчанию - 10. Мне нравится изменять размер шрифта по умолчанию.Как я могу это сделать,

Answer 1

Вам нужно использовать параметр content_css для tinymce, чтобы установить свой собственный файл CSS (убедитесь, что этот параметр указывает на правильное расположение файла CSS). Этот файл будет вставлен в заголовок iframes редактора после того, как все остальные настройки CSS (файлы из ядра) будут вставлены туда при инициализации tinymce - таким образом, все настройки, которые вы поместите в свой файл, будут перезаписаны настройки, сделанные ранее (по 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>

Answer 5

Или просто найдите файл css, который используется tinymce, и измените font-size.Например, если вы используете простую тему, перейдите куда-нибудь так: js/themes/simple/skins/default/content.css и там измените font-size.Работаю на меня.

Answer 6

Я просто оставлю это здесь, с tinyMCE 4 теперь:

setup : function(ed) {
 ed.on('init', function(ed) {
  ed.target.editorCommands.execCommand("fontName", false, "Calibri");
  ed.target.editorCommands.execCommand("fontSize", false, "11pt");
 });
}

Answer 7

Просто отредактируйте

tinymce / themes / advanced / skins / o2k7 / content.css

и измените размер шрифта в этой строке:

body, td, pre {color:#000; font-family:Verdana, Arial, Helvetica, sans-serif; font-size:10px; margin:8px;}

Answer 8

Один из вариантов - content_style, где вы можете добавить дополнительные CSS в редактор.

tinymce.init({
  selector: 'textarea',  // change this value according to your HTML
  content_style: "div, p { font-size: 15px; }"
});

К сожалению, вы не можете просто установить body без !important из-за порядка, в котором они устанавливают CSS.

Также я не позволяю людям изменять размер шрифта - и это, скорее всего, пойдет не так.

Это помогло мне изменить размер по умолчанию при просмотре, но вы должны быть осторожны, если вы позволите людям изменять размер шрифта после этого.

Для меня этот быстрый и грязный подход был всем, что мне было нужно, потому что HTML-код, который я редактирую, очень прост.

Answer 9

Вот как это сделать без какой-либо кодировки

1. Используйте плагин 'TinyMCE Advanced'
2. Активируйте его в настройках.

Более подробные инструкции здесь .

Answer 10

в tinymce/themes/advanced/skins/o2k7/content.css добавить css:

#tinymce {  font-size: 15px;}