форматирование tinymce

#css #tinymce

#css #tinymce

Вопрос:

Я использую следующий блок кода для форматирования текста:

     'formats': {
        'format_code': {
            'block': 'pre',
            'styles': {
                'color': '#000000',
                'backgroundColor': '#f0f0f0',
                'fontFamily': 'monaco,consolas,courier new,monospace',
                'fontSize': '1.0em',
                'width': '80%',
                'minHeight': '5.0em',
                'maxHeight': '15.0em',
                'overflow': 'auto',
                'border': '1px solid #999999',
                'padding': '1.0em'
            }
        }
  

Этот блок кода был предоставлен мне. Теперь я хотел бы изменить его, чтобы использовать класс CSS.

Кто-нибудь может посоветовать мне, как это сделать. Я не знаком с TinyMCE.

Ответ №1:

CSS практически идентичен. Свойства camelCase в CSS разделены тире, а шрифт, содержащий пробел, должен быть заключен в кавычки.

 .myClassSelector {
    color:#000000;
    backgroundColor:#f0f0f0;
    font-family:monaco,consolas,"courier new",monospace;
    font-size:1em;
    width:80%;
    min-height:5em;
    max-height:15em;
    overflow:auto;
    border:1px solid #999999;
    padding:1em;
}
  

Я предполагаю, что вы хотите добавить его в выпадающий список стилей в TinyMCE. Если вы хотите добавить его в раскрывающийся список «Формат«, то для этого требуется другой параметр конфигурации.

Если вам нужен новый стиль в раскрывающемся списке, вам нужно поместить приведенное выше правило класса CSS в .css файл и настроить TinyMCE следующим образом:

 tinyMCE.init({
    theme:'advanced',
    content_css:'path/to/css/file',
    style_formats : [
        {title : 'My Style', block : 'div', classes : 'myClassSelector'}
    ]
});