TIP 2: Learn to love firebug

Firebug, Firebug – Web Development Evolved, is an amazing tool that no novice or expert web developer should do without. Using this easy to install (as always) Firefox extension, will make editing your websites MUCH easier.

How it’s done
1. Follow the instructions to install Firebug. If you havn’t downloaded Mozilla Firefox you’ll need to to that first. After install restart your browser.

2. Find the element you want to change on your skin and Right Click on it. Select Inspect Element from the drop down menu.

3. In the example below I Inspected the website heading. Firebug dutifully opened a new window on the bottom of my browser, highlighted the element (Welcome) and showed me the style information at right.

You’ll notice that the first style information is h1.pas, and over to the right of that is the source of these instructions, Skin-CSS.css. If you’re experienced with the PAS CMS, you’ll recognize this instantly. This page is located in the root folder of your CMS and contains most of the style information for your entire website.

4. All the style properties you see at the right can be changed from your Skin CSS file. Just log in to your CMS, edit the Skin CSS file, use CTRL+F to search for “h1.pas,” then change the color, border font-weight etc.