free hit counters
If you are using Internet Explorer as your browser please be running at least IE 7 or above. This site does not support IE 6 or below. Go here for the latest free version including easy download and installation instructions If you want to make it real easy on yourself, download Firefox , the most popular browser in the world. It's free and simple. You'll be so glad you did.
Jan
16
2009

How to make changes to your custom.css file

Once you have your custom.css file open in your favorite text editor you can start customizing it to your liking. If you’re having problems finding your custom.css file read this tutorial. If you’re having problems extracting your custom.css file so you can edit it, check out this tutorial.

The very first time you open your custom.css file it should look like this…

1201

You can do one of two things. Read this and delete it or read it and keep it there. Deleting it isn’t going to effect the file at all. They’re just simply comments. If you want to leave it there just type all your new code before the opening comment bracket /* or after the closing bracket */

Once you get your file open in your text editor, the process of making changes is quite simple.  Any change you’re going to make you are going to type in the word “.custom” (dot custom) before any selector you want to make changes to.

For example, say in your custom.css file you want to change the H1 to whatever styling you like. You don’t necessarily have to find the H1 in the file. Instead, type this….

.custom H1 {whatever style you want here}

I prefer to always type in the new code instead of finding the existing code and adding .custom to it. This way you can preserve the original code itself.

You can do the same with classes and ID’s

If you have a class selector you want to change like this…

.sidebar a {  }

You can customize it like this…

.custom .sidebar a {  }

If you have an ID you want to change like this…

#custom_box {  }

You can customize it like this…

.custom #custom_box {  }

Leaving a comment with code in it...

If you would like to leave a comment and you have examples of code you want to show, you must "escape the code". This allows the entire code to show correctly by inserting certain variable around certain tags to make them show. If you don't "escape the code" your code will show up broken, mangled, and it won't be able to be seen correctly. "Escaping the code" is very simple...

  1. Copy your code you want to show
  2. Click here to go to the site to escape the code
  3. Follow the directions, it's so easy
  4. Once you have the escaped code copied, paste it in the comments area where you want
  5. Now you can enjoy life


Go ahead, leave a comment...

Leave a Comment

Previous post: Where to find your custom.css file

Next post: How to find your page or post id #