HOWTO enable additional TinyMCE (Note editor) functionality

HOWTO enable additional TinyMCE (Note editor) functionality

This documents how to hack the zotero firefox plugin to enable additional functionality in the Notes editor. The editor is a product called TinyMCE, which has been incorporated into Zotero. I'll show how to turn on two functions: search/replace and paste plain text. It should work for other functions built-in to TinyMCE but not implemented by Zotero, with the notable exception of spellcheck (see misc. notes at end).

For a more general introduction to what we're doing here please read Modifying Zotero Files.

WARNING: this is a moderately technical operation and runs the risk of causing harm, destroying data, and as they say in motorcycle manuals, serious injury or DEATH! If you don't understand these instructions you probably shouldn't try this. Also recommended: read through the instructions completely before doing anything.

NOTE: you have to do this every time zotero is updated, a bit of a pain.

In the instructions below, [profile] is the path to the firefox profile directory where you have installed zotero. I run Linux, so the firefox settings are in

I've installed zotero to my default profile, so the profile directory is something like

If you don't know about firefox profiles you probably shouldn't be doing this.

> STEP 1------------------------------------------

Find the zotero.jar file:

Back it up by copying to zotero.jar.unmodified or other name of your choosing.

Unzip the zotero.jar file. (You can do this anywhere but I'll assume you unzipped it right there under the chrome directory.)

In the unpacked code, the TinyMCE code is under this directory

Look at the top of this file

to confirm which version of TinyMCE is being used. At the top of the file you'll see text like this.

var tinymce = {
majorVersion : '3',
minorVersion : '2.5',
releaseDate : '2009-06-29',

Fairly obvious: here zotero is using TinyMCE version 3.2.5

> STEP 2------------------------------------------

Download the full TinyMCE distribution from this url

NOTE this is usually NOT the current, most recent release. Find the precise version (as identified in the previous step - in this example, version 3.2.5) in the list of distributions. You want the normal distro, file name tinymce_[version].zip - not the "dev" or other versions.

Unpack the TinyMCE distro. All the code will be under a directory named tinymce. The javascript files we're interested in are under the directory .../tinymce/jscripts/tiny_mce

> STEP 3------------------------------------------

KEY STEP - copy additional TinyMCE modules into the zotero code that we unpacked from zotero.jar. What we want to do is copy the entire TinyMCE distro into zotero's code *without* overwriting existing code. This is because the TinyMCE code in zotero contains modifications that we must preserve.

In a *nix-like shell use a command in this form

cp -ru [TinyMCE]/tinymce/jscripts/tiny_mce/* [target]

[TinyMCE] = directory where you unpacked the TinyMCE distro
[target] = location of TinyMCE code in the unpacked zotero.jar code

assuming you unpacked zotero.jar in your profile directory, [target] will be

* optionally: You can do this with a GUI file manager, as long as you understand conceptually what we're doing. But I won't provide instructions for that.

> STEP 4------------------------------------------

Now you can modify the TinyMCE code to provide more built-in functionality. Here I'll just enable (1) search/replace and (2) paste without formatting.

This requires two modifications to note editor code in the file

first mod: tell TinyMCE which plugins to use. In the tinyMCE.init() method, look for the line

plugins : ...
Change this to reference the additional TinyMCE plugins you want to use (docs here). I only need to add the searchreplace plugin so now the line reads

plugins : "paste,contextmenu,searchreplace",
second mod: add buttons to toolbars. In the next few lines you should see lines beginning with

theme_advanced_buttons1 : ...
theme_advanced_buttons2 : ...

These define the note editor toolbars - basically names of the buttons separated by commas and vertical bars. For more details consult the TinyMCE documentation. To add the "paste plain text" button, insert "pastetext" . To add search and replace buttons, insert "search" and "replace" . The two lines end up like this for me:

theme_advanced_buttons1 : "pastetext,|,bold,italic,underline,strikethrough,|,sub,sup,|,forecolor,backcolor,|,blockquote,|,link,unlink",
theme_advanced_buttons2 : "search,replace,|,formatselect,|,justifyleft,justifycenter,justifyright,|,bullist,numlist,outdent,indent,|,removeformat,code",

In zotero 2.0b7.1 the first mod is to line 34, the second to lines 37 and 38. <-- <b>this may change in future versions

> STEP 5------------------------------------------

Rezip the zotero.jar file. (This can be done with a GUI tool but I won't describe that here.) From the directory where code was unzipped - [profile]/extensions/ - execute the command

zip -r0 zotero.jar *
There are various ways you can zip it up but the IMPORTANT thing is to check that your jar file has zipped the right part of the directory "tree". If you look inside the jar file, you should see the directories


not e.g. a directory named zotero - that means you zipped files starting from the wrong level of the tree. (Initially I screwed this up and it took a long time to figure out.)

Replace the original zotero.jar with the newly-created one. (If following the above procedure, move up to its parent directory.)

>----STEP 6----------------------------------

Restart firefox and you should have the new features.

Misc. Notes:

* If you have problems, back out your changes by simply restoring the original zotero.jar file and restarting Firefox.

* The paste-as-plaintext is pretty klugy. It pops up a window, you paste into the window, click Insert and the text is pasted in. Better than nothing.

* Unfortunately spellcheck can't be enabled this way. That's a somewhat complex issue, I'll post more about it later.

* Again, you have to do this every time zotero is updated.

* If you have additional information about specific plugins, corrections, or other useful info please post to this thread.
  • wow.. im not sure if i should try this, just found out about firefox profile yesterday and the code language is just a parallel world, that enables me to purse my daily symbolic activities with recognized signifieds, like in a video-game where you walk around, but the user is ignorant or care-free as to whether the pixelled house actually has water pipes.

    Ill wait until an zotero update, im hopeful the search-terms option will pop up one day, in a way i can integrate it to my knowledge as ready-to-hand
  • thanks any way for the tip

  • edited October 3, 2016
    would be awesome to get a plugin to customize it.
    We're missing the "remove all formatting" (included headings)

    And even better if the plugin could allow adding other basic shortcuts. (ctrl+u underline is great, but the basic crl+space "remove all formatting" would be super)

  • edited October 3, 2016
    On the subject of upgrading the notes editor I have documented my recent experiences here (including starting with reference to above 2009 thread).!topic/zotero-dev/nmtCLEb9zLA

    Note that unzipping and hacking zotero.jar in zotero is not deemed to be best practice. However it works fine for me just to prototype some changes, followed by a later full re-build.

    My conclusion is that upgrade of tinymce version does not appear to be on the agenda for Zotero 5.0.

    However with minimum changes to /resource/tinymce/note.html a "sandbox" can be created so that content from textarea in tinymce 3.5.7 (the default version) is passed to TinyMCE 4.4.3 through the DOM.

    You can then develop and add your own plugins to TinyMCE 4.4.3.

    My own interest is adding more granular annotation to extracted annotations from ZotFile.

    @Vialo, I have tested "remove formatting" feature in the popup TinyMCE 4.4.3 I have introduced into my Zotero stand alone and it works as expected.
Sign In or Register to comment.