Firefox : addons, configuration and some tips

Introduction

Mozilla Firefox is a web browser developed by the Mozilla Foundation. It uses the Gecko rendering engine, the only serious competitor to the Google Chrome engine which powers most web browsers (including Google Chrome, Opera, Vivaldi, Brave Browser or the latest Microsoft Edge).

Unfortunately Firefox has been constantly losing marketshare to other browsers. According to radar.cloudflare.com, Firefox would only accounts for 6.40% of the total market share.

Yet Firefox has many strengths for those who want a modern, ethical and privacy-friendly browser.

In this post I present the essential addons I use, two very practical yet not widely used Firefox features as well as some configuration options I apply.

Extensions

Privacy / Security

• uBlock Origin (Source code)

  Excellent “adblock”, resource efficient and regularly updated. It is more precisely a content blocker, blocking both javascript scripts and images from lists.

  These lists can be maintained by uBlock contributors or come from external providers like Adguard or Fanboy.

  

  It’s also possible to enable the advanced mode to have an interface close to uMatrix (more advanced but more complex addon from the same developer as uBlock Origin)

• Cookie AutoDelete (Source code)

  Extension that automatically deletes cookies according to certain rules.

  Concerning my configuration, in addition to enabling automatic cleaning (option Enable automatic cleaning) I disable notifications (option Show notification after automatic cleaning unchecked), enable all Other options for cleaning browsing data and enable compatibility with the Multi-Account Containers extension (see below, option Enable support for Firefox contextual tabs). The rest of the settings remain unchanged from the defaults.

• Decentraleyes (Source code)

  Locally host various javascript files commonly found on websites, thus saving bandwidth. Files provided by Decentraleyes include Jquery, AngularJS or BackboneJS.

• HTTPS Everywhere (Source code)

  Project of the EFF, this extension forces the activation of the HTTPS protocol on supported sites.

  From Firefox 83, there is an option “HTTPS mode only “ in the Firefox settings to force the use of HTTPS on all sites. This does not make the HTTPS Everywhere extension obsolete, which will force HTTPS only on explicitly supported sites. Personally, I still use HTTPS Everywhere, I use a number of web services on my local network that remain in HTTP-only mode and that would ask for a confirmation at each access if I was using Firefox’s HTTPS-only mode.

Appearance

• Dark Background and Light Text (Source code)

  

  Extension that activates a dark theme on all sites based on CSS rules. May not work on all sites or even make some elements unreadable, but it usually works quite well.

  There is also Dark Reader, a similar extension that is more customizable but more resource-intensive.

Productivity

• Firefox Multi-Account Containers (Source code)

  Extension created by Mozilla allowing the creation of tab containers. Each container will be independent of each other and will contain its own cookies and data. It is possible to assign websites to containers so that a website’s cookies will only be active in this container.

  This extension works very well with the Cookie AutoDelete extension mentioned above. It is also possible to synchronize its containers and the list of websites to be opened in a specific container with the Firefox Sync function.

  I usually set the following containers :

  • Containers with automatic data deletion (no rule in Cookie AutoDelete) :
    • Online Shopping: e-commerce websites
    • Default: default container
  • Containers with saved data (rules for the concerned sites filled in Cookie AutoDelete) :
    • Personal: websites I visit regularly for which I want to save session data
    • Local: websites of my local network
    • Google: Google websites, mainly Youtube
    • Microsoft: Microsoft websites, mainly Outlook
    • Facebook: Facebook
    • Linkedin: Linkedin
    • Twitter: Twitter
    • Work: websites specific to my work (Google pro account, Slack, etc.)

  To open a tab with a specific container, just long click on the new tab button or do it via the widget of the extension. You can also open a link in a contextual tab by right-clicking and selecting Open link in a new contextual tab.

  The assignment of a website to a container can be done in the widget of the extension with the option Always open this site in…. It is also possible to add to the contextual menu (right click) of the bookmarks its opening in a contextual tab. This slightly obscure option can be found in Add-on modules manager > Firefox Multi-Account Containers > Preferences > Enable Bookmarks Menus.

  More information is available on the page dedicated to containers of the Mozilla help site.

• Imagus (Source code)

  

  Very practical extension allowing to maximize images and videos by simply passing the mouse over them. It is possible to resize the preview (z key when displaying images and then scroll wheel), to change its orientation (r key) or even navigate between images from an album (scroll wheel).

• KeePassXC-Browser (Source code)

  Companion addon to use with the password manager KeepassXC to enable password auto-completion. It is necessary to enable browser integration in the KeepassXC settings. It is also necessary to fill in the URL attribute when creating passwords.

  KeepassXC-browser can also automatically detect passwords when connecting to sites and add them to the associated database.

