How can I add extra elements?

• fx-autoconfig

  101 147 8.1 JavaScript

  Load custom javascript in browser context

I would recommend using fx-autoconfig since it includes both a manifest file (that you can use to replace source code) and a bunch of utility functions. that way you don't have to waste time reinventing the wheel. so you can just say let myNewMenuitem = _ucUtils.createElement(document, "menuitem", {id: "some-new-id", label: "Reload", accesskey: "R"}) and document.querySelector("#vanilla-menuitem").after(myNewMenuitem)

• firefox-scripts

  131 904 1.6 JavaScript

  userChromeJS / autoconfig.js and extensions

That being said, there exist a few "loader" scripts that basically create some boilerplate code that make injecting your own js files easier. Here's one example and here's another. It's should be relatively straightforward to add items to context menu, but adding things to newtab page or any content page for that matter is probably much more complicated.

• SurveyJS

  surveyjs.io sponsored

  Open-Source JSON Form Builder to Create Dynamic Forms Right in Your App. With SurveyJS form UI libraries, you can build and style forms in a fully-integrated drag & drop form builder, render them in your JS app, and store form submission data in any backend, inc. PHP, ASP.NET Core, and Node.js.

  

• uc.css.js

  215 302 8.1 JavaScript

  A dark indigo CSS theme for Firefox and a large collection of privileged scripts to add new buttons, menus, and behaviors and eliminate nuisances. The theme is similar to other userChrome stylesheets, but it's intended for use with an autoconfig loader like fx-autoconfig, since it uses JavaScript to implement its more functional features.

a better way is to use firefox's own utilities to override a document in real-time. you can do this with the component registrar, and there are lots of examples of that on my repo, but I wouldn't recommend trying it with something like browser.xhtml. if you look in the utils/chrome.manifest file you can see how many files I've replaced. most of them are icons (for purely visual changes) but you can see I change the source code for the tab element that way: override chrome://browser/content/tabbrowser-tab.js ../resources/script-override/tabMods.uc.js that is done in order to bring back the old tab sound button, move the tab close button, and change how tab tooltips work.

• archived-content

  4 56 1.2 HTML

  Discontinued Archived MDN Web Docs content that is not actively maintained or frequently built

  

it's archived on here but the pictures are missing so it's just... fucked honestly. I am so frustrated and aggravated by this. it makes it that much harder for someone to pick this up as a hobby, which makes it that much harder for firefox to find new contributors. anyway, frame scripts are a bit annoying to use. but since about:newtab is a firefox system page (it has a system principal), addons can't inject anything into it either. so you couldn't use greasemonkey or something.

Suggest a related project