Make Your Own Google Talk Theme

Google talk uses an Jabber protocol, a free open source protocol for communication. Since its open source, all its services are free and customizable. You can even view the code and API provided by Google.

In this tutorial, I will tell you to make your own custom theme for Google Talk. If you aren’t interested in creating your own theme then you can get unofficial themes from http://www.sravi.com/gtheme/download.html and from http://www.googletalkthemes.com.

Let us start with the Gtalk appearance customization:

1) Searching for Google Talk themes:

%userprofile%\Local Settings\Application Data\Google\Google Talk\themes\system\chat

Copy and paste the above location in the My Computer address bar.
Press Enter and you will see the default location for themes.

2) Create a new folder and name it gtricks.

3) Let us choose theme ClassicPicture because of its simplicity. Go inside the folder ClassicPicture and you will find another folder named Contents. Copy it.

4) Navigate back to gtricks folder. Paste the Contents folder inside gtricks folder.

5) You will discover folder named Resources inside Contents. And inside Resources you will find few more files like main.css, status.html and others.

So your file structure should look like this :

….Google\Google Talk\themes\system\chat\gtricks\Contents\Resources

Next is providing your own background image:

6) Choose a image of size 300×250 which will act as theme background.
(Preferably a lighter color image). Name it aery.jpg .

7) Create a folder inside Resources folder and name it Images.

8) Put image Aery.jpg inside the folder Images.

So resultant cutomized backgroung will be
gtricks -> Contents -> Resources -> Images -> Aery.jpg

9) Navigate back to Resources folder and you will find main.css which specifies the style of theme.

10) Double click to open it and try to locate this code:

BODY {
margin: 6px;
}

11) Add background-image: url(“Images/Aery.jpg”); to above BODY class.

now it should look like :

BODY
{
margin: 6px;
background-image: url(“Images/Aery.jpg”);
}

Save it.

12) You are done for the first part. Close Gtalk from the system tray and restart. Go to settings and them appearance to select theme.

If you are familiar with CSS then you can continue editing main.css to modify fonts, colors, text alignments etc.

Here are the file descriptions that might help you :

main.css : This is the main CSS sheet in which you specify the class of styles as you do for HTML.

NextStatus.html : When you chat to someone, their changes in status will use the format specified in this file.

Status.html : When you chat to someone, their status will use the format specified in this file.

Incoming \ Content.html : When you chat to someone, their first reply will use the format specified in this file.

Incoming \ NextContent.html : When you chat to someone, their subsequent replies will use the format specified in this file.

Outgoing \ Content.html : When you chat to someone, your first message will use the format specified in this file.

Outgoing \ NextContent.html : When you chat to someone, your subsequent messages will use the format specified in this file.