Отключение валидации тегов в TinyMCE — различия между версиями

Материал из Umicms
Перейти к:навигация, поиск
 
(не показано 16 промежуточных версий 5 участников)
Строка 1: Строка 1:
−
Для того чтобы отключить модерацию тегов в визуальном редакторе откройте файл \js\tinymce\jscripts\tiny_mce\tinymce_custom.js
+
'''Актуально для версии 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 = {
−
extended_valid_elements :  
+
content_css : '/styles/common/js/cms/wysiwyg/tinymce47/tinymce_custom.css',
−
"a[*],abbr[*],acronym[*],address[*],applet[*],area[*],article[*],aside[*],audio[*],b[*],base[*],basefont[*],bdi[*],bdo[*],
+
extended_valid_elements : 'iframe[*]' // элементы можно перечислять через запятую
−
bgsound[*],big[*],blink[*],blockquote[*],body[*],br[*],button[*],canvas[*],caption[*],center[*],cite[*],code[*],col[*],
+
};
−
colgroup[*],command[*],comment[*],datalist[*],dd[*],del[*],details[*],dfn[*],dir[*],div[*],dl[*],dt[*],em[*],embed[*],
 
−
fieldset[*],figcaption[*],figure[*],font[*],footer[*],form[*],frame[*],frameset[*],h1[*],h2[*],h3[*],h4[*],h5[*],h6[*],
 
−
head[*],header[*],hgroup[*],hr[*],html[*],i[*],iframe[*],img[*],input[*],ins[*],isindex[*],kbd[*],keygen[*],label[*],
 
−
legend[*],li[*],link[*],listing[*],map[*],mark[*],marquee[*],menu[*],meta[*],meter[*],multicol[*],nav[*],nobr[*],
 
−
noembed[*],noframes[*],noscript[*],object[*],ol[*],optgroup[*],option[*],output[*],p[*],param[*],plaintext[*],pre[*],
 
−
progress[*],q[*],rp[*],rt[*],ruby[*],s[*],samp[*],script[*],section[*],select[*],small[*],source[*],spacer[*],span[*],
 
−
strike[*],strong[*],style[*],sub[*],summary[*],sup[*],table[*],tbody[*],td[*],textarea[*],tfoot[*],th[*],thead[*],time[*],
 
−
title[*],tr[*],track[*],tt[*],u[*],ul[*],var[*],video[*],wbr[*],xmp[*]"
 
−
content_css : "/css/cms/style.css"
 
 
}
 
}
 
</source>
 
</source>
  
−
<strong>UPD:</strong>
+
Для более тонкой настройки редактора можно обратиться к официальной документации: [https://www.tiny.cloud/docs/configure TinyMCE configuration options reference]
−
<br />В версиях после 2.8.5.3 адрес файла изменился на \js\cms\wysiwyg\tinymce\jscripts\tiny_mce\tinymce_custom.js<br />В версиях между 2.8.5.3 и 2.8.6.2 надо в файле - \js\cms\wysiwyg\wysiwyg.js, после 30 строки добавить запись - <source lang="javascript">jQuery('<script src="/js/cms/wysiwyg/tinymce/jscripts/tiny_mce/tinymce_custom.js"
+
[[Категория:Решение проблем и ошибок]][[Категория:Вопросы и уроки разработки сайтов на UMI.CMS]]
−
type="text/javascript" charset="utf-8"></script>').appendTo('head');</source>
 
−
 
 
−
[[Категория:Визуальный_редактор]]
 

Текущая версия на 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

Источник — «https://wiki.umisoft.ru/index.php?title=Отключение_валидации_тегов_в_TinyMCE&oldid=9407»