How to compact the Firefox Add-ons Manager
Mozilla redesigned the add-ons manager of the organization's Firefox web browser in a recent update to the browser.
The update modernized the add-ons manager and replaced the traditional layout with a cards-based layout.
Update: Mozilla changed the layout of the add-ons manager with the release of Firefox 68. The CSS below won't work in Firefox 68 or newer. You can use custom CSS for Firefox (our guide), download here, instead which comes with options to modify the browser's add-ons manager. End
Mozilla did not remove any functionality from the add-ons manager in the process but individual add-on listings used more space than before so that fewer add-ons are displayed on the visible part of the page in the new version.
Firefox users who have a handful of add-ons installed in the browser may not mind, but those who have a dozen or more add-ons installed in the browser might.
The Add-ons Manager comes without options at this point to compact the listing to display more extensions at the same time.
Firefox users may modify the page using CSS, however. A user published a CSS style for the add-ons manager on Reddit recently that makes the listing more compact than before.
Here is a screenshot of how it looks like after the changes are applied to the browser:
As you can see, the modified compact version of the Add-ons Manager uses less than half of the space to display installed extensions than the default layout of Mozilla.
It is naturally possible to modify some values, e.g. make fonts a bit bigger or increase margins.
First though, the instructions on how to set it up this way.
- Download the archive that contains the code with a click on this link:Â (Download Removed) If the link does not work, check it out here on GitHub and download it from that site to the local system.
- Open the Firefox web browser.
- Type about:support.
- Click on the "open folder" button near the top to open the Profile folder on the local system.
- Check if a chrome subfolder exists.
- If it does not exist, create a new folder and name it chrome.
- Open the chrome folder.
- If a userContent.css file does not exist, place the one that you downloaded in the folder.
- If a file exists already with instructions, copy the content of the downloaded file instead and append it to the existing one using a plain text editor.
- Restart Firefox.
Open the Add-ons Manager on the next start. You should see that it displays in a compact layout instead of the default layout.
Now You: Do you use userContent.css to modify Firefox's appearance?Advertisement