javascriptfirefoxfirefox-addonfirefox-addon-sdkjpm

How to create a "Settings" menu in a Firefox Addon?


I'm using jpm/Addon Sdk to create a Firefox addon. My basic addon is ready but I want to have a "Settings" menu where users can select their preferences.

Can anyone guide me on how to go about it?

Thanks.


Solution

  • You can set this preferences in the package.json:

    {
      ...
      "preferences": [
         {
            "title": "What's your favorite color?",
            "name":  "someColorPreference",
            "type":  "color",
            "value": "#333"
         }
      ]
    }
    

    This will add a component that user can select some color. There are other types of preferences too.

    Example

    Then, you can use simple-prefs module to read, write and listen for preference changes:

    let color = require('sdk/simple-prefs').prefs['someColorPreference'];
    console.log(color); // #333