wp_editor on front end – JavaScripts not included

0 Views

I am working on a BuddyPress plug-in for a client that requires users to be able to add content from the front end – they never see the back end for security reasons. I have the plug-in written and it works perfectly but it is missing one thing: a rich text editor so that users can customize their content (within reason, of course). Until now, I have ignored this request from the client and explained it as not being possible without a lot more work.

Today, however, I upgraded to 3.3 and noticed the new wp_editor tag.
I tried some of the examples shown here, but I cannot get any of them to work properly (a bare-bones call produces the editor but the tabs and media buttons don’t work, a basic TinyMCE setting array yields nothing [just a plain textarea].) Inspection with Chrome’s Developer Tools reveals that some JavaScript files are being included in the admin area that are not included on the front end. What is the best way to include these files and make this thing work? Thanks!

Post Views: 0

Related posts

Leave a Reply

4 comments

  1. note that wp_editor will echo to output, not put it in a variable.
    If you want to put it in a variable, just do

    ob_start();
wp_editor($content, 'textarea_rich', $args);
$html = ob_get_contents();
ob_end_clean();

    and you have what you need in $html.
    You can also see https://plugins.svn.wordpress.org/indypress/tags/1.0/indypress/form_inputs/tinymce.php for a working implementation.

    Another issue I noted is some problem is with w3-total cache minifying (actually, I had those issue with wp_tiny_mce, the function used in wp <= 3.2; I have not checked if it is buggy in wp_editor, too)

  2. The following code should work for you. Just make sure that the textarea id is all lower-case and alphanumeric.

    $post = get_post( $post_id, 'OBJECT' );
$args = array(
    'wpautop' => true,
    'media_buttons' => true,
    'editor_class' => 'frontend',
    'textarea_rows' => 5,
    'tabindex' => 1
);                      
wp_editor( esc_html( $post->post_content ), 'textareaid2', $args );

    You can read the documentation of the wp_editor function in this Codex page.

  3. add this to your theme’s footer just before the closing body tag:

    <?php wp_footer(); ?>

    all the editor scripts for wp_editor are output in the footer, and if your theme does not have this tag, which calls do_action('wp_footer'); then the editor won’t work.