Support » Plugin: Code Snippets » 'Edit Snippet' page layout messed up

  • Resolved GermanKiwi


    Hi Shea,

    I’ve just installed Code Snippets for the first time (on WordPress 3.5.2), and then I’ve gone to the “Add New” page to add a new snippet.

    The layout of this page seems all messed up – have a look at this screenshot:

    The white panel underneath the label “code” can’t be typed into – it won’t let me place my mouse cursor in there (ie. it’s not a text panel). Likewise with the grey panel beneath that – I can’t type into there. In fact the only area I can type into is the title at the top.

    Any ideas what is going wrong?

Viewing 13 replies - 1 through 13 (of 13 total)
  • Plugin Author Shea Bunge


    Both the description editor and the code editor use JavaScript – the name editor doesn’t. Can you try accessing the page in a different browser? Try Google Chrome, perhaps. Also, if you could copy the source of that page (Control/Cmd+U) into a secret Gist or Pastebin and post the link here, that would help with debugging.

    Plugin Author Shea Bunge


    On a second look at the screenshot, it looks like the problem is solely to do with the code editor, which is stuffing up and stretching over the description editor.

    The code editor uses version 3 the CodeMirror library. If another plugin is loading an older version of CodeMirror on the same page, there’s bound to be unsightly results. Try deactivating all of the plugins and see if the error is fixed. If so, re-enable the plugins one at a time to see what is causing the issue.

    You’re right – the problem was caused by another plugin. I searched through all my installed plugins and found one that is using CodeMirror version 2.33. I disabled that plugin, and the display of Code Snippets returned to normal – everything looking and working just fine!

    The plugin with the old version of CodeMirror is called WP Editor. I’d like to inform the WP Editor developer about this in the hope that they’ll fix it. What exactly do I need to tell them? Is it a simple matter of them updating their CodeMirror library to version 3? Is it always necessary for them to use the exact same version of CodeMirror that you are using? Or is there anything else they can do to avoid this conflict in the future?

    (It would seem troublesome to me, if you might update your CodeMirror library to some newer minor version, and then it would clash again with the other plugin – or vice versa).

    Thanks for helping!

    CodeMirror also just released a new version 🙂

    Plugin Author Shea Bunge


    I know 🙂 I subscribe to the CodeMirror update list, and usually try to update the version bundled with Code Snippets as soon as possible on GitHub, and then include the updated version in the next release.

    I’ve been a bit behind on things lately, however I will try and fix the CodeMirror incompatibility issues as soon as I can. I asked about this on the general CodeMirror mailing list, and received a suggestion that I will try out.

    Shea, are you saying that I won’t need to let the developer of the WP Editor plugin know about this issue, because you’re going to provide a fix somehow yourself?

    Or if I do need to let the WP Editor dev know, then can you please give me a tip on what exactly I should tell him?


    Plugin Author Shea Bunge


    I don’t really have a definite answer for that question yet. I’m going to try to isolate the Code Snippets CodeMirror instance from other CodeMirror instances, and see if that resolves the issue.

    While asking the WP Editor dev to fix his plugin is a good idea, the problem is that many other plugins use CodeMirror – Debug Bar Console is another example. It’s not really possible to ask all of these developers to upgrade their CodeMirror version (some plugins have been abandoned) or put a work around for the specific plugin in Code Snippets (such as removing the old CodeMirror version).

    It’s better to find a fix that is not so specific. If that fails, then yes, asking the WP Editor dev to upgrade CodeMirror would be the next best solution.

    Okay. I’ll hold off contacting the WP Editor dev then, until you can try and resolve it from your side.

    I hope you can keep us updated in this thread! 🙂


    Hi Shea, just wondering if you’d had any luck with this? I’d like to get this resolved so I can re-enable the WP Editor plugin again alongside Code Snippets! 🙂

    Plugin Author Shea Bunge


    Sorry but I’ve not been having much luck with a Javascript-based solution of isolating the CodeMirror instance. I’m sure that it’s possible, but I am not nearly as good with JS as PHP.

    The other two options are either asking the WP Editor dev to upgrade their CodeMirror instance, or to add a workaround to Code Snippets which prevents WP Editor from loading on the Edit Snippet page.

    Okay I’ve contacted the WP Editor dev to get his input on this….

    Plugin Author Shea Bunge


    Code Snippets 1.9 has just been released and should fix this problem.

    Indeed it is fixed – thanks!! 🙂

Viewing 13 replies - 1 through 13 (of 13 total)
  • The topic ‘'Edit Snippet' page layout messed up’ is closed to new replies.