Once you have downloaded and installed Firebug to Mozilla browser, its time to see how it works. Below is stepwise instructions showing how you can replace Google logo using Firebug addon for Mozilla Firefox with just a minor alteration in the DHTML coding.
- Once we are on Google.com, right click to see ‘Inspect Element’.
- Click on ‘Inspect Element’ to see a bar popping up. This is Firebug editor where we make changes that would be visible on the webpage. Here is how Firebug looks like,
- We will now replace the Google logo with yourRavi logo. For this we require location of yourRavi logo to put in place Google logo’s location.
- Once we have copied the URL of yourRavi logo its time to replace Google logo using Firebug. Click on ‘background’ property of stylesheet file and paste URL of yourRavi logo in place of ‘images/srpr/logo3w.png’.
- After adding the code, click on the webpage and voila! we’ll get,
- You can see Google logo replaced by yourRavi logo using Firebug Mozilla extension. However, this change is only temporary but it’s enough for web developers to extract an idea and fun for novice like your and me.