how to make froala editor allow all inline html tag?

Viewed 630

I am using "froala" Editor for add email template to database, but "froala" Editor always remove some html tag like this

<div [removed]="table-layout:fixed; width: 100%;" class="mailwrapper">
<br>

<table [removed]="font-family: 'Helvetica Neue', Helvetica, Arial, sans-serif; font-smooth: always; -webkit-font-smoothing: antialiased; height: 16px; -premailer-height: 16;" align="center" cellpadding="0" cellspacing="0" class="mainTable">

this my code

    $(function () {
    $('#editor').froalaEditor({
        inlineMode: false,
        //toolbarInline: true,
        charCounterCount: true,
        toolbarButtons: ['fontFamily', 'fontSize', 'color', 'paragraphFormat', 'bold', 'italic', 'underline', 'strikeThrough', 'subscript', 'superscript', '|', 'align', 'formatOL', 'formatUL', 'indent', 'outdent', '-', 'insertImage', 'insertLink', 'emoticons', 'insertVideo', 'insertTable', 'undo', 'redo', 'fullscreen', 'html'],
        toolbarVisibleWithoutSelection: true,
        heightMin: 500,
        height: 500,
        htmlAllowedTags: ['.*'],
        htmlAllowedAttrs: ['.*'],
        allowedContent : true
    });
});
1 Answers

Having read the compressed/pretty-printed version of Froala, I doubt that wildcards will work in this context.

The Froala options block is not a good vehicle to achieve what you want, because the tags and attributes that you allow there replace the default allowed tags list, rather than extend it.

What I chose to do was to modify the editor's allowedHtmlTags array in code, in my plugin's _init code. You don't need a plugin for this, the code can also be applied in an event listener during the Editor's bootstrap sequence.

    public _init() {
// ... misc init code
        const opts: any = this._editor.opts;
// just routine safety
        if (opts.htmlAllowedTags && opts.htmlAllowedTags.push) {
            opts.htmlAllowedTags.push("myTag");
        }
    }
Related