Extra TinyMCE editor strips and tags?

Hey guys, I’ve added a TinyMCE to some textareas that are displayed in a custom meta box. All of the formatting works perfectly fine, except that the editor will not save <p> or <br/> tags. It doesn’t preserve the line breaks.

The TinyMCE is setup like this:

wp_tiny_mce(true, array('editor_selector' => $field['class'] ) );

'<textarea name="', $field['id'], '" class="', $field['class'], '" id="', $field['id'], '" cols="60" rows="8" style="width:97%">', $meta ? esc_html($meta) : $field['std'], '</textarea>';

And that all works perfectly fine. All the formatting buttons work fine, except for the <P> and <BR> tags.

I’m not sure if the editor is stripping them out before or after the post meta is saved.

Ideas?

Answers:

Thank you for visiting the Q&A section on Magenaut. Please note that all the answers may not help you solve the issue immediately. So please treat them as advisements. If you found the post helpful (or not), leave a comment & I’ll get back to you as soon as possible.

Method 1

I recently got this working. You should search and replace metaname with your meta box name.

The key to maintaining formatting was using wpautop(); when saving the data.

add_action( 'add_meta_boxes', 'add_metaname_box');

add_action( 'save_post', 'metaname_save');

function add_metaname_box() {
    add_meta_box(
        'metaname_id',
        __( 'metaname text', 'metaname_textdomain'),
        'metaname_custom_box',
        'page'
    );
}

function metaname_custom_box() {
    global $post;
    wp_nonce_field( plugin_basename( __FILE__ ), 'metaname_noncename' );
    $data = get_post_meta($post->ID, 'metaname_custom_box', true);
    echo <<<EOT
    <script type="text/javascript">
jQuery(document).ready(function() {
    jQuery("#metaname_custom_box").addClass("mceEditor");
    if ( typeof( tinyMCE ) == "object" &&
         typeof( tinyMCE.execCommand ) == "function" ) {
        tinyMCE.execCommand("mceAddControl", false, "metaname_custom_box");
    }
});
</script>
    <textarea id="metaname_custom_box" name="metaname_custom_box">$data</textarea>
EOT;
}

function metaname_save($post_id) {
    global $post;

    // Verify
     if ( !wp_verify_nonce( $_POST['metaname_noncename'], plugin_basename(__FILE__) )) {
         return $post_id;
     }
     if ( 'page' == $_POST['post_type'] ) {
         if ( !current_user_can( 'edit_page', $post_id ))
             return $post_id;
     } else {
         if ( !current_user_can( 'edit_post', $post_id ))
             return $post_id;
     }

     $key = 'metaname_custom_box';
    $data = wpautop($_POST[$key]);

     // New, Update, and Delete
     if(get_post_meta($post_id, $key) == "") 
         add_post_meta($post_id, $key, $data, true);
     elseif($data != get_post_meta($post_id, $key, true))
         update_post_meta($post_id, $key, $data); 
     elseif($data == "")
         delete_post_meta($post_id, $key, get_post_meta($post_id, $key, true));        
}

Method 2

This seems to have changed a little in subsequent versions of WordPress. You can now disable this functionality thusly:

add_filter('tiny_mce_before_init', function($init) {
    $init['wpautop'] = false;
    return $init;
}

Method 3

Here’s (a pared-down version of) what I use to custom-configure TinyMCE:

// http://tinymce.moxiecode.com/wiki.php/Configuration
function cbnet_tinymce_config( $init ) {

    // Don't remove line breaks
    $init['remove_linebreaks'] = false; 

    // Pass $init back to WordPress
    return $init;
}
add_filter('tiny_mce_before_init', 'cbnet_tinymce_config');

I assume this is what you tried already?

EDIT:

You may need to include some other config changes, such as:

// Convert newline characters to BR tags
$init['convert_newlines_to_brs'] = true; 
// Do not remove redundant BR tags
$init['remove_redundant_brs'] = false;

Play around with the TinyMCE configuration parameters, and find the one that you need to change.

Method 4

Found perhaps a simpler workaround for this:

on the actual template, change this:

<?php echo get_the_content());?>

to this:

<?php echo wpautop(get_the_content());?>

This way wpautop() adds the tags stripped out by TinyMCE on a template by template basis.

Method 5

why not you use wordpress new function wp_editor to render the tinymce. That way everything will get handled. And when you show the content to the user apply the filter the_content.

Like this:

$meta = "content of the metabox";
echo apply_filters('the_content', $meta);

The filter the_content will autmatically convert the link brakes to <br> and <p>.

Method 6

Another simple solution: Use Shortcodes!

Place this code into functions.php and use [br] in the content editor – HTML or visual – wherever you want a br tag to appear.

add_shortcode("br", "br_tag");

function br_tag(){
    return("<br/>");                            

}

Method 7

this is for who use the metaboxes for wordpress:
Plugin Name: Meta Box
Plugin URI: deluxeblogtips com/meta-box

i have modify the /vendor/meta-box/inc/fields/wysiwyg.php
in static function :

static function html( $html, $meta, $field )

//just after the else i have added :
$meta = html_entity_decode($meta); // 
//and solve the problem ;)

— BUT THE BETTER SOLUTION IS —

Put this into functions.php, it calls the filter from the metaboxes pluggin:

function meta_wysiwyg_antes_save($meta)
{   
    $meta = html_entity_decode($meta);
    return $meta;
}
add_filter("rwmb_(ID-OF-METABOX-FIELD)_meta", "meta_wysiwyg_antes_save"); //en meta-box.php 194

All methods was sourced from stackoverflow.com or stackexchange.com, is licensed under cc by-sa 2.5, cc by-sa 3.0 and cc by-sa 4.0