Custom Site Theme for SharePoint 2007 (MOSS 2007) and WSS 3.0

The easiest and the fastest way to apply the same look and feel on any SharePoint site is creating a site theme. A SharePoint site theme basically consists of theme.inf, theme.css, and image files. Theme.inf file simply represents the title of the theme. Theme.css is a stylesheet file that defines colors, header images and layouts of a site and image files can be referenced here to display on the page. By creating a custom site theme, you can easily change the style but in fact, writing and editing the stylesheet can be somewhat chanllenging when you have more than a hundred of elements to deal with.

Here is a short procedure of creating a custom site theme named "India":
1. Copy any theme folder in "C:\Program Files\Common Files\Microsoft Shared\web server extensions\12\TEMPLATE\THEMES" folder and paste with its name replaced with "India". In this example, copy GRANITE folder.
2. In India folder, rename GRANITE.INF file to INDIA.INF in upper case.
3. Open INDIA.INF file with notepad.
4. Change the value of title under [Info] to India.
5. Replace every word, Granite, under [titles] with India.
6. Open "C:\Program Files\Common Files\Microsoft Shared\web server extensions\12\TEMPLATE\LAYOUTS\1033\SPTHEMES.XML" file with notepad.
7. Add the following lines under tag:
Templates>
TemplateID>India
DisplayName>India
Description>We love India .
Thumbnail>images/India.gif
Preview>images/India.gif
/Templates>

Notice that preview and thumbnail paths are images/India.gif. By default, MOSS 2007 and WSS 3.0 will not have such image files.

8. In order to display thumbnail and preview correctly, you will need to capture the screen and save the file in "C:\Program Files\Common Files\Microsoft Shared\web server extensions\12\TEMPLATE\IMAGES" folder with India.gif name. You can change the .gif file name if you change the thumbnail and preview file names in tag.

9. Do an iisrest for the server to recognize the new theme.

Pretty simple procedure. Now you are ready to test your new theme. In Site Settings, you can now choose India theme; however, the theme will not differ from Base theme. Now, it is time for you to play with theme.css file!