Home / admin / Enable TinyMCE editor for post the_excerpt
  • How to Enable TinyMCE editor for post the_excerpt


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

    ( example screenshot ) ( click code to copy )

    wordpress snippet : PHP

    function tinymce_excerpt_js(){ ?>
    <script type="text/javascript">
    	jQuery(document).ready( tinymce_excerpt );
                function tinymce_excerpt() {
    		tinyMCE.execCommand("mceAddControl", false, "excerpt");
    <?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; }
    <?php }
    add_action( 'admin_head-post.php', 'tinymce_css');
    add_action( 'admin_head-post-new.php', 'tinymce_css');

    ( WordPress codex functions, hooks, in this snippet. )

    the_excerpt, mce_css, query, admin_head, add_action, _e, _ex, wp,
  • 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?

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

      • 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 ?

    • 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 ?

    • 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?

        • 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

    • 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?

    • 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 
    instead, but im not sure how do go about such a function. 

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

    • 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 :)

  • any update on this? (this is mroncetwice btw)

  • Felix

    thx ! helped me a lot !

  • 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…

  • 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!

    • Perfect! Glad wpsnipp could help… Enjoy the code.

  • Farhan

    It was working before however after updating the tinyMCE its gone ???

  • Zartgesotten

    Same problem here! Was working before update but now it’s gone! Thanks!

  • I’m experiencing the same issue since updating. Is there an updated version of this function that might fix things up again?

  • suprisemadafaka

    sen ne d?yorsun bree orospuu cocugu