• Tree Style Tab (Source code)

  Tree Style Tab is an extension to display tabs as a tree from a vertical menu. The widget of the extension allows to activate the extension and its menu.

  Although it requires some time to adapt to its workflow, it greatly improves navigation when using a large number of tabs.

  It is also very configurable but the default settings are quite suitable.

• Vimium (Source code)

  Vimium is an extension that allows the use of keyboard shortcuts inspired by those of the vim text editor. By only knowing the basics, it is already possible to significantly increase your navigation speed.

  • j and k to move around the page (h and l to move left or right).
  • J and K to move from one tab to another.
  • H and L to move backward or forward.
  • gg and G to move to the top and bottom of a page respectively.
  • f to open a new tab from clues placed on all visible links (F to open in a new tab).

  

  • i to enter insertion mode and temporarily disable Vimium shortcuts (ESC to exit insertion mode).
  • t to open a new tab
  • x to close a tab, X to cancel the last tab exit.
  • ? to show a help page with available shortcuts.

  Alternatively you can also use Vim Vixen, Tridactyl, or Saka Key. They are all pretty similar.

• To Google Translate (Source code)

  Convenient extension allowing to add shortcuts to Google Translate by opening the context menu on a selection of text. Be aware that several extensions have the same name, I’m talking about the one developed by Juan Escobar.

Interface customization

One of the truly unique features of Firefox is the ability to deeply modify its interface. This feature is available in the Customize… menu available in the Firefox settings menu or by right-clicking on the URL bar or bookmarks bar.

Among the bars that make up the Firefox interface, all but the menu bar can be edited. It is possible to display or not the menu bar and the personal bar, the other two can’t be hidden.

Available interface elements can come from Firefox or installed extensions. Thus Firefox icons such as Settings, Home, Downloads or the icons of the extensions can be placed anywhere on the above mentioned bars. Some items such as tabs, the URL bar or navigation buttons cannot be removed but can be moved.

The Flexible Space element is the only element that serves only an aesthetic function: it is used to fill an empty space (by the way, the default Firefox layout uses this element on each side of the URL bar).

At the bottom left are options to add toolbars (menu bar, personal bar), change the theme (default, light, dark or afterglow) or change the density of the interface (from the smallest to the largest, compact, normal, touch).

Default configuration

4 possible themes

• Default (under Linux, depends on GTK theme)

  

• Dark

  

• Clear

  

• Afterglow

  

  If you want to go further, it is also possible to download themes from addons.mozilla.org and even easily create your own on color.firefox.com.

3 levels of density

• Compact

  

• Normal

  

• Tactile

  

My configuration

The configuration I use is made with the following options:

• Compact density
• Dark theme
• No menu bar, no personal bar

The elements of the personal bar (containing the bookmarks) are placed at the URL bar level, and the elements of the extensions are moved to the tab bar (when installing an extension they are automatically placed at the right of the URL bar).

A tip to have only the favicon of the bookmarks is to remove the title. Don’t forget that in order for the bookmarks to be in the personal bar items, you will have to select the personal bar folder when saving.

It is possible to go even further in customizing the Firefox interface by modifying the userChrome.css file (here the term Chrome is a reference to the shiny metal and not to the competitor browser, which, by the way, doesn’t allow such extensive modification of its interface). It is possible to see some examples of advanced configuration on the FirefoxCSS subreddit.

Keyword search engine

Another less known feature is the possibility to add search engines and add a keyword to them.

The easiest way to add a search engine to Firefox is to right click in any search field and select the option Add a keyword for this search.

You will then be asked to choose a keyword for this search, for example wiki. Once the engine is added, a search for wiki linux will automatically redirect to the search for the word “linux “ on this search engine.

This feature is equivalent to the bangs from DuckDuckGo or qwicks from Qwant (you need to prefix the search engine keyword with ! for ddg, and ! or & for qwant). The disadvantage of Firefox’s functionality compared to that built into DuckDuckGo or Qwant is the need to manually add each search engine. On the other hand, the search will be faster because the URLs will be resolved locally instead of being sent to a remote server, and you will have the choice of the keyword used for the search.

Internally, these search engines are just bookmarks, with slightly different attributes:

• the URL attribute contains %s which will be replaced by the search when it is used.
• the keyword attribute is filled in

It is even possible to go further by using this feature as a URL builder. Let’s take the example of Lastfm, a website allowing to record its listening history and offering statistics and associated recommendations.

