Wrapping shortcodes in temporary div wrappers for editing, then removing them prior to saving the content

1 Views

I’m working on a shortcodes preview filter where I wrap all of my shortcodes in CSS classed divs that are only intended to be viewed while the content is inside the tinyMCE editor.

The first challenge I have is how to strip out the wrapper divs from the markup prior to the document being saved.

Read More

The second challenge is how to reapply the wrappers each time a shortcode appears within the editor after a save.

I’m looking for an example of using jQuery to parse and filter TinyMCE editor contents on load and during save routines.

Post Views: 1

Related posts

Leave a Reply

1 comment

  1. The first challenge I have is how to strip out the wrapper divs from
    the markup prior to the document being saved.

    This one is easy. Just give your wrapperDivs a special class

    var ed = tinymce.get('my_editor_id');
$(ed.getBody()).find('div.my_special_class').each(function(){
    $(this).replaceWith(this.innerHTML);
});

    The second challenge is how to reapply the wrappers each time a
    shortcode appears within the editor after a save.

    This one is more difficult to answer. That depends on the difficulty to detect a shortcode.