With the latest update of Firefox to version 10.0, they included some new developer tools which are similar to what is available via Firebug or WebKit’s developer tools. About time! Unfortunately, I still am so used to firebug that will continue using it instead of these new native development tools. One thing that really grinds my gears was the native “Inspect Element” context menu item because it lives directly above the Firebug one. This was extremely frustrating for me because I kept clicking on that instead of the “Inspect with Firebug” menu item. This would bring up the native inspector console, which I would then have to close, then go back and right click again and make sure I click on the inspect with firebug menu item. Sigh…..how annoying.
Anyway, there is a simple way to disable the native inspect element context menu item. In the Firefox address bar, put “about:config” and press Enter. This will bring up Firefox’s preference configurations. In the “filter” search box enter “inspector”. This will bring up three configuration preferences. Simply double click on the “devtools.inspector.enabled” preference to change it to “false” and viola! No more native inspect element in the context menu! Horray.
UPDATE:
A recent update to the firebug extension add’s config preferences for hiding the default inspector (thanks Ilya). Now when you filter your config preferences by searching for “inspector”, some new firebug config settings appear as well. Simply set “extensions.firebug.hideDefaultInspector” to “true” in addition to setting “devtools.inspector.enabled” to “false”.
Don’t muck around in here too much or you will mess up your firefox configuration. I hope someone finds this useful =)
Changed the screenshot =)
Great! Thanks a lot. I used to click the wrong context menu item every single time. 🙂
please can you help me how to disable inspect element option for my website…….
Thanks, this is really helpful 🙂
I could kiss you for this. Thanks! Frakking muscle memory. I was opening that useless native inspector all damned day.
Perfect, thank you very much! The native inspector blows goats, don’t know what they were thinking of when they added that but it’s a massive pita.
Perfect… countless times I clicked the native inspector when I switch from Chrome to Firefox.
Thanks for this great tip…
Yes – exactly what I was looking for. Thank you for saving me from the same frustration.
Just came to say THANKS for this! The inspect element in the context menu has been driving me nuts. I searched several times for the solution, gave up, but resumed the good fight because I was too annoyed not to. :p Your post did the trick. :p
I found that setting extensions.firebug.hideDefaultInspector to “true” worked by itself. Thanks for this post!
Whooo! It’s gone! I have no idea how many times I have clicked on the FF inspect element instead of firebug!
Thanks. I like firebug better and wanted to disable this. Much appreciated.
That’s what was needed!
Much appreciated!
Hi James,
First thing is: Firefox’s native inspector is awesome to me, but I never used firebug, personally, I just wanted to say, it seems more complicated to involve a third party in the mix when it can done through first party. . .which I think is a win.
BUT. . .Secondly, I want to know what’s going on with your background! what is it exactly? I figured I could just ask you instead of trudging through code trying to figure it out. I was mostly impressed at first because it doesn’t appear to be flash. . .then next, because you had a lil start/stop animation button on high, please. . .at least briefly, explain.
Firebug is invaluable to me. I have tried switching to chrome and cannot give up my old familiar firebug….but to each his own =)
The background is built using HTML5 canvas and javascript. You can see details on how its done here:
Polar Arc Animation Using Canvas and Prototype
Thanks, this worked!!!!!!
Thanks dude!
This made my days, Thanks !
I’ve been used to addon:
chrispederick.com/work/web-developer/webdev
and FX Developer always got in the way like a pain in the arm.
Now wasting hours of C&P + examining got needless.
Thanks again,
Franky
thank you. super helpful.
Thanks
Thanks very much for this
Thanks Alot for this. Just what i needed.
When Firefox displays an image, there is a big “q”-like symbol superimposed on it if the cursor is over the image. Apparently this is the Inspect button. How can I stop it showing up? I tried changing “devtools.inspector.enabled” to false but it made no difference.
I am not familiar with this “q” symbol you speak of…. sorry, can’t help =/ I would check extensions and turn them off one at a time until the symbol goes away…
thanks, i was running into the same thing you were, kinda messes up your flow when you see this big black inspector come up and get in your way when your trying to firebug.
Thanks a bunch! =)
Excellenté
Thank you!! That was driving me batshit 🙂
Saved my day mate 🙂