Визуальный редактор: Пользовательская настройка — различия между версиями

Материал из Umicms
Перейти к:навигация, поиск
 
(не показано 5 промежуточных версий 2 участников)
Строка 23: Строка 23:
 
</source>
 
</source>
  
'''Обратите внимание:''' при модификации объекта следите за тем, чтобы после последней опции (перед }) не было запятой. В противном случае редактор перестанет работать в IE
+
Начиная с версии '''17 84088''' изменяемый файл '''/js/cms/wysiwyg/tinymce47/tinymce_custom.js'''
  
[[Категория:Визуальный редактор]]
+
Его примерное содержание:
 +
<source lang="javascript">
 +
/**
 +
* Глобальные кастомные настройки tinyMCE 4.7.
 +
* @link https://www.tinymce.com/docs/configure/
 +
* ...
 +
*/
 +
window.mceCustomSettings = {
 +
 
 +
// Файл с кастомным CSS
 +
// @link https://www.tinymce.com/docs/configure/content-appearance/#content_css
 +
content_css : '/js/cms/wysiwyg/tinymce47/tinymce_custom.css'
 +
};
 +
</source>
 +
'''Обратите внимание:''' при модификации объекта следите за тем, чтобы после последней опции (перед }) не было запятой. В противном случае редактор может не работать в IE
 +
[[Категория:Вопросы и уроки разработки сайтов на UMI.CMS]]

Текущая версия на 12:25, 31 мая 2018

С версии 2.6 у пользователя появилась возможность "тонкой" настройки визуального редактора, например, подключить свой css-файл, настроить классы для типовых элементов, изменить настройки по "чистке" избыточного кода и многое другое. Подробное описание всех параметров для настройки визивига можно прочитать здесь.

Конфигурационный файл

Для настройки визивига появился кастомный конфигурационный файл. Этот файл не будет перезаписан при обновлении.

Путь к файлу: /js/cms/wysiwyg/tinymce/jscripts/tiny_mce/tinymce_custom.js

Файл содержит код javascript-объекта window.mceCustomSettings, в начальной поставке файл выглядит примерно так:

// index/reference page for all available core configuration options in TinyMCE:
// http://wiki.moxiecode.com/index.php/TinyMCE:Configuration

window.mceCustomSettings = {
	convert_fonts_to_spans : true,	// convert <font ..> tags to <span style="color:red,...">
	cleanup : true,					// remove all unknown tags and attributes

	extended_valid_elements : "script[type=text/javascript|src|languge|lang],map[*],area[*],umi:*[*],input[*]", 
// extended tags and atributes
	content_css : "/css/cms/style.css", // enable custom CSS
	theme_advanced_styles : "Table=my-table;Table Cell=my-table-cell;Table Row=my-table-row" // custom css classes
}

Начиная с версии 17 84088 изменяемый файл /js/cms/wysiwyg/tinymce47/tinymce_custom.js

Его примерное содержание:

/**
 * Глобальные кастомные настройки tinyMCE 4.7.
 * @link https://www.tinymce.com/docs/configure/
 * ...
 */
window.mceCustomSettings = {

	// Файл с кастомным CSS
	// @link https://www.tinymce.com/docs/configure/content-appearance/#content_css
	content_css : '/js/cms/wysiwyg/tinymce47/tinymce_custom.css'
};

Обратите внимание: при модификации объекта следите за тем, чтобы после последней опции (перед }) не было запятой. В противном случае редактор может не работать в IE