Subscribe to News FeedSubscribe to Comments

Browse > Home / WordPress Secrets / Viewing CSS and code in WordPress

Viewing CSS and code in WordPress

December 3, 2008 by deauxmain  
Filed under WordPress Secrets

Leave a comment

One of the best tools you can have if you’re using WordPress or any other web application is the Firebug add-on for Firefox.

Firebug integrates with Firefox to put a wealth of development tools at your fingertips while you browse. You can edit, debug, and monitor CSS, HTML, and JavaScript live in any web page. You can even edit CSS on anyone’s live site to see what it would look like in a different color….pretty cool. Below is what I did to the Facebook site using the Firebug tool.

Defacing Facebook - This is done using Firebug

Defacing Facebook - This is done using Firebug

I was able to change the color of the Facebook menubar using the Firebug tool. Now, keep in mind that you cannot save it on someone else’s site, but it is fun to play with. The main point that I want to make with this tool is that you can view HTML code, CSS, JavaScript, which makes this tool really helpful when debugging site errors. Below is the code I changed to make the menubar red on Facebook.

Viewing CSS and HTML using Firebug - (changed the background color to FF0000)

Viewing CSS and HTML using Firebug - (changed the background color to FF0000)

Let me know if you find this tool helpful.

Please spread the word by sharing this post with your friends. Thanks!
  • Digg
  • del.icio.us
  • Facebook
  • Google Bookmarks
  • E-mail this story to a friend!
  • LinkedIn
  • MySpace
  • Reddit
  • Technorati
  • TwitThis

No related posts.

Tags: , , , , , ,

Comments

6 Comments on "Viewing CSS and code in WordPress"

  1. rastaman on Mon, 8th Dec 2008 5:19 am 

    A good site! What is the name of u theme? I want the same)

  2. deauxmain on Mon, 8th Dec 2008 4:47 pm 

    This site uses a theme from RevolutionTwo.com The theme is called Revolution Lifestyle.Click here to view more details

  3. Judy Hutchins on Mon, 2nd Mar 2009 3:17 am 

    Thanks Deauxmain, I liked the theme and wanted to download it for another site.

  4. Sophie Wells on Mon, 18th Jul 2011 3:48 pm 

    I find the Firebug addon to be a great timesaver when it comes to trying out different colour schemes. No need to alter code, upload, refresh each time. Just a second to tweak it in Firebug and hey presto – instant change.

  5. deauxmain on Tue, 19th Jul 2011 4:34 am 

    I agree with you Sophie…there isn’t a day that goes by that I’m not using Firebug…the most used tool in my web design toolbox.

  6. Eric on Fri, 26th Aug 2011 2:49 pm 

    Deauxmain, thanks for sharing. Love Firebug. Take care.

    Eric

Tell us what you're thinking...
and oh, if you want a pic to show with your comment, go get a gravatar!