Отключение валидации тегов в TinyMCE — различия между версиями
Alexei (обсуждение | вклад) |
Aposio (обсуждение | вклад) м (Aposio переименовал страницу Отключение модерации тегов в TinyMCE в Отключение валидации тегов в TinyMCE) |
||
(не показано 12 промежуточных версий 4 участников) | |||
Строка 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"> | ||
+ | extended_valid_elements : 'iframe[frameborder|allow]' | ||
+ | </source> | ||
+ | А можно разрешить для тега iframe любые атрибуты: | ||
+ | <source lang="javascript"> | ||
+ | extended_valid_elements : 'iframe[*]' | ||
+ | </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:39, 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