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

Материал из Umicms
Перейти к:навигация, поиск
 
(не показана 1 промежуточная версия этого же участника)
Строка 1: Строка 1:
−
Для того чтобы отключить модерацию тегов в визуальном редакторе откройте файл /js/cms/wysiwyg/tinymce47/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">
 
<source lang="javascript">
−
window.mceCustomSettings = {
+
extended_valid_elements : 'iframe[frameborder|allow]'
−
extended_valid_elements :  
+
</source>
−
"a[*],abbr[*],acronym[*],address[*],applet[*],area[*],article[*],aside[*],audio[*],b[*],base[*],basefont[*],bdi[*],bdo[*],\
+
А можно разрешить для тега iframe любые атрибуты:
−
bgsound[*],big[*],blink[*],blockquote[*],body[*],br[*],button[*],canvas[*],caption[*],center[*],cite[*],code[*],col[*],\
+
<source lang="javascript">
−
colgroup[*],command[*],comment[*],datalist[*],dd[*],del[*],details[*],dfn[*],dir[*],div[*],dl[*],dt[*],em[*],embed[*],\
+
extended_valid_elements : 'iframe[*]'
−
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>
  
−
Для отключения обрамления текста тегом &lt;p&gt; можно использовать следующие настройки:
 
  
 +
После внесения нужных правок содержимое файла tinymce_custom.js  будет выглядеть следующим образом:
 
<source lang="javascript">
 
<source lang="javascript">
 
window.mceCustomSettings = {
 
window.mceCustomSettings = {
−
extended_valid_elements : "script[type=text/javascript|src|languge|lang],map[*],area[*],umi:*[*],input[*],noindex[*],nofollow[*],iframe[frameborder|src|width|height|name|align]",
+
content_css : '/styles/common/js/cms/wysiwyg/tinymce47/tinymce_custom.css',
−
content_css : "/css/cms/style.css",
+
extended_valid_elements : 'iframe[*]' // элементы можно перечислять через запятую
−
force_br_newlines : false,
+
};
−
force_p_newlines : false,
 
−
forced_root_block : ""
 
 
}
 
}
 
</source>
 
</source>
  
−
<br />
+
Для более тонкой настройки редактора можно обратиться к официальной документации: [https://www.tiny.cloud/docs/configure TinyMCE configuration options reference]
−
<strong>UPD:</strong>
 
−
 
 
−
В версиях после 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"
 
−
type="text/javascript" charset="utf-8"></script>').appendTo('head');</source>
 
−
В версии 2.9.1 данная запись уже существует.
 
−
 
 
−
В версиях до 17 84088 необходимо менять файл /js/tinymce/jscripts/tiny_mce/tinymce_custom.js
 
−
 
 
 
[[Категория:Решение проблем и ошибок]][[Категория:Вопросы и уроки разработки сайтов на 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

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