Warhammer Server Status

This post will teach you how to add and style your own Warhammer ServerStatus box. Please note, that this script takes datafrom this web site: https://realmwar.warhammeronline.com/realmwar/ServerStatus.warand modifies it slightly so you can add your own styling to it. I don'tknow if writing this script is considered abusing their site, so bewarned this status may stop working at any time.

I now have mirror sites at motty.000space.com, motty.heliohost.org and motty.l4rge.com that will make this set up a lot easier.



The Code

The code below is made to go into a free form text/HTML content box on any page you want. You could also use an embedded page type of content box if you wish.

Copy (Ctrl-C) the code below and paste it (Ctrl-V), while in HTML mode, into a editor.

<center><iframe width="190" height="95" src="http://motty.heliohost.org/war/war.php?css=war.css&s=Phoenix+Throne&t=t&l=t" scrolling="no" frameborder="0" align="top" allowtransparency="true"/></center>

Customizing

Notes

• If you look at the code above you'll see it's just an iframe.
• Adjust the width and height of the frame by modifying the values in red.
• The URL is broken into several parts: the first green part is the base URL that should not change and the orange part is the URL to the CSS, the rest of the parameters will be explained below.
• The CSS I made is located in the same directory as the script, but if you want to modify and add your own styling for this status box you'll need to include the full URL to your CSS file.

The CSS

body, table {
 background: #222;
 color: #ddd;
 width: 200px;
 font-family: Tahoma, Verdana, Arial, sans-serif;
 font-size: 1em;
 margin: 0 auto;
}

/* Server status overall wrapper */
#server {
 background: #222;
 color: #ddd;
 width: 175px;
 margin: 0 auto;
 padding: 10px 0;
 text-align: center;
}

/* icon and server name group */
.group {
 margin: 0 auto;
}

.status {
 margin-left: -5px;
}

.name {
 font-size: 1.1em;
 font-weight: bold;
 padding-left: 5px;
}

/* server type */
.type {
 color: #888;
}

/* server location */
.location {
 color: #aaa;
}

/* server status icons */
.up {
 background: url(http://i201.photobucket.com/albums/aa236/Mottie1/testsite/icons/wh-server-online.gif) center center no-repeat;
 height: 24px;
 padding-left: 24px;
}

.down {
 background: url(http://i201.photobucket.com/albums/aa236/Mottie1/testsite/icons/wh-server-offline.gif) center center no-repeat;
 height: 24px;
 padding-left: 24px;
}

/* last cache info */
.lastcache {
 color: #777;
 font-size: .55em;
 margin: 0 auto;
 text-align: center;
}

• Copy (Ctrl-C) the above CSS and paste it (Ctrl-V) into your non-rich text editor
• Modify the background color and text color to match your site.... the #server class in the CSS contains all the data.
• I tried to label the CSS classes in the code above, if you are going to modify the CSS, I'd recommend saving the display page as you want it to your computer, then put the CSS file in the same location. That way you won't have to wait for the server reload everytime.
• For the status icons (up and down) and the flag icons, follow these directions:
  
  
  
  • The images are added as a background, so replace the URL in orange to point to your image.
  • Adjust the height to match the height of your image (in red)
  • Adjust the padding-left to match the width (in red, plus a little extra for padding) of your image.


• Once you have completed modifying the CSS file, save it to your computer as something like "war.css"
• Upload you CSS file to your file manager
• Modify the URL of the iframe code above to point to your newly uploaded CSS file:
  
  http://motty.heliohost.org/war/war.php?css=http://someURL.com/war.css
  
  
• There is also a second css file on the server you can try out that uses the current Warhammer server status icons:
  
  http://motty.heliohost.org/war/war.php?css=war2.css



Online	Offline

Parameters

You can specify what information to display by modifying the parameters of the URL:

http://motty.heliohost.org/war/war.php?css=war.css&s=Phoenix+Throne&t=t&l=t

• Server Name (&s=Phoenix+Throne)
  
  
  • The portion of the URL with the "&s=" is the server name parameter
  • Replace any spaces with a sign as in the example above.


• Server Type (&t=t)
  
  
  
  • The portion of the URL with the "&t=t" will show the servers type (Core, Roleplay or Open RvR).
  • The "t" stands for true, but you can set the parameter to anything to allow the display of the server type.
  
  
• Server Location (&l=t) - that's a lower case L.
  
  
  • The portion of the URL with the "&l=t" will show the server location (North America or Oceanic).
  • The "t" stands for true, but you can set the parameter to anything to allow the display of the server location.