wordpress snippets last updated   : April 22, 2014
we now have 631 snippets

Enable TinyMCE editor for post the_excerpt

wordpress snippet

Adding this snippet to the functions.php of your wordpress theme will add the TinyMCE editor to the post excerpt textarea.

( example screenshot )
snippet :  PHPcopy
function tinymce_excerpt_js(){ ?>
<script type="text/javascript">
	jQuery(document).ready( tinymce_excerpt );
            function tinymce_excerpt() {
		jQuery("#excerpt").addClass("mceEditor");
		tinyMCE.execCommand("mceAddControl", false, "excerpt");
	    }
</script>
<?php }
add_action( 'admin_head-post.php', 'tinymce_excerpt_js');
add_action( 'admin_head-post-new.php', 'tinymce_excerpt_js');
function tinymce_css(){ ?>
<style type='text/css'>
	    #postexcerpt .inside{margin:0;padding:0;background:#fff;}
	    #postexcerpt .inside p{padding:0px 0px 5px 10px;}
	    #postexcerpt #excerpteditorcontainer { border-style: solid; padding: 0; }
</style>
<?php }
add_action( 'admin_head-post.php', 'tinymce_css');
add_action( 'admin_head-post-new.php', 'tinymce_css');

  • Gary

    This is great — except, my line break/paragraphs aren’t preserved.  So after an update the excerpt appears as one long line again.  Is there an easy way to preserve paragraph breaks?

    • http://wpsnipp.com Kevin Chard

      Hi Gary ill test that out and get back to you,

      • http://wpsnipp.com Kevin Chard

        Hi Gary,
        I looked things over again and it should be working it breaks line breaks into paragraphs so it should be working fine. Do you have any other code that is doing something to the_excerpt ?

    • http://www.bjornsennbrink.se Björn Sennbrink

      I second that experience. But when viewing the content the paragraphs are there.

      I am more interested in learning how to include images. If you have the time, drop me a line at konsult@sennbrink.se with a solution.

  • Brokenflipside

    How would I add this to the Additional Description field of WPEC ?

    • http://wpsnipp.com Kevin Chard

      To add this to another field you would need to the ID of the field. On row 05 you can see #excerpt if you change that to the ID of the other textarea should work great. Please also note that I added some CSS on lines 14-16  to style things a little. You should remove that css and replace it with your own to make sure everything looks ok.

      • Brokenflipside

        Brilliant! So for any other WPEC/WPSC (wp E-commerce) folks out there want to get this to work for the “Additional Description” section, then just change the ID #excerpt in the above function to #additional_description and change the class that is being added from “mceEditor” to “theEditor” and all will work!

        Thanks Kevin for the great help.

      • Brokenflipside

        Kevin, any idea how to add the visual/HTML tabs to the top of the excerpt?

        • http://wpsnipp.com Kevin Chard

          To be honest I’m not sure, this not something I have ever thought about doing until you asked the question however, it is an interesting idea. ll take a look into this and see if I can come up with a snippet that I can post.

  • Anne

    Thanks Kevin for this snippet.
    Do you know how add the media buttons to the top ?
    Sorry for my bad English
    Thanks
    Anne

    • http://wpsnipp.com Kevin Chard

      No problem Anne, glad that you like the snippet. In regards to media_buttons, ill have to check that out not sure if this can be done easily. If so ill post a snippet.

  • Jacek

    Is there any way to display tabs for switching between Visual and HTLM?

    • http://wpsnipp.com Kevin Chard

      Hi Jacek, a few people have requested this addition, ill have to look into it and see.

  • Pingback: 29 Wordpress Tweaks to Improve Posts and Pages

  • mroncetwice

    WP 3.3  messes this function up royally .. when you leave a write page set to the HTML tab, upon returning to any of the write pages where this function is active, clicking back to the Visual tab brings up a blank textarea (not actually blank, but appears so as text is colored white). i see a lot of suggestions to use 
    do_action(‘edit_page_form’) 
    instead, but im not sure how do go about such a function. 

    any plans to update this function for use with WP 3.3?

    • http://wpsnipp.com Kevin Chard

      I have not tried this snippet in wp 3.3 could be a number of things ill take a look and post an updated version for 3.3 and let you know what if any issues may have caused this for you.

  • Birgit

    thanks! exactly what I was looking for :)

    • http://wpsnipp.com Kevin Chard

      Cool glad I could help Birgit,

  • http://www.facebook.com/Mr.OnceTwice Jonathan Mills

    any update on this? (this is mroncetwice btw)

  • Felix

    thx ! helped me a lot !

    • http://wpsnipp.com Kevin Chard

      Cool glad that I could help enjoy!

  • Veerle

    thx! handy without installing a giant plugin. Only one little issue: when you have a custom post type without any editors, the tinyMCE init runs anyway causing all js to break. with an extra check it works smoothly:

    ..
    if (typeof(tinyMCE) !== ‘undefined’) {
    tinyMCE.execCommand(“mceAddControl”, false, “excerpt”);
    }
    ..

  • dakini

    hi kevin,
    i added this snippet to my functions.php file but the editor doesn’t show. i’m using the pagelines framework. could it be because of that?

  • donhilo

    it EATS the line breaks…

  • http://twitter.com/anythinggraphic Kevin Donnigan

    Life saver! Thank you so much :-)

  • travismelvin

    Appreciate the code and just added to local WP site I am updating and seemed to work great so far. Thank You!

    • http://wpsnipp.com Kevin Chard

      Perfect! Glad wpsnipp could help… Enjoy the code.

jqsnipp.com | we just launched jquery snippets website