Advanced Configuration of the AI Chatbot in Firefox

[plwt]

As a contributor to Mozilla I've been fortunate to have a sneak peek into some of the AI features that are coming to Firefox very soon. I appreciate that AI is something that may make people concerned and I do share and appreciate some of those concerns myself - it can make people's lives easier, but it does have an environmental cost.  I hope in this article to demonstrate how you can make AI more useful for you if you wish to use it.

To help me to understand the AI integration into Firefox better, I thought I would build something for myself with it. The first thing to say is that this does involve changing some settings in about:config (enter this in the address bar to access the preferences).  I would not normally recommend this but hopefully by following this guide very carefully you will be able make some changes that you can iterate on in the future.

The two preferences that we need to look at are:

browser.ml.chat.provider

Set this to be the web based LLM that you wish to use. I want to use Perplexity, an open web based LLM that I do not need to register for in my locale, so I set the URL as:

https://perplexity.ai/

I then want to add a custom prompt, so I add a new preference:

browser.ml.chat.prompts.code

Firefox already has prompts that are numbered so I added this one with a one word descriptive title - you can use whatever word or term you wish.

Set this as a string preference.  This will be an additional custom prompt that you want to apply to selected text and is accessible from the context menu. I want to be able to understand code snippets from public repos, so I have set this to be:

{"label":"Explain code","value":"Please explain what this code is designed to do."}

Alternatively, I could have entered this as:

Please explain what this code is designed to do.

This second approach would put the whole prompt in the context menu, so I am going to use the first method where the “label” is the option in the context menu and the “value” is the prompt itself.  You can add multiple extra prompts as required for different tasks. This is where you can have a lot of fun thinking up and improving prompts to get the most from AI in Firefox.

With these both set, I close and restart Firefox. I can now navigate to code stored in an open web site, such as GitHub or Codeberg, select part of some code and ask Firefox to explain it to me.

Now this is a very straightforward example but think of the potential and what you could do with it. I have used a code related example, you could add a prompt to help writing a recipe from selected ingredients or providing travel planning that helps accommodate your preferences.  You do not need to use the two about:config prefs together - you can use the first one to add a different LLM and use the existing prompts.  Alternatively, you can add additional prompts for the LLM available in Firefox.

What I think is really magical about this is that I now have something that I have now built myself I can then use as and when I need to. What is really awesome for you is that you can now take this and potentially iterate on it and then come up with your own tools. One big ask is if you come up with any examples please share them within your tech community so that others may learn and build forwards from them.

I hope you enjoyed reading this post and find it useful.