Colourise Online Status

If you have ever thought that it might be better for Web Wiz Forum to show the online status in a colour then this page should help you solve that problem even if you have no programming experience.

This tutorial will take you through the steps needed to add colour to the online status part of the mini profile in forum posts.

There is only two file you need to change, the language file and the skin file. First of all open the language file titled '/forum/language_files/language_file_inc.asp' and go to line 701 and 750, you should see the below.

Line 701:

Const strTxtOnLine2 = "Online"

Line 750:

Const strTxtOffLine = "Offline"

We are simply going to add a CSS tag to each variable in the language file so that we can change the colour from the language file. Simply replace the two lines with the following.

Line 701:

Const strTxtOnLine2 = "<span class=""S2HMemberOnline"">Online</span>"

Line 750:

Const strTxtOffLine = "<span class=""S2HMemberOffline"">Offline</span>"

Now we are going to add some the CSS to the skin file so we can change the colour, if your using my Multiskin Selection modification then this will allow you to customise the look and feel of the online status to intergrate with your skin

Add the following code to the bottom of the CSS file named 'default_style.css' this is usually found in the '/css_styles/' folder.

Note: In Version 9 of Web Wiz Forum you will have multiple skin folders you will need to enter the code below into the skin you are using or each skins 'default_style.css' file if you are using my Multiskin Selection modification.

span.S2HMemberOnline { color: #008800; }
span.S2HMemberOffline { color: #880000; }

With CSS you can change colour of the status, make it bold, or what ever else you wish to do to make it stand out more or match your custom skin.

To change the colour simply edit the value in red, if you do not know HTML colour codes then you can instead use words for example "red" and "green" etc.

Written By: S2H, 20th September 2007

Share This Page

Advertisement