A search for the Radiohead group on Lastfm is done via the URL https://www.last.fm/fr/search?q=radiohead. In this case, the search is unambiguous and the searched group is in first position in the list of results. Since we already know the name of the group, it would be faster to go directly to the artist page without going through the search page using the URL https://www.last.fm/fr/music/radiohead.

In the same way as before it is therefore possible to use shortcuts to directly reconstruct the artist’s URL. I personally use the keywords lfm and lfmd (d for direct) to respectively use the Lastfm search or to directly access an artist page.

• Lastfm search: when I am not sure of the artist’s name, or when his name contains special characters :
  • URL: https://www.last.fm/fr/search?q=%s
  • Keyword : lfm

• Direct Lastfm search: when I know the name of the artist and this name is simple :
  • URL : https://www.last.fm/fr/music/%s
  • Keyword : lfmd

Parameters

Here are the main settings I apply to in the Firefox options (page about:preferences). I use the Firefox Sync function to save and synchronize these settings.

General

• Downloads - Always ask where to save files

I enable this option because I prefer to systematically choose the location where I save the files I download rather than having everything saved in the Downloads folder.

• Use automatic scrolling - Enabled

Allows you to use the wheel click to scroll through a page.

• Use smooth scrolling - Off

By default, this setting is enabled, which makes the scrolling of pages “smooth”. This is useful if you are using a touchpad but makes navigation quite unpleasant when scrolling with the mouse wheel.

Privacy and security

• Strict protection

Firefox warns that some sites might not work well, but I personally have never had a problem.

• Don’t track me - Always

Systematically sends a signal DNT (Do Not Track) to websites. Paradoxically, this feature can help to track websites since relatively few users use this option. I activate it on principle.

• Identifiers and passwords - All unchecked

Used to disable the password manager built into Firefox.

user.js file

In addition to the options available in the Firefox settings, there are others that can only be accessed through the Firefox about:config page (more precisely, all Firefox settings are present on about:config even those presented above, but only some of them can be modified from about:preferences).

Although it is possible to change the options manually via this page, it is also possible to create a user.js file containing these parameters with the syntax user_pref(“key”, value). This file must be placed in the folder of the active firefox profile. Under Linux this folder should be in a location similar to ~/.mozilla/firefox/1234.default-release/. Once the file has been placed in the correct location, a restart of the browser will suffice to apply the new settings.

In the examples below, I have selected only the options that I thought were most important. You can find the complete my user.js file on github.

Tab behavior

• When a new tab is loaded, it will be added to the right of the current tab rather than at the end of the tab list.

    user_pref("browser.tabs.insertAfterCurrent", true);
  

• The Search option of the context menu will open a tab in the background.

    user_pref("browser.search.context.loadInBackground", true);
  

• When opening a favorite in the background (with the wheel click for example), it will open in the background.

    user_pref("browser.tabs.loadBookmarksInBackground", true);
  

• When opening a favorite contained in a folder in a new tab (with the wheel click for example), it will not close the folder.

    user_pref("browser.bookmarks.openInTabClosesMenu", false);
  

Interface

• Highlights all matches found during a search.

    user_pref("findbar.highlightAll", true);
  

• Shows full urls (does not hide http/https prefixes).

    user_pref("browser.urlbar.trimURLS", false);
  

• When switching to full screen, do not hide the interface bars.

    user_pref("browser.fullscreen.autohide", false);
  

• When switching to full screen, does not display the warning message.

    user_pref("full-screen-api.warning.timeout", 0);
  

• A double click in the URL bar will select the words of the URL and not the whole line (which will be selected with 3 clicks with this option enabled).

    user_pref("browser.urlbar.doubleClickSelectsAll", false);
  

Privacy / Security

• Disables automatic form filling.

    user_pref("browser.formfill.enable", false);
  

• Stop websites from reloading pages automatically.

    user_pref("accessibility.blockautorefresh", true);
  

• Block websites from accessing or modifying clipboard content.

    user_pref("dom.event.clipboardevents.enabled", false);
  

• Protects against fingerprinting (more information here).

    user_pref("privacy.resistFingerprinting", true);
  

• Isolates cookies to their primary domain and disables third-party cookies. These options may have undesirable effects on some websites but I personally never encountered any issue.

    user_pref("privacy.firstparty.isolate", true);
    user_pref("privacy.firstparty.isolate.restrict_opener_access", true);
    user_pref("network.cookie.cookieBehavior", 1);
  

• Force the display of non-latin unicode characters in URLs. These can be used by malicious domain names to disguise themselves as legitimate websites (more information here).

    user_pref("network.IDN_show_punycode", true);
  

Have a comment? React on Mastodon!