I am new to mozilla extension. Can anyone help me.Please tell me how to add button on
specific urls in mozilla extension.
Asked
Active
Viewed 240 times
-1

Just a student
- 10,560
- 2
- 41
- 69

mano
- 85
- 1
- 3
- 17
-
Add a button to the page DOM? – Filipe Silva Oct 09 '13 at 09:22
-
test if the url is "the one" ? - how to get url in JS: http://stackoverflow.com/questions/1034621/get-current-url-with-javascript – jave.web Oct 09 '13 at 09:48
-
yes i want to place button to web page e.g google page. – mano Oct 09 '13 at 09:49
-
please tell me that on every tab change url will be detected ?? – mano Oct 09 '13 at 09:52
-
In case of chrome extension content script runs on every page referesh but i dont know waht is the case with mozilla?? – mano Oct 09 '13 at 10:07
2 Answers
0
You can add an eventlistener to listen to every page load, validate if the current page is the one you want and then create the button and append it to where you want to:
window.addEventListener("DOMContentLoaded", function(e) {
// Validate if you are in the right page
if (gBrowser.currentURI.spec.indexOf("google.com") != -1) {
// Validate if you don't already have the button in the page
if (!document.getElementById("MyCustomButton")) {
//get a page element where you want to position your button
var place = gBrowser.contentDocument.getElementById("gbqfbwa");
if (place != undefined) {
var htmlns = "http://www.w3.org/1999/xhtml";
// create an html button
var button = document.createElementNS(htmlns,"button");
button.id = "MyCustomButton";
button.innerHTML = "Go there";
// Append it to the page
place.appendChild(button);
}
}
}
}, false);
This appends an icon to the right of the "I'm felling lucky" button.

Filipe Silva
- 21,189
- 5
- 53
- 68
-
you are right but javascrip file is not calling from .xul file i write this code to call my overlay.js file
-
yes i have place the code u gave inside overaly.js and give refrence of this file in .xul file but its not woring i dont know why :( – mano Oct 09 '13 at 11:35
-
It is working in mine. Check your error console to see what is happening outside this. – Filipe Silva Oct 09 '13 at 11:50
-
-
I just used the code i gave you in a blank extension. and it adds the button. You may want to check if you have all the basic parts of the extension working ok. See [the documentation](https://developer.mozilla.org/en-US/docs/Building_an_Extension) for any missing pieces. – Filipe Silva Oct 09 '13 at 12:25
-
-
That's a good start. Make sure you add this code outside of all the other functions. If you still can't make it work, add more code to your question to make it easier to find your problem. – Filipe Silva Oct 09 '13 at 12:53
-
can you tell me how we can get the page element id e.g if we want to place it to the left of Google search button then what id will we give. any tutorial for it? – mano Oct 09 '13 at 13:00
-
I have already see the documentation but going to see it again to determine whats going wrong – mano Oct 09 '13 at 13:03
-
It's this part `var place = gBrowser.contentDocument.getElementById("gbqfbwa");` You see the source code of the page and see inside what element you want to add it. – Filipe Silva Oct 09 '13 at 13:11
-
Filipe can you tell me one thing more.. please tell me that i have placed my extension folder path where i am developing this extension in C:\Users\Mona\AppData\Roaming\Mozilla\Firefox\Profiles\[ofr2][opt]rs0,[slws][slns]\extensions but mozilla is not detecting my extension automatically, every time i have to re install aplication whenever i make changes – mano Oct 09 '13 at 14:00
-
See [this](https://developer.mozilla.org/en-US/docs/Setting_up_extension_development_environment#Firefox_extension_proxy_file). you should read all of it to create a specific profile for development, but this part specially that teaches how to create a "proxy file". The address where you put the extension or the proxy file should be: %AppData%\Mozilla\Firefox\Profiles\
\extensions – Filipe Silva Oct 09 '13 at 14:05