Изменение семейства шрифтов по умолчанию в TinyMCE

Я успешно изменил шрифт по умолчанию в редакторе, используя документацию здесь, но это оставляет мне проблему. Исходный шрифт по умолчанию больше не работает в раскрывающемся списке шрифтов.

Исходный вариант по умолчанию: Verdana
Новое значение по умолчанию: MyCustomFont

При вводе в редактор я вижу шрифт MyCustomFont по умолчанию. Если я попытаюсь изменить это на Verdana (исходный по умолчанию), ничего не происходит. Я могу изменить его на любые семейства шрифтов, кроме Верданы. Я также заметил, что когда я выбираю MyCustomFont в выпадающем списке, контент попадает в диапазон с встроенными стилями. Это не происходит с исходным шрифтом по умолчанию (следовательно, почему ничего не происходит).

Мне кажется, что отсутствует ключевая часть документации - как сообщить редактору (в частности, функцию шрифта), что шрифт, который я определил по умолчанию в css, является шрифтом по умолчанию.

Я немного искал Google, но не имел никаких результатов. Кажется, что все остальные полагаются на документацию, упомянутую выше. Я единственный, у кого есть эта проблема? Если нет, пожалуйста, помогите!:)

Обратите внимание: ответы на этот не отвечают на мой вопрос.

Ответ 1

возможно, слишком поздно, но...

$('.tinymce').tinymce({
    setup : function(ed) {
        ed.onInit.add(function(ed) {
            ed.execCommand("fontName", false, "Arial");
            ed.execCommand("fontSize", false, "2");
        });
    }
});

ИЗМЕНИТЬ

Для TinyMCE 4, как @jason-tolliver и @georg, синтаксис:

ed.on('init', function (ed) {
    ed.target.editorCommands.execCommand("fontName", false, "Arial");
});

Ответ 2

// Init TinyMCE
$('#content').tinymce({
    setup : function(ed)
    {
        ed.on('init', function() 
        {
            this.getDoc().body.style.fontSize = '12px';
            this.getDoc().body.style.fontFamily = 'serif';
        });
    }
});

Ответ 3

Для тех, кто инициализирует timymce с помощью tinymce.init({ и не может выполнить прямой ответ Radius Kuntoro.

Мой init выглядит как

tinymce.init({
            selector: '#editor',
            menubar: false,
            plugins: ['bbcode'],
            toolbar: 'undo redo | bold italic underline',    
            setup : function(ed)
            {
                ed.on('init', function() 
                {
                    this.getDoc().body.style.fontSize = '12';
                    this.getDoc().body.style.fontFamily = 'Arial';
                });
            },
        });

Ответ 4

Для TinyMCE 4.6.3 это, по-видимому, способ:

tinymce.init({
    setup: function (ed) {
        ed.on('init', function (e) {
            ed.execCommand("fontName", false, "Verdana");
        });
    }
});

Ответ 5

Некоторые из вас будут работать в пределах TinyMCE EditorManager, который предлагает два события: AddEditor и RemoveEditor. Когда новый экземпляр TinyMCE генерируется и AddEditor запускается, редактор фактически не инициализируется, поэтому вызов getDoc() возвращает null.

Что вам нужно сделать, это создать прослушиватель init внутри.

tinyMCE.EditorManager.on('AddEditor', function (event) {
    ... other code ...

    event.editor.on('init', function() {
      this.activeEditor.getDoc().body.style.fontSize = '12px';
      this.activeEditor.getDoc().body.style.fontFamily = 'Times New Roman';
    });

    ... other code ...
  }
});

Это, по крайней мере, верно с версии 4.3.8

Ответ 6

Как говорится на веб-сайте TinyMce, вы можете встраивать таблицу стилей в свою функцию init следующим образом:

tinymce.init({
    content_css : 'path/to/style/sheet',
    body_class: 'define-class-name-without-dot-at-the-first'
});

Это работает, и вам не нужно ничего настраивать. проверить его на веб-странице tinyMCE

Ответ 7

У меня возникли трудности со всеми решениями здесь в tinymce 4.x Я не мог изменить ни fontsize, ни fontname. После многих попыток я нашел решение. Прежде всего, я могу подтвердить ответ Джаред, спасибо за это! Эти две команды не будут работать по умолчанию:

tinymce.EditorManager.execCommand("fontName", false, "12px");
tinymce.EditorManager.execCommand("fonSize", false, "Arial");

Размер шрифта по умолчанию - "pt", а не "px". Поэтому либо определите отображаемый fontSize как "px" с помощью [fontsize_formats] [1], либо просто передайте желаемый размер с помощью "pt". С tinymce.EditorManager.execCommand tinymce также недовольны. Вы должны передать всю семейство шрифтов, например, "arial, helvetica, sans-serif". Эти команды работали на моем сайте:

tinymce.EditorManager.execCommand("fontName", false, "12pt");
tinymce.EditorManager.execCommand("fonSize", false, "arial, helvetica, sans-serif");