CODEWITHSUNDEEP
javascripttinymce
Kirk Strobeck
Kirk Strobeck

Reputation: 18629

TinyMCE stripping style tags

Is there a way to get TinyMCE V4 to not remove <style> tags.

  tinymce.init({
    selector: 'textarea.tinymce',
    theme: 'modern',
    plugins: [
      'advlist autolink link image lists charmap print preview hr anchor pagebreak spellchecker',
      'searchreplace wordcount visualblocks visualchars code insertdatetime media nonbreaking',
      'save table contextmenu directionality emoticons template paste textcolor'
    ],
    valid_elements: '+*[*]',
    width: '100%',
    inline_styles: true,
    keep_styles: true,
    extended_valid_elements: '+*[*]',
    custom_elements: '*',
    invalid_elements: '',
    verify_html: false
  });

I want to be able to add any HTML I want whether valid or not. I don’t care if it is a fork or a workaround.

Upvotes: 22

Views: 16191

Answers (5)

Ani
Ani

Reputation: 56

As stated by @Dekel earlier - adding following line solves the problem:

valid_children : '+body[style],-body[div],p[strong|a|#text]'

Reference: https://www.tiny.cloud/docs/configure/content-filtering/#keep_styles

Upvotes: 1

noob
noob

Reputation: 11

face the same question, and add the following code mentioned by Wayne will solve the problem

tinymce.init({
...
    custom_elements:"style"
...
});

Upvotes: 1

Wayne
Wayne

Reputation: 171

Define style and link as a custom tag to keep them:

tinymce.init({
...
    extended_valid_elements:"style,link[href|rel]",
    custom_elements:"style,link,~link"
...
});

Upvotes: 17

Dekel
Dekel

Reputation: 62666

You can use TinyMCE's valid_children option for that:

valid_children : '+body[style]',

Check this fiddle for a complete example.

The valid_children enables you to control what child elements can exists within specified parent elements.

Upvotes: 22

Michael Fromin
Michael Fromin

Reputation: 13744

TinyMCE will only allow HTML tags where they are valid ... the <style> tag belongs in the <head> of the document so if you place one in the <body> it will strip it out.

If you enable the fullpage plugin and add a <style> tag in the <head> TinyMCE will keep the <style> tag.

Upvotes: 0

Related Questions