Cómo cambiar el tamaño de fuente predeterminado en tinymce?


Estoy usando jquery tinymce editor. El tamaño de fuente predeterminado es 10. Me gusta cambiar el tamaño de fuente predeterminado. ¿Cómo puedo hacer eso,

Author: Thariama, 2010-12-13

11 answers

Debe usar la configuración content_css de tinymce para establecer un archivo css personalizado (asegúrese de que esta configuración apunte a una ubicación válida de un archivo css). Este archivo se insertará en el editor iframes head después de que todas las demás configuraciones css(archivos del núcleo) se inserten allí al inicializar tinymce - por lo tanto, todas las configuraciones que coloque en su archivo sobrescribirán las configuraciones realizadas antes (por tinymce).

Ejemplo: Establecer el tamaño de fuente predeterminado en 11px. Contenido de un archivo css personalizado (lo llamé contenido.css en mi instalación):

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

Cómo usar esta configuración:

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", 
     ...
});
 52
Author: Thariama,
Warning: date(): Invalid date.timezone value 'Europe/Kyiv', we selected the timezone 'UTC' for now. in /var/www/agent_stack/data/www/ajaxhispano.com/template/agent.layouts/content.php on line 61
2010-12-13 09:41:30

He utilizado en mi proyecto de esta manera

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

Esta es la mejor manera de cambiar los valores de propiedad en 'content.css "

 20
Author: Nishad Up,
Warning: date(): Invalid date.timezone value 'Europe/Kyiv', we selected the timezone 'UTC' for now. in /var/www/agent_stack/data/www/ajaxhispano.com/template/agent.layouts/content.php on line 61
2017-09-20 15:49:05

Simplemente agregue esta línea a las opciones

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

Así que se ve así

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"}
 });
 10
Author: user3721605,
Warning: date(): Invalid date.timezone value 'Europe/Kyiv', we selected the timezone 'UTC' for now. in /var/www/agent_stack/data/www/ajaxhispano.com/template/agent.layouts/content.php on line 61
2016-10-21 13:26:49
<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>
 5
Author: KwangKung,
Warning: date(): Invalid date.timezone value 'Europe/Kyiv', we selected the timezone 'UTC' for now. in /var/www/agent_stack/data/www/ajaxhispano.com/template/agent.layouts/content.php on line 61
2014-08-22 06:35:08

O simplemente encuentre el archivo css que utiliza tinymce y cambie font-size. Por ejemplo, si utiliza simple theme, vaya a algún lugar como este: js/themes/simple/skins/default/content.css y allí cambie font-size. Trabajando para mí.

 2
Author: krzyhub,
Warning: date(): Invalid date.timezone value 'Europe/Kyiv', we selected the timezone 'UTC' for now. in /var/www/agent_stack/data/www/ajaxhispano.com/template/agent.layouts/content.php on line 61
2011-09-12 11:43:06

Voy a dejar esto aquí, con TinyMCE 4 es ahora:

setup : function(ed) {
 ed.on('init', function(ed) {
  ed.target.editorCommands.execCommand("fontName", false, "Calibri");
  ed.target.editorCommands.execCommand("fontSize", false, "11pt");
 });
}
 1
Author: Georg,
Warning: date(): Invalid date.timezone value 'Europe/Kyiv', we selected the timezone 'UTC' for now. in /var/www/agent_stack/data/www/ajaxhispano.com/template/agent.layouts/content.php on line 61
2016-03-17 13:11:25

En tinymce/themes/advanced/skins/o2k7/content.css añadir css:

#tinymce {  font-size: 15px;}
 0
Author: Dung Vu,
Warning: date(): Invalid date.timezone value 'Europe/Kyiv', we selected the timezone 'UTC' for now. in /var/www/agent_stack/data/www/ajaxhispano.com/template/agent.layouts/content.php on line 61
2015-02-03 13:27:29

Una opción es content_style donde puede agregar css adicional al editor.

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

Desafortunadamente no puedes simplemente establecer body sin !important debido al orden en el que establecen el css.

Tampoco permito que la gente cambie el tamaño de la fuente, y esto probablemente se descontrolará.

Esto me ayudó a cambiar el tamaño 'predeterminado' como se ve, pero debe tener cuidado si deja que la gente cambie el tamaño de la fuente después de esto.

Para mí este enfoque rápido y sucio era todo lo que necesitaba porque el HTML que estoy editando es súper simple.

 0
Author: Simon Weaver,
Warning: date(): Invalid date.timezone value 'Europe/Kyiv', we selected the timezone 'UTC' for now. in /var/www/agent_stack/data/www/ajaxhispano.com/template/agent.layouts/content.php on line 61
2016-09-04 20:49:42

Simplemente edita

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

Y cambia el tamaño de la fuente en esta línea:

body, td, pre {color:#000; font-family:Verdana, Arial, Helvetica, sans-serif; font-size:10px; margin:8px;}
 0
Author: HRN,
Warning: date(): Invalid date.timezone value 'Europe/Kyiv', we selected the timezone 'UTC' for now. in /var/www/agent_stack/data/www/ajaxhispano.com/template/agent.layouts/content.php on line 61
2017-01-18 08:50:58

Por lo que sé, TinyMCE hereda el tamaño de fuente definido para la etiqueta padre, por ejemplo, la etiqueta<body>

 -1
Author: Aditya Manohar,
Warning: date(): Invalid date.timezone value 'Europe/Kyiv', we selected the timezone 'UTC' for now. in /var/www/agent_stack/data/www/ajaxhispano.com/template/agent.layouts/content.php on line 61
2010-12-13 09:34:39

Aquí está cómo hacerlo sin ninguna codificación

  1. Utilice el plugin 'TinyMCE Advanced'
  2. Activarlo en ajustes.

Instrucciones Más detalladas aquí.

 -2
Author: shadowoflight,
Warning: date(): Invalid date.timezone value 'Europe/Kyiv', we selected the timezone 'UTC' for now. in /var/www/agent_stack/data/www/ajaxhispano.com/template/agent.layouts/content.php on line 61
2015-04-07 09:17:16