Make WordPress Core

Tagged: TinyMCE Toggle Comment Threads | Keyboard Shortcuts

  • Andrew Ozz 4:39 am on October 28, 2016 Permalink |
    Tags: , , , TinyMCE   

    Editor changes in 4.7 

    There are a few noteworthy changes to the editor in WordPress 4.7.

    Some of the toolbar buttons have been rearranged to make them easier to access and to encourage proper use of the HTML elements they insert.  The headings drop down is now moved to the top row, and the strike-through and horizontal rule button are moved down. This also reflects their usage.

    The underline and justify buttons have been removed from the bottom row. Underlining is a bad practice as readers can confuse it with links (bad accessibility), and it does not insert a semantic element. Justifying has uneven browser implementation, and in many cases is bad for readability. Keyboard shortcuts for both will keep working.

    For more information see #27159 that also has links to the discussions in Slack.

    Labels for keyboard shortcuts have been added to the tooltips for buttons and inside drop downs to make them easier to discover.

    As always, feedback is welcome.

    Ella and Andrew

    • Fahid Javid 5:40 am on October 28, 2016 Permalink | Log in to Reply

      Nice improvements!

    • Retrofitter 6:42 am on October 28, 2016 Permalink | Log in to Reply

      Nice touch moving the header drop down, thanks

    • espiat 7:53 am on October 28, 2016 Permalink | Log in to Reply

      Perfect. Thanks.

    • Ahmad Awais 10:16 am on October 28, 2016 Permalink | Log in to Reply

      Nice, I was looking forward to this one. @azaozz just wondering, the feedback from folks on this ticket didn’t transition into props? I think for a ticket like this, feedback can be considered as much important as the contributions to any other ticket. Which essentially would have transitioned into `props`. Steps like this would help people engage more and help make/steer the core decisions. I remember on of the release leads talking about how much we should be generous when it comes to props (considering them equal for anyone giving back even if it is by providing feedback in a ticket like this one). Just my two cents.

    • catchmyfame 7:28 pm on October 28, 2016 Permalink | Log in to Reply

      Will this have any impact on your TinyMCE Advanced plugin?

    • Joy 12:12 am on October 30, 2016 Permalink | Log in to Reply

      Did any of the updates affect the Text mode toolbar? It needed some love.

    • avcascade 9:21 pm on October 30, 2016 Permalink | Log in to Reply

      Thumbs up for these changes. I would like to see a button in the editor that allows me to set a background color for selected text (e.g. yellow highlighting). Right now, it’s possible to set text color, but there’s not an option to easily highlight text.

    • Diego Betto 9:22 am on October 31, 2016 Permalink | Log in to Reply

      Oh thanks! keyboard shortcuts are awesome!

    • Akuiyumi 9:05 am on December 7, 2016 Permalink | Log in to Reply

      I use the justified alignment and this is a catastrophe. Why removing? Why not leaving people the choice? Why not maybe hide it on default but also giving the opportunity to show it again and use it?
      I’m sorry for my complaing but this is very sad for me. I see that you removed it due to various causes, but I used to like it and my boss absolutely wants everything on the site to be justified. With this update it will be really difficult for me to do this.
      I will have to download a plugin just for it, just to have everything like it was before. And this is ridiculous, since the less plugin you have the better it is.
      Is there a way to show it again without plugins? I know that there are shortcodes but I don’t find them useful, not like a button. I’m asking because I haven’t updated yet, it all depends on this.

      • maweb 11:12 pm on December 7, 2016 Permalink | Log in to Reply

        I use justify too, you don’t need to download any plugin, in visual editor just select first a center or left or right alignment and then go on text editor and replace it with “justify”.
        ex: before p style="text-align: center"> after p style="text-align: justify">

        • Akuiyumi 8:57 am on December 9, 2016 Permalink | Log in to Reply

          I know the codes maweb, but writing them each time makes me waste a lot of time. My site is updated very often, each post has a lot of content in it and a lot of paragraphs. I cannot simply set the justified text once and for all, I have to set it for each paragraph. You will understand that, with wp 4.7, instead of writing a post blog in 1 hour it will take me a lot more, since I have to search in the visual editor for each part of the text that has to be justified. And I cannot simply paste the text in che visual editor tab because it will not maintain the format of the text (mainly words in bold format). That’s very inconvenient.

          • Mark Root-Wiley 7:19 pm on December 9, 2016 Permalink | Log in to Reply

            @akuiyumi, if you’re trying to fully justify every single paragraph, I’d strongly encourage you to do this with CSS. Better yet, there’s the new CSS editor in the customizer.

            Without seeing your site, it’s hard to say, but something like this should work:

            .single .entry-content p {
            text-align: justify;

            That said, this tends to not look very good in certain browsers (at least in English) and can make things hard to read.

            For others reading, don’t forget that the keyboard shortcuts still work. and are found in the Editor’s help window (click the “?” button).

        • EstherCoach 12:12 pm on December 11, 2016 Permalink | Log in to Reply

          I also agree. It doesn´t matter if there are plugins, shortcuts (alt+shift+j) or ways around it. The thing is they are making it more difficult for us when they could have just left it there in a corner. Just don´t get it. Please bring it back!

      • digit89 10:13 am on December 8, 2016 Permalink | Log in to Reply

        I totally agree, why the hell are you deciding for others if justify is good or not ? As underline ?
        God damn if I want to underline my title please what’s your opinion place here ?
        This is the most stupid thing I’ve ever seen.

    • cathd80 3:59 am on December 8, 2016 Permalink | Log in to Reply

      One more person who is really sad to see Justify go. It is standard for what I do so this is frustrating. Don’t want more plugins, but hate the sloppy look of uneven margins.

    • Joan 8:37 pm on December 8, 2016 Permalink | Log in to Reply

      It should make work easier, not complicate it.
      We need the text justification button.
      Thank you very much !!!

    • davidplusworld 11:44 pm on December 9, 2016 Permalink | Log in to Reply

      “Justifying is bad for readability.”

      Sorry but no.
      Also, while in English it’s OK to print a text aligned left, but in some other languages, it’s just bad and unprofessional layout to not justify. It’s just wrong.

      WordPress, you’ve made a terrible mistake. You need to bring back justify asap.

      • Dion Hulse 1:02 am on December 12, 2016 Permalink | Log in to Reply

        Also, while in English it’s OK to print a text aligned left, but in some other languages, it’s just bad and unprofessional layout to not justify. It’s just wrong.

        @davidplusworld Can you supply a reference for languages-other-than-english at all? It’s because I’m curious, not because I’m doubting it.

        • davidplusworld 8:20 am on December 12, 2016 Permalink | Log in to Reply

          A printed text should always be justified in French.
          Computing has somewhat changed the usage, and you’ll find texts online that are aligned left, but that’s a mistake, coming from the fact that well… html and what followed were designed by English speakers.

          It’s happening again with WordPress now. They are imposing aligned left to everyone.

          And really, regardless of languages, it’s just not WordPress’s job or function to decide for us what our texts should look like. Quite the opposite actually, it’s WordPress’s job to help us have our texts look the way we want.

          • Ipstenu (Mika Epstein) 4:26 pm on December 14, 2016 Permalink | Log in to Reply

            But… Not to sound like a jerk, HTML/Web is not Print. In US print, every sentence should be followed by TWO spaces. We don’t do that on the web. And if everything has to be justified in content on a French site, wouldn’t it be faster and easier to enforce that with CSS? text-align: justify; would be tossed into the P’tag for the body content.

            WP (and HTML in general) has always defaulted to side-align (it’s right if you use an RTL language). A ‘French Print’ Plugin would sound like the more correct fix here.

    • Rik0399 7:05 pm on December 10, 2016 Permalink | Log in to Reply

      Just to say well done to WP for again, making the decisions for the user/admins – We’re all dumb and need WP to decide for us?

      What the heck were you thinking?

      This smacks of an MS policy all over again!

      Put it back and let US the user decide whether to use it or not – what are you, Google?!

      I can only imagine what site owners must be thinking and feeling about this ‘update’ who whom have a ton of content and now, their sites look all sloppy with uneven margins!

      Good grief!

    • mgyhardsoft 11:34 pm on December 10, 2016 Permalink | Log in to Reply

      To remove “Justify” button is just a bad idea. justification actually enhances readability. O.K., I accept that someone else may have a different opinion, but for God’s ake, why to remove an existing button which will not hurt? If you don’t want it, don’t push it…
      So I would like to get back Justify button.

    • glennbukowski 8:20 am on December 11, 2016 Permalink | Log in to Reply

      Registered just to say this: Remove the underline is the most stupid decision i have ever saw in my years using wordpress.
      So, just because a fat guy on alabama don’t know how to use it to enhance the user experience, does it make it bad for everyone else?
      What’s next?
      Remove the bold because someone can mistake it for a link too?
      Or remove the images, because someone can mistake it for a video?
      And maybe remove the color text, i mean, i can mistake it for a link, right?

    • torresnet 12:15 pm on December 14, 2016 Permalink | Log in to Reply

      Why did you remove the Justify button from the text tool?
      Justifying the text leaves the layout nicer, I have had several complaints about the text not justified

    • Davide Roccato 3:23 pm on December 14, 2016 Permalink | Log in to Reply

      One more vote for the justify icon back. I want to decide for the text in my language by myself, please don’t decide for the others! There is still plenty of space in the editor. I know I can use the short-cut but I visually prefer to see the icon when it’s on/off for each paragraph! Thanks!

    • Akuiyumi 9:07 am on December 19, 2016 Permalink | Log in to Reply

      @Mark Root-Wiley thank you but I don’t have to justify everything, just most of it.

      Also I’m glad to see I’m not the only one that wants justify back. I agree with all of you, let us have the choice! You say that in english justify is bad for readability, well my websites aren’t made for english people, nor they are in english language. Don’t you know there’s a whole world out there? It’s not all around you, your language isn’t the only one in the world.
      Please put those buttons back. Yes, even the underlined text, because it doesn’t hurt anyone, and if someone mistakes an underlined word for a link… well he will just find out that is not, simple! Where is the problem?
      Instead of limiting people just because someone made a mistake (thank you for telling us we are all stupid the same), it would be better to teach them how to proper use the formats without abusing them.

    • a53classic 8:07 pm on December 23, 2016 Permalink | Log in to Reply


      I am in agreement with all the previous comments. I have yet to encounter justified text that did not display well, as is the suggested reasoning for removing it. The same with an underline. If someone clicks on underlined text to see if it is a link and discover it is not, so what? What’s the harm?!? REALLY WP?

    • grundlepod 11:57 pm on December 27, 2016 Permalink | Log in to Reply

      I hate the new editor. I want the old editor back. I hate it so much I’m thinking of moving back to Blogger.

    • deulrai 10:06 pm on December 30, 2016 Permalink | Log in to Reply

      I also want the justify button back! ASAP! This is the most not neeeded updated ever. Straight margins look clean and even if I can edit the margins in the code it is a long way around to instead just click on a button that didn’t take up any extra space in the tool bar.

      I searched like a fool for the button until someone in the support forum told me that it was gone with the latest update. I can’t see why at all. Also in Swedish straight margins is a must if you want a text to look professional and clean and as a Swedish teacher my eyes are bleeding when looking at the messed up margin now in every blog post. What happens if I don’t update my other blogs to 4.7? Will it run correct anyway? My main blog is somewhat dysfunctional now with this bad update but I just found out that my other blogs are luckily not updated. Can I keep them as that? I really hope that WordPress reads all our responses and bring back the justify button. As Grundlepod above said I may go back to Blogger if they don’t. Blogger is maybe a very square limited space but it is functional and with no distractions from writing. Coding and adjusting code is interesting for some people but for me and a lot of other people I believe we are here for a simple way to write and because of that we appreciate a click interface with buttons for the most basic writing editing.

    • Martin McKay 6:39 pm on December 31, 2016 Permalink | Log in to Reply

      Yes, I concur with the majority here. Bring back Justify and Underline.
      Whether the Editor’s like them or not, it should be for the user to choose. I use them regularly, especially Justify, a webpage looks sloppy without it. Please bring them back.

    • vichardy 5:21 pm on January 6, 2017 Permalink | Log in to Reply

      Good grief WP. I have a client that does their own editing on nearly 200 pages. They use the underline button regularly and now it’s gone??? Bad practice or not, it should be up to us to decide. Now they want me to go in and add css code for them. Please bring back the underline icon…

      Oh yeah, they also liked justify on one of their pages!

    • radtrad 6:50 pm on January 19, 2017 Permalink | Log in to Reply

      It was a very ugly mistake from WP, and none of those opinions on what X
      or Y think about justified texts or about accessibility can make
      such decision positive. The choice has to be on the hands of the one who writes, period.
      Particularly, I only write justified texts and I find those that are not
      amateurish and desorganized. I hope such an absurdity will not be applied on WP.com, as we do not have the option of plugins for correct this ERROR.

  • Andrew Ozz 2:00 am on July 29, 2016 Permalink
    Tags: , , , , TinyMCE   

    Editor changes in 4.6 

    In WordPress 4.6 TinyMCE is upgraded from version 4.3.10 to 4.4.1. There are numerous bug fixes and several new features, most notably a new inline theme (changelog).

    The wpview editor plugin (that is responsible for showing gallery, video, audio, and oEmbed previews) was updated to use the TinyMCE API for non-editable elements. This brought some small changes and improvements in the UI, for example “views” are draggable now. On the back-end the wp-mce-view-unbind event was removed as it doesn’t exist in the API. It was intended for cleanup/unloading but was never very reliable. If a plugin needs to unload instance dependent scripts, it can use mutation observer to monitor when the view node is deleted. See #36434 for more information.

    wpview remains an experimental API, though with each iteration it is getting closer to being finalized. As an experimental API, breaking changes are expected. As always, please test your plugin now if it modifies or depends on the editor, especially if you use experimental features like wpview.

    • elliotcondon 4:08 am on August 29, 2016 Permalink | Log in to Reply

      Hi guys,

      Elliot here – ACF developer.

      I’ve just noticed an odd bug (maybe) in this version of tinymce. The tinymce JS object contains a function called ‘add’ which “Adds an editor instance to the editor collection”. This is run each time a tinymce editor is initiated.

      This function contains an odd line of code copied below which seems to ‘double’ up the ‘collection’:
      editors[editor.id] = editor;
      Note that the editor is added using the id (as expected), and then also ‘pushed’ (added again using a numeric key).

      if you check the console lo, you can see the collection using “tinymce.editors”. You can see each editor is added twice.

      Please also be aware that this function also changes the ‘activeEditor’ to the last added instance which is different to the WP JS that sets the wpActiveEditor value (to the first editor id).

      I hope this info has been useful. I’ve just updated the ACF PRO plugin with a fix to avoid some JS errors introduced by this (I think…)


    • Arno Kools 9:29 am on September 1, 2016 Permalink | Log in to Reply

      TinyMCE was NOT upgraded when upgrading WordPress to version 4.6.

      Version 4.3.10 was still used and it broke completely.
      I had to manually replace it with the latest version from the TinyMCE website.

    • enternetconnections.com 1:54 pm on November 10, 2016 Permalink | Log in to Reply

      I upgraded a woocommerce site to 4.6.1 so the content writer could use jet pack. Big mistake. Now tinymce editor is broken. The content writer can’t add or edit new posts and the owner can’t add or edit products (kept in the post table, I can’t imagine why products and orders don’t have their own table). I’ve googled this and so many people have issues, usually they complain to the theme writer and they take care of it. But he’s using the free mystyle theme. I’ve tried almost every fix out there, still no luck. I wish now I had made him use my own ecommerce code. If something isn’t working with that, I know right where to go fix it. WordPress is a beast. This guy is pulling his hair out.

  • Andrew Ozz 1:31 am on July 9, 2015 Permalink
    Tags: , , , TinyMCE   

    Editor changes in WordPress 4.3 

    The editor initialization was updated. The main change is that the content for both Visual and Text editors is prepared/escaped the same. We used to run the content through the PHP wpautop() when the default editor was TinyMCE. This is no longer needed as we run the textarea content through the JavaScript wpautop() before initializing TinyMCE.

    In that terms wp_richedit_pre() and wp_htmledit_pre() were deprecated together with the richedit_pre and htmledit_pre filters. They were replaced by format_for_editor() and the format_for_editor filter. For more information see #32425.

    Another change is the complete removal of the code for the old Distraction Free Writing mode. This code was disabled and has been unused since WordPress 4.1. We left it in core so the authors of plugins that were using it would have plenty of time to update.

    If this is essential for some plugins, the files from WordPress 4.2 can be reused. For more information see #30949.

    If you are the author of a plugin that uses any of the deprecated functions or filters, please update it now. If your plugin uses wp_editor(), please test it in the latest beta.

    As always, feedback is very welcome.

    • Samuel Wood (Otto) 1:39 am on July 9, 2015 Permalink | Log in to Reply

      FYI to support team members. Any major editor JS change causes massive issues, because of caching. Bottom line, adding a version to the JS files, like we do, doesn’t solve the problem for people like CloudFlare users and people with overly crazy caching situations. Expect that these changes will cause big upticks of reports of breakage and silly demands to revert. CLEARING CACHES WILL FIX IT. The trick is finding out what kind of cache they use, and then clearing that.

      Just saying. This always happens for every major JS change.

      • Andrew Ozz 3:32 am on July 9, 2015 Permalink | Log in to Reply

        Yeah, this used to be a really big problem some time ago. Lately the situation has been improving. We have been updating TinyMCE and the custom plugins in each new WordPress release. There are still some reports of editor JS errors, but far less than few years ago.

    • Leo Caseiro 2:08 am on July 9, 2015 Permalink | Log in to Reply

      Hi @azaozz believe the PHP function is wpautop()

    • crispinbalfour 7:56 am on August 21, 2015 Permalink | Log in to Reply

      I am not sure whether this is a place to ask this but I have posted a query and nobody is responding.

      I have updated to 4.3 and now the GT3 Page builder in Skew Theme is not working. The developer gave me a fix so I can at least see the content in the Text Area module, but there are no buttons for inserting/editing links any more.

      The developer indicated this was a bug with Tiny MCE in the latest release – is this the case? From what is written above Tiny MCE is no longer a part of things, and the GT3 is not going to work anymore?


    • hernangonzalez 9:49 pm on August 23, 2015 Permalink | Log in to Reply

      This change seems to be a headache for those who had chosen to no use wpautop() on their blogs (disabled via plugins or custom themes) and who want to control the HTML markup themselves.

    • lokidude99 10:47 pm on August 26, 2015 Permalink | Log in to Reply

      Seems to have broken all my sites that used qtranslate plus a plugin that seems to have recently become unsupported.

      Debug mode throws no errors and the only error I see in the console is ..

      Uncaught TypeError: Cannot read property ‘canvas’ of undefinedb.closeAllTags @ quicktags.min.js?ver=4.3:1d @ editor.min.js?ver=4.3:1(anonymous function) @ editor.min.js?ver=4.3:1i @ tinymce.min.js?ver=4203-20150730:2m @ tinymce.min.js?ver=4203-20150730:2

      When you click on the visual tab in the editor.

      Any suggestions on where I should look to fix this?

      Urgently need assistance on this.

    • WooRockets 8:32 am on September 9, 2015 Permalink | Log in to Reply

      Thanks for informing us about the problem with the visual editor. Current we are using wp_editor() function for our plugin: WR PageBuilder, and it isn’t working on WordPress 4.3 (it was working well on WordPress 4.2). I’d really appreciate if you could suggest me a way to fix this problem. Thank you very much.

    • WooRockets 8:48 am on September 9, 2015 Permalink | Log in to Reply

      Please see screenshot problem here:



      • Andrew Ozz 3:47 pm on September 9, 2015 Permalink | Log in to Reply

        Looks like an error in an “inline” script on that page. To troubleshoot: best to enable `SCRITP_DEBUG`, then look at the script where the first error occurs. My guess is that the plugin doesn’t select the editor switching buttons properly.

    • abeeken 8:48 am on September 14, 2015 Permalink | Log in to Reply

      Hello people, hopefully this is the correct thread for this; it’s the only one that I can find that seems to pertain to the problem I’m having!

      So, I’ve got a Network install that I’m running a very specific suite of sites on for use at our University. A feature I’ve included in this is that certain pages allow registered users to add content via a TinyMCE editor instantiated using the wp_editor() function. This was working all fine and great until I updated to WP4.3 at which point the editor loads the Visual and Code tabs, but none of the formatting buttons – in fact, it’s always displaying in the text view with no formatting at all. In addition, the Admin menu bar is also not displaying for any pages which display the wp_editor() field.

      Is this a known issue in 4.3 or is it likely to be something to do with my particular install? I’ve tried switching themes, disabling plugins etc but it specifically seems to be tied in with my using this function.

      Any help or confirmation of this issue would be greatly appreciated.

  • Konstantin Kovshenin 11:20 am on April 11, 2014 Permalink
    Tags: , , , TinyMCE   

    Plupload 2.x in WordPress 3.9 

    Plupload is the library that powers most of the file upload interfaces in WordPress, and in 3.9 we’ve updated the bundled library to version 2.1.1 (#25663). Here are some of things that have changed, which may affect WordPress plugins and themes.

    If you’re using direct references to Plupload’s runtime .js files, such as plupload.html5.js, note that these files are now gone. The following script handles were removed: plupload-html5, plupload-flash, plupload-silverlight and plupload-html4. If you need to enqueue the Plupload library, just use the plupload handle.

    If you’re constructing your own Plupload settings array vs. using wp_plupload_default_settings() and/or the _wpPluploadSettings object, note that some of the arguments have changed, most notably:

    • flash_swf_url should point to the new Moxie.swf file (See update)
    • Similarly, silverlight_xap_url should use the new Moxie.xap (See update)
    • The multiple_queues argument is no longer used
    • The max_file_size key has been moved to the filters array
    • The filters array now supports multiple keys, and the list of file types array has been moved to its mime_types key

    To illustrate that with code:

    $settings = array(
        // ...
        'flash_swf_url' => includes_url( 'js/plupload/plupload.flash.swf' ), // Unchanged
        'silverlight_xap_url' => includes_url( 'js/plupload/plupload.silverlight.xap' ), // Unchanged
        'filters' => array( 
            'max_file_size' => $max_upload_size . 'b', 

    Plupload version 2.1.1 has also added some exciting new options and methods, which you can find in the updated documentation.

    As a result of this update in WordPress 3.9 we were able to add drag and drop upload support directly to our TinyMCE editor (#19845), and we’ve also added a new boolean flag to wp_editor(), which you can use to enable drag and drop upload support in your own instance of the editor (#27465):

    wp_editor( '', 'my-editor', array(
        // ...
        'drag_drop_upload' => true,
    ) );

    If you run into any problems with this update in 3.9, please leave a comment on this post and we’ll be happy to help you out!

    Update: I opened #27763 to address some of the compatibility issues around the update. We might be renaming the swf/xap files for backwards compatibility.

    Update, April 13: The original swf/xap filenames were restored.

    • Andrew Nacin 1:20 am on April 14, 2014 Permalink | Log in to Reply

      Post updated to reflect changes via #27763.

    • experiencedbadmom 11:54 am on April 18, 2014 Permalink | Log in to Reply

      Thank you for the link to the manual instructions. My blog is experiencedbadmom.com tho, not experiencedbadmom.com/wordpress/ – does that matter? Also, one of the steps says to deactivate plugins – how am I to deactivate plugins if I can’t even get into my dashboard? GoDaddy is my host – do I deactivate plugins somewhere on their servers?

    • Najeeb 6:16 am on April 21, 2014 Permalink | Log in to Reply

      Hello there,

      well I am using pluploader library in my plugin and when try ‘plupload’ handle to use shipped scripts it not applying to my uploader object, even I can see libraries are loading. Any help will be much appreciated.


      • Konstantin Kovshenin 7:32 am on April 21, 2014 Permalink | Log in to Reply

        Hi there! Can you please provide more details, like a code sample? Also, has it worked in 3.8 and broken in 3.9 or does it just not work in general? Thanks!

    • pbusardo 7:13 pm on April 21, 2014 Permalink | Log in to Reply

      Perhaps this is relevant. I believe the FLA gallery uses Plupload. When I try to upload multiple files to the gallery, the GUI no longer appears.

  • Andrew Nacin 5:24 am on March 27, 2014 Permalink
    Tags: , , , TinyMCE   

    TinyMCE 4.0 requires text/css for editor style files 

    As of TinyMCE 4.0, the visual editor iframe now has an HTML5 document type (<!DOCTYPE html>). In this scenario, CSS files must be served with the text/css content type. A server will serve a *.css file with the proper content type, but if you’re using a PHP file for an editor style file, you need to be the one to do it. It’s as simple as leading with:

    header( 'Content-Type: text/css; charset=UTF-8' );

    So if you’re doing something particularly crazy with the editor and your styles aren’t loading in WordPress 3.9, you may just need a content type. Also, Chrome (and probably other browsers) throw a console warning when this happens.

    (via #27288)

  • Andrew Ozz 6:33 pm on January 18, 2014 Permalink
    Tags: , , , TinyMCE   

    TinyMCE 4.0 is in core 

    This is a major upgrade for the WordPress editor. There are many changes in 4.0:

    • New UI and UI API.
    • New theme.
    • Revamped events system/API.
    • Better code quality, readability and build process.
    • Lots of (inline) documentation.
    • And generally many improvements everywhere.

    All default TinyMCE plugins have been upgraded. The WordPress implementation custom plugins  were upgraded too. Looking in the plugin repository, there are a lot of WordPress plugins  that add a TinyMCE plugin. Because of all the API changes, most of these plugins would need an update too. If you are the author of such plugin, please test it in trunk now.

    Generally there are three groups of TinyMCE plugins added by WordPress plugins:

    • Custom plugin created specifically for the WordPress plugin. If you’ve developed this kind of plugin, please see the 3.x to 4.0 migration guide and the 4.0 API documentation.
    • WordPress plugins that add third-party or default TinyMCE plugins would (of course) need to be updated to include the 4.0 version of the plugin. The PHP global $tinymce_version can be used to determine which plugin to load.
    • Mini-plugins that only add a button to the toolbar. This works pretty much the same. It is advisable to update to use the ‘dashicons’ icon font instead of image icon.

    TinyMCE 4.0 includes a ‘compat3x’ plugin that should prevent all fatal errors caused by old plugins and adds compatibility for most of the 3.x API methods. If there are any editor related Javascript errors while running trunk, please open a trac ticket quoting the first error from the browser console.

    • Shapeshifter 3 7:24 pm on January 18, 2014 Permalink | Log in to Reply

      Mr. Ozz,

      I’ve been using the TinyMCE Spellchecker plugin but recently disabled it while reviewing your progress with TinyMCE 4.0. I was going to leave it installed (but disabled) until the developer updates it. Would you recommend that I completely uninstall it instead?

      • Andrew Ozz 9:03 pm on January 18, 2014 Permalink | Log in to Reply

        The updated ‘spellchecker’ plugin currently doesn’t work with the (old) PHP back-end. This is a somewhat moot problem as all newer browsers have built-in spellcheckers. Furthermore Jetpack includes the After the Deadline module which also checks grammar.

        I know that the TinyMCE team has plans for the ‘spellchecker’ plugin, but for now it has been removed from the default editor configuration.

    • PeterRKnight 7:31 pm on January 18, 2014 Permalink | Log in to Reply

      I’ve been looking forward to this so bad. Awesome news!!

    • Jeremy Felt 7:43 pm on January 18, 2014 Permalink | Log in to Reply

      Great news, thanks @azaozz!

    • Mike Schinkel 9:04 pm on January 18, 2014 Permalink | Log in to Reply

      Hi @azaozz,

      This is indeed good news!

      Do you (or anyone else) know if it will make it easier to have more than one TinyMCE instance in a single admin page?

      • Andrew Ozz 9:15 pm on January 18, 2014 Permalink | Log in to Reply

        Creating multiple TinyMCE instances has been quite easy for some time 🙂

        From PHP all that’s needed is to call `wp_editor()` and pass any initial content and an unique HTML ID. From JS you can simply call `tinymce.init({ my_settings_obj })`. TinyMCE 4.0 also supports “inline” instances, so any part of the screen can be made editable (of course that would need some more JS to handle saving).

    • adamsilverstein 5:06 am on January 19, 2014 Permalink | Log in to Reply

      Thanks again Sir Ozz for your diligent work on this. Its going to make a huge difference for everyone editing content every day in WordPress ! Even if they don’t notice how much has improved, the improvements will benefit them. Its a bit of open heart surgery at the core of WordPress and you are the man to handle it!

      So cheers to you from the untold masses who benefit from your work! Thank you!

    • emzo 11:21 pm on January 19, 2014 Permalink | Log in to Reply

      Great work on this!

      Do you happen to know if TinyMCE 4.x can be moved around in the DOM without breaking? With the 3.x release, dragging/moveing a WP metabox containing a TinyMCE instance it causes TinyMCE to break. I believe it’s down to how certain browsers deal with moving iframes within the DOM, and it is possible to circumvent the problem by removing the TinyMCE instance then re-adding it after moving, but it is a bit of a faff. Does TinyMCE 4.x help with this issue in any way?

      • Andrew Ozz 12:02 am on January 20, 2014 Permalink | Log in to Reply

        Haven’t tried that yet, but 4.0 is more resilient than 3.5, so hopefully it works. If not, a relatively simple workaround would be to not initialize the instance on page load and have a button/link “Edit”. Then on initialization lock down the postboxes so they cannot be moved: $( selector ).sortable('disable');.

    • Piet 1:16 am on January 20, 2014 Permalink | Log in to Reply

      Great stuff, reading the 4.x documentation now.

      After downloading current core from git and trying it out, I noticed that a tooltip has been added to the buttons. Does anyone know how to include that tooltip as my plugin now shows the tooltip en.undefined

      • Andrew Ozz 1:37 am on January 20, 2014 Permalink | Log in to Reply

        IMHO the best way to learn the new API is to check the default plugins. Most of them add a button and also a menu item (4.0 can show a menubar too). The menubar is not shown by default in WordPress but that might change.

        The translations API in 4.0 is changed too. All strings are in English and are matched directly against the loaded translation. The ‘compat3x’ plugin patches it to make it back-compat. If you see ‘undefined’ perhaps refresh the browser cache again (just in case) and trace where it comes from. You should be seeing some kind of a string.

    • Jeff Chandler 7:38 pm on January 20, 2014 Permalink | Log in to Reply

      Using the bleeding edge nightlies for 3.9, am I suppose to see a noticeable different between the visual editor of WordPress 3.8 and what was added to WordPress with TinyMCE 4.0? I don’t see much of a difference except for a dark background tooltip when hovering over the buttons and the removal of the Paste From Word button.

    • Paal Joachim Romdahl 12:46 pm on January 21, 2014 Permalink | Log in to Reply

      Looking at the interface for 4.0 the use of tables is still much in use (from what I saw that the tinyMCE web site). It would be nice to create columns/boxes in a similar way to creating tables. As one would be able to place content inside the cells (dashed lined area) create buffers between the cells as a margin.

      This way one would be able to create boxes/columns in an easy visual way using the table look and feel.

      Perhaps even add a background color, curved lines, shadow etc..:)

    • needle 11:33 am on January 22, 2014 Permalink | Log in to Reply

      My existing wp_editor() code defines the buttons that I want to have appear by populating the ‘tinymce’ array that is passed to wp_editor() as part of the $settings array. But now, because the ‘advanced’ theme is no longer present, the editor no longer works. What’s the procedure for recreating this functionality with TinyMCE 4.0?

    • David Wells 8:56 pm on April 16, 2014 Permalink | Log in to Reply

      Our tinymce button is done from the tinymce toolbar with the 3.9 update and tinyMCE 4.0

      I’ve read http://www.tinymce.com/wiki.php/Tutorial:Migration_guide_from_3.x but don’t see any thing specific to our case.

      Our code was adding an additional button to the toolbar: https://github.com/inboundnow/leads/blob/master/shared/inbound-shortcodes/js/tinymce.js#L41-L183

      Can anyone see what the issue might be? or can you point me in the right direction to fix?

      Many thanks

      • Andrew Ozz 11:15 pm on April 25, 2014 Permalink | Log in to Reply

        The TinyMCE API has changed, adding a “simple” button works pretty much like in 3.x, however for adding a drop-down or a split button you’ll need to use the new API. There are some examples in the TinyMCE default plugins.

    • Mr. Vibe 9:47 am on April 17, 2014 Permalink | Log in to Reply

      +1, similar case as @David wells. Tried the compact3x plugin and it does not work. Any ideas ? The codex is not updated and we’re hanging in the middle of nowhere.

    • Jacob N. Breetvelt 10:13 am on April 17, 2014 Permalink | Log in to Reply

      Can you lease help me in fixing this?

      /* wppa-tinymce.js

      • Pachkage: wp-photo-album-plus
      • Version 5.2.17
      • /

      // closure to avoid namespace collision
      // creates the plugin
      tinymce.create(‘tinymce.plugins.mygallery’, {
      // creates control instances based on the control’s id.
      // our button’s id is “mygallery_button”
      createControl : function(id, controlManager) {
      if (id == ‘mygallery_button’) {
      // creates the button
      var button = controlManager.createButton(‘mygallery_button’, {
      title : ‘WPPA+ Shortcode Generator’, // title of the button
      image : wppaImageDirectory+’albumnew32.png’, // path to the button’s image
      onclick : function() {
      // triggers the thickbox
      var width = jQuery(window).width(), H = jQuery(window).height(), W = ( 720 < width ) ? 720 : width;
      W = W – 80;
      H = jQuery(window).height();
      H = H – 115;
      tb_show( 'WPPA+ Shortcode Generator', '#TB_inline?width=' + W + '&height=' + H + '&inlineId=mygallery-form' );

      var isNew = wppa_getCookie('wppanewstyle') == 'on';
      if (isNew) document.getElementById('mygallery-newstyle').checked = 'checked';
      return button;
      return null;

      // registers the plugin. DON'T MISS THIS STEP!!!
      tinymce.PluginManager.add('mygallery', tinymce.plugins.mygallery);

      // executes this when the DOM is ready
      // creates a form to be displayed everytime the button is clicked
      // you should achieve this using AJAX instead of direct html code like this
      var xmlhttp = wppaGetXmlHttp(); // located in wppa-admin-scripts.js
      // wppa-ajax.php calls wppa_make_tinymce_dialog(); which is located in wppa-tinymce.php

      var url = wppaAjaxUrl+'?action=wppa&wppa-action=tinymcedialog';
      xmlhttp.onreadystatechange=function() {
      if (xmlhttp.readyState == 4 && xmlhttp.status!=404 ) {
      var formtext = xmlhttp.responseText;

      var form = jQuery(formtext);

      var table = form.find('table');

      // handles the click event of the submit button

      var type = table.find('#mygallery-type').val();
      var temp1;
      if (table.find('#mygallery-album').val()) temp1 = table.find('#mygallery-album').val().split('|');
      else temp1 = [''];
      var album = temp1[0];
      var tags = table.find('#mygallery-tags').val();
      var andor = document.getElementById('mygallery-andor').checked;
      var size = table.find('#mygallery-size').val();
      var align = table.find('#mygallery-align').val();
      var temp2;
      if (table.find('#mygallery-photo').val()) temp2 = table.find('#mygallery-photo').val().split('.');
      else temp2 = [''];
      var photo = temp2[0];
      var temp3 = photo.split('/');
      photo = '';
      for ( i=0; i 0) {} // Ok, positive number
      else if (size == ‘auto’) {} // Ok, auto
      else {
      alert(‘Sorry, you made a mistake\n\nSize must be a positive number or auto\nA number less than 100 will be interpreted as a percentage of the current column width\n\nPlease try again’);
      if (size < 100) size=size/100;

      // Check for inconsistencies
      if ( type == 'cover' ) {
      if ( album == '#topten' || album == '#lasten' || album == '#comten' || album == '#featen' || album == '#tags' || album == '#all' ) {
      alert('Sorry, you made a mistake\n\nA — special — selection has no album cover\n\nPlease try again');
      if ( type != 'photo' && type != 'mphoto' && type != 'slphoto' && type != 'generic' && type != 'upload' ) {
      if ( album == 0 ) {
      alert('Sorry, you made a mistake\n\nPlease select an album\n\nPlease try again');
      if ( type == 'photo' || type == 'mphoto' || type == 'slphoto' ) {
      if ( photo == 0 ) {
      alert('Sorry, you made a mistake\n\nPlease select a photo\n\nPlease try again');
      if ( type == 'filmonly' && ! newstyle ) {
      alert('Sorry, filmonly is as newstyle shortcode available only.\n\nPlease check the new style checkbox and try again.');
      if ( type == 'upload' && ! newstyle ) {
      alert('Sorry, the upload box is as newstyle shortcode available only.\n\nPlease check the new style checkbox and try again.');
      if ( album == '#tags' && ! tags ) {
      alert('Select at least one tag and try again.');

      // Make the shortcode
      var shortcode = '%%wppa%%';

      if ( type == 'generic' ) {
      else if ( type == 'photo' || type == 'mphoto' || type == 'slphoto' ) {
      shortcode += ' %%'+type+'='+photo+'%%';
      else if ( album == '#tags' ) {
      shortcode += ' %%album=#tags,';
      var sep = andor ? ',' : ';';
      var last = tags.length – 1;
      for (var tag in tags) {
      shortcode += tags[tag];
      if ( tag != last ) shortcode += sep;
      shortcode += '%%';
      else {
      var temp = album.split('|');
      if ( temp[0] == '#topten'|| temp[0] == '#lasten' || temp[0] == '#comten' || temp[0] == '#featen' ) {
      if ( cnt != '0' ) {
      shortcode += ' %%'+type+'='+temp[0]+','+alb+','+cnt+'%%';
      else if ( alb != '0' ) {
      shortcode += ' %%'+type+'='+temp[0]+','+alb+'%%';
      else {
      shortcode += ' %%'+type+'='+album+'%%';
      else {
      shortcode += ' %%'+type+'='+album+'%%';

      if ( size != 0 )
      shortcode += ' %%size='+size+'%%';

      if ( align != 'none' )
      shortcode += ' %%align='+align+'%%';

      // Make the new shortcode
      var newShortcode = '[wppa type="'+type+'"';

      if ( type == 'generic' ) {
      else if ( type == 'photo' || type == 'mphoto' || type == 'slphoto' ) {
      newShortcode += ' photo="'+photo+'"';
      else if ( album == '#tags' ) {
      newShortcode += ' album="#tags,';
      var sep = andor ? ',' : ';';
      var last = tags.length – 1;
      for (var tag in tags) {
      newShortcode += tags[tag];
      if ( tag != last ) newShortcode += sep;
      newShortcode += '"';
      else {
      var temp = album.split('|');
      if ( temp[0] == '#topten' || temp[0] == '#lasten' || temp[0] == '#comten' || temp[0] == '#featen' ) {
      if ( cnt != '0' ) {
      newShortcode += ' album="'+temp[0]+','+alb+','+cnt+'"';
      else if ( alb != '0' ) {
      newShortcode += ' album="'+temp[0]+','+alb+'"';
      else {
      newShortcode += ' album="'+temp[0]+'"';
      else {
      if ( album || type != 'upload' ) {
      newShortcode += ' album="'+album+'"';

      if ( size != 0 ) newShortcode += ' size="'+size+'"';
      if ( align != 'none' ) newShortcode += ' align="'+align+'"';
      newShortcode += '][/wppa]';

      // inserts the shortcode into the active editor and save the newstyle checkbox
      if (newstyle) {
      tinyMCE.activeEditor.execCommand('mceInsertContent', 0, newShortcode);
      wppa_setCookie('wppanewstyle', 'on', '365');
      else {
      tinyMCE.activeEditor.execCommand('mceInsertContent', 0, shortcode);
      wppa_setCookie('wppanewstyle', 'off', '365');

      // closes Thickbox

      function wppaGalleryTypeChange(value) {

      if (value == 'generic' ) {
      else if (value == 'photo' || value == 'mphoto' || value == 'slphoto' ) {
      else {

      function wppaTinyMcePhotoPreview(id) {

      function wppaTinyMceAlbumPreview(id) {
      var html = ”;
      var temp = id.split(‘|’);
      var count = temp.length – 1;

      if (count > 0) for (var i = 1; i <= count; i++) {
      if ( temp[i] != '' ) html += '‘;
      else {
      html = ‘


      if ( temp[0] == ‘#topten’ || temp[0] == ‘#lasten’ || temp[0] == ‘#comten’ || temp[0] == ‘#featen’ ) {
      else {

      function wppaGalleryAlbumChange(value) {
      if ( value == ‘#tags’ ) jQuery(‘.mygallery-tags’).css(‘display’, ”);
      else jQuery(‘.mygallery-tags’).css(‘display’, ‘none’);

    • llazarus 11:23 am on April 17, 2014 Permalink | Log in to Reply

      Upgraded to 3.9 and tinyMCE 4.0. I am unable to Edit a hyperlink – if I select the link and click Insert/Edit Hyperlink, the existing link is erased.

      Also, when pasting a link from Word that has a target=”_blank”, the extra code is removed – this making more work for me as I specifically generate the link to open in a new window. Is there anyway to stop the target=”_blank” being removed?

      Many thanks

    • TTBoS 10:22 pm on April 17, 2014 Permalink | Log in to Reply

      A similar problem is with onmouseover and onmouseout WP removes the html code from the article / news.

    • alfredocubitos 2:27 pm on April 18, 2014 Permalink | Log in to Reply


      how can I get data passed with the “tiny_mce_before_init” filter?
      In my old plugin I get the data with “tinyMCE.activeEditor.settings” but with tinyMCE I can’t get any data.
      Or has the “tiny_mce_before_init” filter changed?

      Thanx for your answer

      • Andrew Ozz 10:59 pm on April 25, 2014 Permalink | Log in to Reply

        No, the filter hasn’t changed and tinymce.activeEditor.settings works as before. Seems there is another problem. The init settings can also be accessed with ‘tinyMCEPreInit.mceInit.editor_id’ where ‘editor_id’ is the id of the instance you need.

    • thanhluan710 5:10 am on April 19, 2014 Permalink | Log in to Reply

      Hi all.
      I upgraded WordPress to Version 3.9 and I have a problem with Visual Editor.
      My site is for coupon. When I write a post on Visual Editor on “Visual” tab and I want insert html code, I move “Text” tab. For example code:

      Click here to WordPress:

      Well done. A post is successful but When I update post, I see:

      Click here to WordPress:

      Link was lost. I can not open a new tab when click button. On WordPress version 3.8.3, all is good. I turned off all plugin but not success. I install new site with WP 3.9 but same.

      Please me. Thank you.

    • Karen Pogosyan 2:05 pm on April 22, 2014 Permalink | Log in to Reply

      Hello, everyone, just updated wordpress to new 3.9, new features are great, love them. Only got some issues with tinyMCE 4. I use wp_editor to create multiple tinyMCE editors with custom field.

      $tinymce_opt = array(
      	 'height' 	 => "250",
      	 'plugins'  => "ninzio_button, line, gap, slider_colorbox, icon_list, icons, font_size",
      	 'toolbar1' => "formatselect,fontselect, styleselect,|,bold,italic,underline,|,justifyleft,justifycenter,justifyright,justifyfull,|,link,unlink,|,forecolor,removeformat,charmap,undo,redo",
      	 'toolbar2' => "ninzio_button, line, gap, slider_colorbox, icon_list, icons, font_size",
      	 'toolbar3' => ""
      $settings = array (
      	'tinymce'       => $tinymce_opt
      wp_editor( ${"layer_$i"}, "layer_$i", $settings);

      everything is fine. the problem is that it does not understand plugins (my custom shortcodes, that i created). Custom shortcodes work fine in regular wp editor, but iwth multiple wp_editor, it just don’t find them.

      In colsole i get error 404 can’t find

      for example “line” shortcodes

      http://localhost/0_test/wp-includes/js/tinymce/plugins/line/plugin.min.js 404 (Not Found)

      All my custom shortcodes are ignored, not found.

      Does anyone know, how to tell tinyMCE + wp_editor to use custom shortcodes?

      Thanks very much!

      • Andrew Ozz 10:45 pm on April 25, 2014 Permalink | Log in to Reply

        As your custom MCE plugins are not in the default location, i.e. not in wp-includes/js/tinymce/plugins/, you have to load them as external plugins using the ‘mce_external_plugins’ filter.

    • Stagger Lee 8:09 pm on April 23, 2014 Permalink | Log in to Reply

      Can someone share code snippet for functions.php to disable some buttons (and new toolbar) in comment forms ? Old one doesnt work anymore witj new tinymce.

      Btw, new WP 3.9 and new Tinymce are real candy. Real enjoyable to work with latests WP.

      Have difficult to understand why Drupal chosed Ckeditor for core in its Drupal 8 version.
      Ckeditor aka “look at me i am from outer space with my huge buttons and huge shadows that never near fit to themes”.

      • Andrew Ozz 10:54 pm on April 25, 2014 Permalink | Log in to Reply

        That should be set in the plugin you’re using for adding TinyMCE to the comment form. If that plugin uses wp_editor(), it may be possible to use the ‘mce_buttons’, ‘mce_buttons_2’, etc. filters. Having a code snippet in functions.php is not the best way to do that 🙂

    • Thomas S. Butler 10:31 pm on April 25, 2014 Permalink | Log in to Reply

      As the author of the Google Fonts Manager plugin, I am having this issue as well. The custom font dropdown no longer appears and the TinyMCE documentation is no help at all. The plugin was using the following functions: theme_advanced_buttons1_add_before, theme_advanced_fonts and tiny_mce_before_init to add the font options. It no longer works and I’m stumped (so far) as to how to address the issue.

      • Andrew Ozz 11:28 pm on April 25, 2014 Permalink | Log in to Reply

        Would have been better to use a WordPress filter, ‘mce_buttons’ or ‘mce_buttons_2’, to add the button. Would have worked without a change. All the ‘theme_advanced_*’ settings are gone from TinyMCE as there is a new theme. Have a look at the settings: http://www.tinymce.com/wiki.php/Configuration, seems you need ‘font_formats’: http://www.tinymce.com/wiki.php/Configuration:font_formats.

      • Stagger Lee 8:54 am on April 26, 2014 Permalink | Log in to Reply

        Thank you Andrew. mce_buttons never worked for me, maybe i used wrong code snippet.
        I know what you are saying, but this way i block even Admins to all Tinymce options and icons.
        Cant use plugin for this because they dont exist. One exist but is outdated.

        This code snippet works for me now, unfortunately had to remove new menu toolbar at the top even for admins with Tinymce advanced plugin (global setting).


        add_filter( ‘comment_form_defaults’, ‘rich_text_comment_form’ );
        function rich_text_comment_form( $args ) {
        wp_editor( ”, ‘comment’, array(
        ‘media_buttons’ => false, // show insert/upload button(s) to users with permission
        ‘textarea_rows’ => ’10’, // re-size text area
        ‘tinymce’ => array(
        ‘menubar’ => ”,
        ‘toolbar1’ => ‘fontsizeselect,bold,italic,underline,strikethrough,bullist,numlist,alignleft,aligncenter,alignright,blockquote,link,unlink,|,undo,redo,media,image,emoticons,’,
        ‘toolbar2’ => ”, // 2nd row, if needed
        ‘toolbar3’ => ”, // 3rd row, if needed
        ‘toolbar4’ => ” // 4th row, if needed
        ‘quicktags’ => array(
        ‘buttons’ => ‘strong,em,link,block,del,ins,img,ul,ol,li,code,close’
        ) );
        $args[‘comment_field’] = ob_get_clean();
        return $args;

    • nextstep 5:20 am on April 26, 2014 Permalink | Log in to Reply

      How do I restore the icons? I hate the menu options — it’s now multiple click to find what I want (not what you want to give me. The menu — in my opinion — is a definite step backwards.

    • urkekg 8:29 am on April 26, 2014 Permalink | Log in to Reply

      Hi all,

      I’m not sure if this is right place to post this question, but let me try 🙂

      We need a class field in Link Insert/Edit plugin (WP_Link). Is that mod on the way, or I can submit diff I did to enable this? I altered core files /wp-includes/js/wplink.js and /wp-includes/class-wp-editor.php

      Also, we need some docs regarding custom colour swatches and number of rows. Here is my answer to that question on StackOverflow http://stackoverflow.com/a/23183406/1509769

    • Stagger Lee 9:04 am on April 26, 2014 Permalink | Log in to Reply

      Maybe someone from the core team should take a look at it. Maybe i am plain stupid and miss something in the front of oy nose, but i struggle from website to website to customize editor for my comment form. Losing much time on it every time.

      Second problem is my code snippet in functions.php for overriding editor works in admin part but not at the front end. Not so easy to style comments editor. Use of !important declarations are so bad, but had to use them. Right now i find it more easy to go and change it directly in the core, CSS. What to do, cant lose much time on it every time.

    • Stagger Lee 9:27 am on April 26, 2014 Permalink | Log in to Reply

      As i know and i am aware people from Drupal team in latest years sniff things around WP as undercover agents, and imitate some good things. You can take something good from them too. For instance Text formats and editor profiles for writing and editors. So simple and so easy. Easy to customize all butons, options, and override CSS (or JS) files for each profile/format.

    • akamaxbuz 10:04 pm on May 16, 2014 Permalink | Log in to Reply

      What about keeping the format styling when pasting from Pages? I use Pages to edit my client’s dock files. Styled text from Pages does loses the style format when I paste it into the 3.9 edit pane. This is a problem.

  • Andrew Nacin 10:49 am on December 10, 2012 Permalink
    Tags: , TinyMCE   

    WordPress 3.5 RC6 is out. Please, if you can (and earlier the better), hammer on TinyMCE with the most ridiculous object and embed tags you can find, and anything HTML5. (Here’s a zip for the nightly build.)

    What’s important in RC6? After a good first attempt last week (#22790), we took another stab (#22842) at fixing TinyMCE’s handling of, well, ridiculous object and embed tags. Our goal right now is to ensure that nothing breaks in 3.5 that worked in 3.4.2. So, go find your best embed spaghetti* and make sure nothing breaks.**

    • Very easy to test: Go to the “Text “tab, paste something in, head to the Visual tab, confirm things don’t look broken, head back to the “Text” tab, see if it looks mangled, head back to Visual, confirm things don’t look broken. Remember, we are looking for regressions, so also check 3.4.2 to see if it occurs there.

    ** Breaks means the embed disappears in whole or part, or there’s a JavaScript error, or your computer starts smoking. Whitespace and other HTML changes do/will happen (contents may settle during shipping). Of course, your content should never be damaged, as that’s just no fun.

    What happened to the last two RCs? We generally try to do a “soft” or “silent” RC at the very end of a cycle. We’re confident we’ve gotten the testing it needs, but we’d like to enter a 24-hour period where there are no more changes to trunk. Having a cleaner version number provides for a good line in the sand, and can help in case some blocker bug report comes in. Of course this time, we’ve stuttered a few times. TinyMCE hell was RC4. A few final changes on Friday (after we decided to not release) resulted in RC5. And the second round of TinyMCE hell is RC6.

    This also means our new target is Tuesday, December 11. We’ll again convene at 10 a.m. Eastern to see if the winds are blowing in our direction. (Even NASA needs good weather.)

    And hey, on the bright side:

    • Nick 12:06 pm on December 10, 2012 Permalink | Log in to Reply

      Just updated to WordPress 3.5 RC6 and conducted the above mentioned test… Nothing broken. Looks fine for me!

    • Xavier Borderie 12:40 pm on December 10, 2012 Permalink | Log in to Reply

      Insane work you’ve all accomplished again, guys! Congratulations and thank you!

    • Ryan Markel 1:16 pm on December 10, 2012 Permalink | Log in to Reply

      Casual thought: we need HTML-mangle unit tests so we aren’t caught off-guard by TinyMCE weirdness in future releases.

    • Jane Wells 2:35 pm on December 10, 2012 Permalink | Log in to Reply

      I’m thinking that @nacin and @koopersmith should submit a speaking proposal about this experience to the O’Reilly Fluent Conference. Proposals are due today, conference is May in San Francisco. http://fluentconf.com/fluent2013

    • mordauk 4:17 pm on December 10, 2012 Permalink | Log in to Reply

      Works perfectly for me so far.

    • Ipstenu (Mika Epstein) 4:39 pm on December 10, 2012 Permalink | Log in to Reply

      Banging on it without any errors so far. I’ve even gone to test my psycho code posts on halfelf. While it doesn’t work when I switch between posts that have a mondo amount of code (like I quote a whole MU plugin), it works better than it did on 3.4.2, so (1) not a regression (2) improvement!

      (The tl;dr of “If you have lots and lots of code in posts, tinyMCE is not your friend” remains, and that ain’t us, it’s them.)

    • paolal 5:15 pm on December 10, 2012 Permalink | Log in to Reply

      Tried to break it with many embeds, but it worked flawlessly. Thanks for all the work you are doing!

    • michaelha 5:27 pm on December 10, 2012 Permalink | Log in to Reply

      @nacin thanks for the update

    • tjsix 6:26 pm on December 10, 2012 Permalink | Log in to Reply

      Trying out various combinations I found that if a nested tag inside a parent with attributes will be removed if it is empty, even if it has attributes of it’s own. I’ve tried this with just about every tag I could think of that would potentially be an empty element, i.e. divs, spans, i’s (for icon fonts), anchors all of which could conceivably be an element element and styled with a background image/font via css.

    • Eric Hoanshelt 8:00 pm on December 10, 2012 Permalink | Log in to Reply

      Looking good so far!

    • memuller 1:08 am on December 11, 2012 Permalink | Log in to Reply

      Tested with some crazy posts from members on my WP Network. There are issues, but I’m pretty sure there are no regressions.

  • Andrew Ozz 6:15 am on October 3, 2008 Permalink
    Tags: TinyMCE   

    Updated TinyMCE to 3.2.0 and removed the … 

    Updated TinyMCE to 3.2.0 and removed the compression, so it can be cached in Gears and the browser. Seems to speed up the loading of the Write/Edit page by up to 40% (tested on a typical shared hosting). Some more info.

    • Mark Jaquith 8:30 am on October 3, 2008 Permalink | Log in to Reply

      Quite snappy!

    • Omar 9:10 pm on October 3, 2008 Permalink | Log in to Reply

      could you try and get the TinyMCE Editor to be more compatible with special needs of accessibility (contrast has to be higher, images should have useful alternative text etc..).

    • Andrew Ozz 9:44 pm on October 3, 2008 Permalink | Log in to Reply

      @Omar by images you mean the buttons? They already have alt text that is translatable and describes them well. Could open a ticket on trac if you want to suggest some changes.

      TinyMCE has several settings for accessibility, mainly for controlling the tab key, can also increase the default font size, but that should be done from a plugin so it can be turned on and off.

    • Xavier 6:27 pm on October 4, 2008 Permalink | Log in to Reply

      While you’re at it, I’m sure you didn’t get that “request” from michel_v 🙂 http://twitter.com/michelv/statuses/941259065

    • Andrew Ozz 6:58 pm on October 4, 2008 Permalink | Log in to Reply

      @Xavier “scarcity of plugin hooks”? TinyMCE is the piece of code that probably has the most hooks in WordPress, 15 to be exact. Was even thinking to consolidate some of them, but that may break existing WordPress plugins.

  • Ryan Boren 4:34 pm on June 27, 2008 Permalink
    Tags: TinyMCE   

    Updated to TinyMCE 3.1.1 which includes … 

    Updated to TinyMCE 3.1.1 which includes several fixes for Opera 9.50 and Safari, removes align = center properly, and improves support for embeds in the “Media” plugin.

  • Ryan Boren 4:56 pm on June 19, 2008 Permalink
    Tags: TinyMCE   

    Updated TinyMCE to 

    Updated TinyMCE to

compose new post
next post/next comment
previous post/previous comment
show/hide comments
go to top
go to login
show/hide help
shift + esc
Skip to toolbar