Firefox XUL: Auto loading toolbar button

1
votes

I'm fairly new to JS and XUL so please bear with me if this is a noob query :-)

I am developing an extension for firefox which performs a custom action when a toolbar button (created by me) is clicked. I have been able to create the button using mozilla examples but what I have seen is that even when the extension is installed successfully (and I restart firefox to complete the changes) the button needs to be added manually to the toolbar. After this it can be used as required and even on subsequent launches of FF it stays in the toolbar.

I wanted to know if there is a way by which the button will be auto-loaded when the extension is successfully installed. My XUL script looks like so: 

<?xml version="1.0" encoding="UTF-8"?>
<?xml-stylesheet type="text/css"
  href="chrome://custombutton/content/button.css"?>

<!DOCTYPE overlay >
<overlay id="custombutton-overlay"
  xmlns="http://www.mozilla.org/keymaster/gatekeeper/there.is.only.xul">

<script type="application/javascript"
  src="chrome://custombutton/content/button.js"/>

<!-- Firefox -->
<toolbarpalette id="BrowserToolbarPalette">
  <toolbarbutton id="custom-button-1"/>
  </toolbarpalette>

<!-- button details -->
<toolbarbutton id="custom-button-1"
  label="Custom"
  tooltiptext="My custom toolbar button"
  oncommand="CustomButton[1]()"
  class="toolbarbutton-1 chromeclass-toolbar-additional custombutton"
  />

</overlay>
2
firefoxfirefox-addonxul
I am also facing a same problem – Sourabh
I have a feeling we're all reading the same insufficient page on MDN. I'll see if I can update it once I get this figured out. Being new to these extensions and trying to create a simple button is rather terribly documented. – mlissner

2 Answers

1
votes

You'll need to write some javascript code to accomplish that: Adding button by default. Take a look at Adding toolbar buttons to existing toolbars too.

0
votes

Use the insertItem function: https://developer.mozilla.org/en/XUL/Method/insertItem You may 1. locate your container, such as the Navigation bar. 2. locate the target item to be inserted before or after. 3. insert your botton. 4. make it persist.

var nbar = document.getElementById("nav-bar");    
var target = document.getElementById("urlbar-container");    
var elem = nbar.firstChild;    
while (elem) {    
if (elem == target) {    
     break;    
}    
elem = elem.nextSibling;    
}    
nbar.insertItem("your-button-id", elem, null, false);    
document.persist("nav-bar", "currentset");