to the tinymce content body. But I do not...">

How to add a TinyMCE persistent wrapper to the content area

I want to add a wrapper <div class="well">to the tinymce content body. But I do not want it to be saved with content. Therefore, it will simply improve WYSIWYG, because the content will be displayed <div class="well"></div>when published. This shell should be removed when using tinymce. Any idea on it?

Update: here is an example: http://unsalkorkmaz.com/twitter-embeds-in-wrong-language/

Check the comment form. Basically, I moved the body background to html and made the class “good” for the body. This is a quick fix that I don't like much tbh. There must be some way to add a permanent root block inside the editor body.

+5
source share
2

, ( JQuery DOM):

$('textarea#id_body').tinymce({
    ....
    ....
    init_instance_callback : make_wysiwyg
});

make_wysiwyg:

var make_wysiwyg = function(inst){
    var tmceIframe = $(".mceIframeContainer iframe")[0].contentDocument || $(".mceIframeContainer iframe")[0].contentWindow.document;
    $(tmceIframe).find("body#tinymce article").wrapInner('<div class="post-content"/>');
}

, html, , onClick form.submit :

var strip_wysiwyg = function() {
    var tmceIframe = $(".mceIframeContainer iframe")[0].contentDocument ||     $(".mceIframeContainer iframe")[0].contentWindow.document;
    $post_content_wrapper = $(tmceIframe).find("body#tinymce div.post-content");
    $post_content = $post_content_wrapper[$post_content_wrapper.length-1];
    $($(tmceIframe).find("body#tinymce")[0]).html($($post_content).html());
};

, .

+1

TinyMCE, save_callback.

, , TinyMCE , .

: jQuery div:

function add_custom_div(element_id, html, body) {
        var dom = $(html);
        if ($('div.well').length < 1)
        {
            dom.wrap("<div class='wrap' /><div class='well'");
            html = dom.html();
        }
        return html;
}

tinyMCE.init({
        ...
        save_callback : "add_custom_div"
});

, div TinyMCE , , noneditable_regexp.

, TinyMCE .

0

All Articles