WP_Editor Shortcode Issue

Question

I have created a front-end editor using wp_editor that functions as it should.

Upon testing I have noticed that it is stripping out any shortcodes that have been inserted in the content. I have looked into this issue and found that it's the 'ob_' (output buffering) that is removing them. If I remove this output buffering then the shortcodes display fine, but it breaks the functionality I have created for the editor.

How would I keep the code I am using below, but amend it to make sure that all shortcodes are being displayed? Any help/ideas greatly appreciated, S.

if(!is_feed() && current_user_can( 'manage_network' ) ) :

function ps_add_post_editor($content) {
global $post;
$settings = array(
    'wpautop' => true,
    'media_buttons' => false
);
    $content .= '<div id="content-edit-area" style="display:none;"><form action="" id="page-content-editor-panel" method="post"><span id="ajax_my_post_edit_nonce" class="hidden">' . wp_create_nonce( 'ajax_my_post_edit_nonce' ) . '</span>' . ps_get_wp_editor($post->post_content, 'textarea-' . $post->ID , $settings) . '<input type="submit" id="feesavebtn" value="Save" /></form><a href="#" id="cancelbtn">Cancel</a></div><br><br><div id="loadingmessage"><img src="'.get_template_directory_uri().'/images/loading.gif" /> saving...</div>

    <style type="text/css">
        #textarea-'.$post->ID.'_ifr, #textarea-'.$post->ID.' { min-height:700px !important; }
    </style>

    <script type="text/javascript">
    jQuery(\'#page-content-editor-panel\').submit(function(){       
    var pageid = '.$post->ID.'; 
    var content;
    var editor = tinyMCE.get(\'textarea-'.$post->ID.'\');
    if (editor) {
        content = editor.getContent();
    } else {
        content = jQuery(\'#textarea-'.$post->ID.'\').val();
    }       
    jQuery(\'#content-edit-area\').hide();  
    jQuery(\'#loadingmessage\').show(); 
    jQuery.post(
       ajaxurl, 
       {
          \'action\':\'add_foobar\',
          \'nonce\':jQuery(\'#ajax_my_post_edit_nonce\').text(),
          \'post_id\':pageid,
          \'post_data\':content
       }, 
       function(response){            
          window.location.reload(true); 
       }
    ); 
    return false;        
    });
    </script>';

return $content;
}

function ps_get_wp_editor($content,$textarea,$settings) {
ob_start();
wp_editor($content, $textarea, $settings);
$edior_html_code = ob_get_contents();
ob_end_clean();
return $edior_html_code;
} 
add_filter('the_content', 'ps_add_post_editor');

add_action('wp_ajax_add_foobar', 'prefix_ajax_add_foobar');
add_action('wp_ajax_nopriv_add_foobar', 'prefix_ajax_add_foobar');

function prefix_ajax_add_foobar() {
if( wp_verify_nonce( $_REQUEST['nonce'], 'ajax_my_post_edit_nonce' ) )           {      
    $myfee_post = array();
    $myfee_post['ID'] = $_POST['post_id'];
    $myfee_post['post_content'] = $_POST['post_data'];
    wp_update_post( $myfee_post );      
    die("This page has now been updated."); 
} else {        
    die("Unable to process your request at this time.");
}
}

endif;

Answer 1

You can display shortcodes in WP editor by removing do_shortcode filter from the_content filter as shown in the following code but beware that it will also display shortcodes tags when you use the_content() function in the theme anywhere else in that case before the_content() function add do_shortcode filter again like this add_filter('the_content', 'do_shortcode',15 );

function ps_get_wp_editor($content,$textarea,$settings) {
    remove_filter('the_content', 'do_shortcode',11 );
    ob_start();
    wp_editor($content, $textarea, $settings);
    $edior_html_code = ob_get_contents();
    ob_end_clean();
    return $edior_html_code;
}