Отключение валидации тегов в TinyMCE — различия между версиями
Материал из Umicms
Vitaliks (обсуждение | вклад) |
Aposio (обсуждение | вклад) |
||
| Строка 1: | Строка 1: | ||
| − | + | '''Актуально для версии 21''' | |
| − | |||
| + | == Задача == | ||
| + | Отключить изменение тегов визуальным редактором. | ||
| + | |||
| + | == Решение == | ||
| + | Добавить нужные элементы в список допустимых элементов. | ||
| + | |||
| + | Например, имеется следующий код, который нужно добавить через визуальный редактор: | ||
| + | <source lang="html"> | ||
| + | <iframe src="example.com" width="100" height="100" frameborder="0" allow="autoplay;fullscreen" allowfullscreen></iframe> | ||
| + | </source> | ||
| + | Из данного тега редактор автоматически удалит атрибуты frameborder, allow и allowfullscreen, так как посчитает их невалидными.<br> | ||
| + | |||
| + | |||
| + | Кастомизацию визуального редактора нужно производить в фале styles/common/js/cms/wysiwyg/tinymce47/tinymce_custom.js.<br> | ||
| + | Для разрешения отдельных атрибутов можно указать их по-отдельности: | ||
<source lang="javascript"> | <source lang="javascript"> | ||
| − | + | extended_valid_elements : 'iframe[frameborder|allow]' | |
| − | + | </source> | |
| − | + | А можно разрешить для тега iframe любые атрибуты: | |
| − | + | <source lang="javascript"> | |
| − | + | extended_valid_elements : 'iframe[*]' | |
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
</source> | </source> | ||
| − | |||
| + | После внесения нужных правок содержимое файла tinymce_custom.js будет выглядеть следующим образом: | ||
<source lang="javascript"> | <source lang="javascript"> | ||
window.mceCustomSettings = { | window.mceCustomSettings = { | ||
| − | + | content_css : '/styles/common/js/cms/wysiwyg/tinymce47/tinymce_custom.css', | |
| − | + | extended_valid_elements : 'iframe[*]' // элементы можно перечислять через запятую | |
| − | + | }; | |
| − | |||
| − | |||
} | } | ||
</source> | </source> | ||
| − | + | Для более тонкой настройки редактора можно обратиться к официальной документации: [https://www.tiny.cloud/docs/configure TinyMCE configuration options reference] | |
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
| − | |||
[[Категория:Решение проблем и ошибок]][[Категория:Вопросы и уроки разработки сайтов на UMI.CMS]] | [[Категория:Решение проблем и ошибок]][[Категория:Вопросы и уроки разработки сайтов на UMI.CMS]] | ||
Версия 09:38, 2 апреля 2020
Актуально для версии 21
Задача
Отключить изменение тегов визуальным редактором.
Решение
Добавить нужные элементы в список допустимых элементов.
Например, имеется следующий код, который нужно добавить через визуальный редактор:
<iframe src="example.com" width="100" height="100" frameborder="0" allow="autoplay;fullscreen" allowfullscreen></iframe>
Из данного тега редактор автоматически удалит атрибуты frameborder, allow и allowfullscreen, так как посчитает их невалидными.
Кастомизацию визуального редактора нужно производить в фале styles/common/js/cms/wysiwyg/tinymce47/tinymce_custom.js.
Для разрешения отдельных атрибутов можно указать их по-отдельности:
extended_valid_elements : 'iframe[frameborder|allow]'
А можно разрешить для тега iframe любые атрибуты:
extended_valid_elements : 'iframe[*]'
После внесения нужных правок содержимое файла tinymce_custom.js будет выглядеть следующим образом:
window.mceCustomSettings = {
content_css : '/styles/common/js/cms/wysiwyg/tinymce47/tinymce_custom.css',
extended_valid_elements : 'iframe[*]' // элементы можно перечислять через запятую
};
}
Для более тонкой настройки редактора можно обратиться к официальной документации: TinyMCE configuration options reference
