How to develop a Zotero 7 plugin

I'm finding the documentation to develop Zotero plugins very lacking and quite outdated since Firefox extensions are no longer based on XUL, but instead are based on the Web Extensions API.

I read the following in the Zotero documentation:

"Zotero plugins run within the Zotero desktop app and are built on the same technologies as legacy (pre-WebExtension) Firefox extensions and interact with Zotero's internal JavaScript API."

So, I'm wondering if Zotero 7 plugins will be based on the Firefox Web Extensions API or if they will continue to be based on the legacy (pre-WebExtension) Firefox extensions.
  • We have extensive documentation on updating plugins for Zotero 7:

    https://www.zotero.org/support/dev/zotero_7_for_developers

    Zotero 7 plugins aren't based on the WebExtensions API in any way (which wouldn't make sense, since that pertains mostly to web browsing). They just use the WebExtension manifest.

    We'll be updating the plugin development page for Zotero 7 soon, but all the differences from Z6 plugin development are explained on the page linked above.
  • You may also want to search for `zotero plugin` on Github, where the source code of most plugins is hosted.

    Starting from existing plugins is easier for beginners. Many plugins have already finished the required update for running on Zotero 7.
  • Thank you, all!

    I'm sorry for the noob questions, but looking the following code for the Zotero Plugin Template (https://imgur.com/a/WDtaomD), what does a Zotero plugin developer end up having to create? Should I only be concerned with what is in the /src folder or do I also have to create what is in the /addon folder? What about the /scripts folder? Can we write the Zotero plugin in either Javascript or Typescript? Are there tools we should be using (for example to convert ts to js)?

    Is there a link with a simple example and step-by-step guide on how to create a Zotero 7 plugin? That would be really helpful!
  • edited June 27, 2023
    Hi @odebroqueville,

    1. `src` stores the source code (TS/JS) that will be executed during runtime. The src/examples.ts covers most of the frequently used functionalities plugins use. So just look into it and pick the ones that meet your need to assemble your first plugin.
    If you want to have a smart code structure, you could further put different modules to different files, the pdf translate plugin (https://github.com/windingwind/zotero-pdf-translate) could serve as a nice and clean example.

    2. `addon` stores the rest of the plugin, e.g. config file (manifest.json), locale files, UI files (xhtml), and resource files (images).

    3. `scripts` is unrelated to the plugin itself. The scripts there are just for running/building/releasing your plugin. Generally speaking, you don't need to touch them.

    The readme explains how to initialize the develop-env, how to build, how to debug, and how to publish your plugin: https://github.com/windingwind/zotero-plugin-template#quick-start-guide.

    > Can we write the Zotero plugin in either Javascript or Typescript?

    And yes, esbuild will convert all JS/TS into the bundled JS file, so both JS and TS are OK. But TS has type hint so it is recommended. Type hint helps you understand the APIs without looking into the source code of Zotero at the very beginning.

    > Are there tools we should be using (for example to convert ts to js)?

    We use esbuild, see scripts/build.mjs. Follow the steps in readme and you do not need to worry about that. Setting up the environment is easy.

    > Is there a link with a simple example and step-by-step guide on how to create a Zotero 7 plugin?

    Again, the readme. Follow the readme you can create a plugin with examples that can run on Zotero 7.

  • Hi @hsiangyu_wong,

    Thank you so much for taking the time to answer. Very kind of you.

    I actually wanted to help Li Fan ( @rabitai ) future proof his awesome Zotero AI Research Assistant plugin: https://github.com/lifan0127/ai-research-assistant
Sign In or Register to comment.