CSS

CSS, or Cascading Style Sheets, determine the appearance of a website. This page uses two style sheets. First is main.css. This is the default theme, and can be used as a starting point for tweaks. The second is user.css. This file can be personalized to override any default setting.

Open two windows in your browser. One should be your Admin Panel, the second should be any page on your site. From the Admin Panel, you can upload a new user.css file, and then you can observe its effects by refreshing the other window.

Let's dive in with a few of the basics. CSS is a very big idea, and can be a little scary. Fonts and colors are simple to play with, so we'll start there.

Here's a list of common web colors. Maybe the default background color is not to your liking, but "BurlyWood" is. The background is set near the top of main.css:

main.css:

body {
  background: #DDDDDD;
  padding: 0px;
  margin: 0px;
  }

main.css uses the hexadecimal notation for colors, but either the hex code or the name will work fine. Open a text editor (such as Notepad, TextMate, or Vim) and create the following file:

user.css:

body {
  background: BurlyWood;
}

And save it as a text file. Next, upload the file through your Admin Panel. Refresh the page and the new color will appear.

If you see a cool effect on someone else's page, you can examine their user.css file and borrow part of it.