How to Make a Message Theme in Adium
The online messenger Adium allows users to design how messages appear using CSS and HTML. Create basic style changes within a text editor using Adium's tutorial files. For ideas on how to create your message style theme, go to the Adium Xtras website to see customization options. Using new fonts, colors and customized background images, you create the personal message style for your Adium library.
Other People Are Reading
Instructions
-
-
1
Open a text editor to work with HTML code, such as TextEdit or Notepad.
-
2
Download "2torial.AdiumMessageStyle.zip" from Adium's website. This is the base message style that you modify to create your own. Double-click to install into Adium's library directory at "~/Library/Application/Support/Adium 2.0/Mesage Styles/."
-
-
3
Click "File" in your text editor and click "Open." Navigate to the directory within your message style, which looks like "Adium Message Style/Contents/Resources." Within the "Resources" folder, find "main.css" and double-click to open.
-
4
Edit each section of the CSS file "main.css" to create your own message style. The sections define different parts of the message style, including the header, incoming and outgoing messages, text and icon images. Experiment with different fonts and colors by changing the definitions.
-
5
Create a background image. It fills and repeats in the message window. A typical image may be light gray stripes or another light pattern that allows text to show. Save the image as a JPEG. Move to the "Images" folder in your "Resources" folder.
-
6
Add the background image to the HTML document by looking for the "background: (url)" string. Rename the URL for the background to your specific background image's file directory. For example, for a background image named "NewAdiumBackground.jpg," enter the following:
("images/NewAdiumBackground.jpg") repeat-x top left ;
You define the directory where Adium must find the background image, then show how the background must fill the space by positioning on the x-axis in the top left corner.
-
7
Save your CSS file before loading Adium.
-
1
Tips & Warnings
You can create several different backgrounds for each part of your style. Experiment with different background images and look at other user-created styles to see how to use background images in advanced styles.
