Menu
I have been reading the official docs and blog posts and SO for hours, certain somewhere the answer would be posted already.. but no luck.
It seems that no amount of fiddling with any config. stops tinymce from stripping the inline 'style' attribute on my input/submitted <p> element. I need the 'style' attribute for all input elements.. but I am just starting by testing with <p> to even get it to work.
Here is the latest iteration of my config. (out of many variations/attempts):
tinyMCE.init({
mode : "textareas",
theme : "advanced",
plugins : "emotions,spellchecker,advhr,insertdatetime,preview,paste,table,media,directionality,style,xhtmlxtras,nonbreaking,pagebreak",
theme_advanced_buttons1 : "save,newdocument,|,bold,italic,underline,strikethrough,|,justifyleft,justifycenter,justifyright,justifyfull,formatselect,fontselect,fontsizeselect",
theme_advanced_buttons2 : "cut,copy,paste,pastetext,pasteword,|,bullist,numlist,|,outdent,indent,blockquote,|,undo,redo,|,link,unlink,anchor,image,cleanup,help,code,|,insertdate,inserttime,preview,|,forecolor,backcolor",
theme_advanced_buttons3 : "tablecontrols,|,hr,removeformat,visualaid,|,sub,sup,|,charmap,emotions,iespell,media,advhr,|,ltr,rtl",
theme_advanced_buttons4 : "styleprops,|,cite,abbr,acronym,del,ins,attribs,|,nonbreaking,pagebreak",
theme_advanced_toolbar_location : "top",
theme_advanced_toolbar_align : "left",
theme_advanced_statusbar_location : "bottom",
theme_advanced_resizing : true,
doctype : "<!DOCTYPE html>",
convert_urls : false,
//template_external_list_url : "gen4tinymce/lists/template_list.js",
external_link_list_url : "gen4tinymce/lists/link_list.js",
//media_external_list_url : "gen4tinymce/lists/media_list.js",
valid_elements : "@[id|class|style|title|dir<ltr?rtl|lang|xml::lang],"
+ "a[rel|rev|charset|hreflang|tabindex|accesskey|type|"
+ "name|href|target|title|class],strong/b,em/i,strike,u,"
+ "#p[style],-ol[type|compact],-ul[type|compact],-li,br,img[longdesc|usemap|"
+ "src|border|alt=|title|hspace|vspace|width|height|align],-sub,-sup,"
+ "-blockquote,-table[border=0|cellspacing|cellpadding|width|frame|rules|"
+ "height|align|summary|bgcolor|background|bordercolor],-tr[rowspan|width|"
+ "height|align|valign|bgcolor|background|bordercolor],tbody,thead,tfoot,"
+ "#td[colspan|rowspan|width|height|align|valign|bgcolor|background|bordercolor"
+ "|scope],#th[colspan|rowspan|width|height|align|valign|scope],caption,-div,"
+ "-span,-code,-pre,address,-h1,-h2,-h3,-h4,-h5,-h6,hr[size|noshade],-font[face"
+ "|size|color],dd,dl,dt,cite,abbr,acronym,del[datetime|cite],ins[datetime|cite],"
+ "object[classid|width|height|codebase|*],param[name|value|_value],embed[type|width"
+ "|height|src|*],map[name],area[shape|coords|href|alt|target],bdo,"
+ "button,col[align|char|charoff|span|valign|width],colgroup[align|char|charoff|span|"
+ "valign|width],dfn,fieldset,form[action|accept|accept-charset|enctype|method],"
+ "input[accept|alt|checked|disabled|maxlength|name|readonly|size|src|type|value],"
+ "kbd,label[for],legend,noscript,optgroup[label|disabled],option[disabled|label|selected|value],"
+ "q[cite],samp,select[disabled|multiple|name|size],small,"
+ "textarea[cols|rows|disabled|name|readonly],tt,var,big",
extended_valid_elements : "p[style]",
inline_styles : true,
verify_html : false
});
Thanks for any suggestions!
985
Use the checkbox to toggle between the "design" and "readonly" modes.
The TinyMCE getContent and setContent methods You can do this using the getContent() API method. Let's say you have initialized the editor on a textarea with id=”myTextarea”. This will return the content in the editor marked up as HTML.
Use tinymce. remove() method to remove TinyMCE editor from the HTML element and again call tinymce. init() on the selector to reinitialize.
Initialize TinyMCE 5 on any element (or elements) on the web page by passing an object containing a selector value to tinymce. init() . The selector value can be any valid CSS selector. For example: To replace <textarea id="mytextarea"> with a TinyMCE 5 editor instance, pass the selector '#mytextarea' to tinymce.
As Thariama pointed out, tinymce was not at fault.. but it was my lack of knowing what all CodeIgniter's $config['global_xss_filtering'] = TRUE; was doing. If you find you are experiencing the same issue, here is how I addressed it; please see here:
Codeigniter - Disable XSS filtering on a post basis .
125
This fiddle shows that your configuration of tinymce is absolutely perfect: Style-attribute is allowed for all elements, it does not get stripped out.
39
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With
