Sign Up! Login: Password: New User? Forgot? Support
Top Mods!
Wowhead Search
by sonofsamedi
Digital Clock
by Wolfar15
Admin Forums
Welcome to the GuildPortal Help Community! These forums are for admin-to-admin help.
Available Forums
Forums : Pimp My Site! > Custom WoW Server Status (using XSL)
Mottie (MVP) 12/19/2008 3:35 AM EST : Custom WoW Server Status (using XSL)
GuildPortal MVP
Mottie
Posts: 3883
Zomgawsh Poster

How To Add A Custom WoW Server Status Box

NOTE: There is now a WoW Server Status Widget. If you want a more personalized server status widget, you can still use the code from this post.

Requirements

  • First off, this will only work on paid subscription sites!
  • If you have a free site and want to add a server status box, read this thread.
  • You will need to make the file below and host it on your GP site.
  • Note: if your subscription runs out, this code will stop working and you will get a message saying it won't work on free sites.

The CSS

.statusBox {
 background: url(http://i201.photobucket.com/albums/aa236/Mottie1/testsite/styles/status-alliance.png) top center no-repeat;
 color: #ffffff;
 height: 150px;
 padding-top:60px;
}
html>body .statusBox { height: 90px;}
.statusBox img { position: relative; top:5px; }
.serverUpColor { color: #ffffff; font-size: 16px; }
.serverDownColor { color: #bbbbbb; font-size: 16px; }

.pve { color: #00ff00; }
.pvp { color: #ff0000; }
.rp { color: #fff000; }
.rppvp { color: #ff8000; }

.lowload { color: #00ff00; font-size: 14px; vertical-align:center; }
.mediumload { color: #ff8000; font-size: 14px; vertical-align:center; }
.highload { color: #ff0000; font-size: 14px; vertical-align:center; }
.maxload { color: #ff00ff; font-size: 14px; vertical-align:center; }

The XML

<?xml version="1.0" encoding="UTF-8"?>
<xsl:stylesheet version="1.0" xmlns:xsl="http://www.w3.org/1999/XSL/Transform">
<xsl:output method="html" version="4.0" indent="yes"/>
<xsl:template match="/">
<div class="statusBox" align="center">
<xsl:for-each select="page/rs/r">

<xsl:if test="@n='Durotan'">

 <xsl:choose>
  <xsl:when test="@s=1">
   <b class="serverUpColor"><xsl:value-of select="@n"/></b>
  </xsl:when>
  <xsl:otherwise>
   <b class="serverDownColor"><xsl:value-of select="@n"/></b>
  </xsl:otherwise>
 </xsl:choose>
 <xsl:choose>
  <xsl:when test="@t=1"><span class="pve"> (PvE)</span></xsl:when>
  <xsl:when test="@t=2"><span class="pvp"> (PvP)</span></xsl:when>
  <xsl:when test="@t=3"><span class="rp"> (RP)</span></xsl:when>
  <xsl:when test="@t=4"><span class="rppvp"> {RPPvP)</span></xsl:when>
 </xsl:choose>
<br />
 <xsl:choose>
  <xsl:when test="@s=1">
   <img src="http://www.worldofwarcraft.com/shared/wow-com/images/icons/serverstatus/uparrow.gif" width="18" height="18"/>
  </xsl:when>
  <xsl:otherwise>
   <img src="http://www.worldofwarcraft.com/shared/wow-com/images/icons/serverstatus/downarrow.gif" width="18" height="18"/>
  </xsl:otherwise>
 </xsl:choose>
 <xsl:choose>
  <xsl:when test="@l=1"><span class="lowload"> Low</span></xsl:when>
  <xsl:when test="@l=2"><span class="mediumload"> Medium</span></xsl:when>
  <xsl:when test="@l=3"><span class="highload"> High</span></xsl:when>
  <xsl:when test="@l=4"><span class="maxload"> Max</span></xsl:when>
 </xsl:choose>
</xsl:if>
</xsl:for-each>
</div>
</xsl:template>
</xsl:stylesheet>

Installing & Customizing

  • CSS

    • Start by adding the CSS to your Custom StyleSheet or add it to a free form text/HTML box on the same page (but add a <style> to the top and </style> to the bottom)
    • Modify the CSS colors (in blue) to your liking.
    • Change the Status box size (in red) to fit your background image (in orange). The height in the ".statusBox" sets the height in IE. The height in "html>body .statusBox" sets the height in all other browsers.
    • The above CSS has the alliance background image, get the horde background image here.
    • If you don't want the server type or server load to display in the status, simply change the class in the CSS like this:

      .pvp { display:none; }

  • XML

    • Open your text editor (like Notepad) then copy (Ctrl-C) the XML above and paste (Ctrl-V) it into your editor.
    • Change your server name (in green). It is case sensitive!
    • If you want to change the up and/or down arrows in the server status, replace the URL (in orange). If you want to use text instead of an image, replace that entire line with something like this:

      <span style="color:#ffffff;">Up</span>

    • Save the file someplace on your computer where you can find it easily, name it something like "serverstatus.xsl"

  • Installing

    • Upload your xsl file to your site:

      Control Panel > File Manager > Upload File(s) > Browse > find your file

      Click "Upload File(s)"

      Copy this URL!

    • Add a new content box to the page you desire:

      Control Panel > Site Pages > (Home) > Add New

      Title: Server Status (or whatever you want)
      Type: XML/XSL Transformation
      Zone: (Pick one)

      Click "Add"

    • Now find your new content box and click "Edit"

    • A popup window will appear with "XML/XSL Transformation Editor" at the top.... add the following:

      XML Url: http://www.worldofwarcraft.com/realmstatus/status.xml
      XSL Url: Paste the link to your XSL file here.
      XSL Content: Leave blank... I haven't figured out how to get this to work yet, it would be better since you wouldn't have to save a file to your site.
      XSL Source: Select "Use XSL URL"

      Click "Save"
Enjoy!

Edit(4/9/2009): Added "server" in front of the serverUpColor and serverDownColor CSS classes... sorry I missed that.
Edit (2/23/2010): Removed references about hosting the xsl on some other site, it's now easier to upload it to your GP Files.
TopBottom

Mhaime (New Admin) 2/4/2009 4:11 AM EST : RE: Custom WoW Server Status (using XSL)
Mhaime
Posts: 49
Becoming Adept!

Mottie, I think I followed your instructions correctly, but the picture graphic of the horde banner is not showing up.

Please help! What did I do wrong?

Thank you very much for your time and assistance.
TopBottom

Mottie (MVP) 2/4/2009 8:14 AM EST : RE: Custom WoW Server Status (using XSL)
GuildPortal MVP
Mottie
Posts: 3883
Zomgawsh Poster

Hi Mhaime!

Could you please share a link to your site and to your XML so I could take a look?
TopBottom

kyloc (New Admin) 2/17/2009 9:26 AM EST : RE: Custom WoW Server Status (using XSL)
kyloc
Posts: 408
Fingers of Fury!

Very cool!  Added it to my site, Thanks!
TopBottom

Mhaime (New Admin) 2/22/2009 9:21 AM EST : RE: Custom WoW Server Status (using XSL)
Mhaime
Posts: 49
Becoming Adept!

Thank you for your time Mottie - sorry I missed your reply.

Our site is here, but I don't know how to link you to my XSL?
TopBottom

Mottie (MVP) 2/22/2009 9:53 AM EST : RE: Custom WoW Server Status (using XSL)
GuildPortal MVP
Mottie
Posts: 3883
Zomgawsh Poster

Hi Mhaime!

Your XSL is fine, I can see it working. What you are missing is the CSS. So you don't have to mess with the Custom StyleSheet, just add this CSS to your header:
<style type="text/css">
.statusBox {
 background: url(http://i201.photobucket.com/albums/aa236/Mottie1/testsite/styles/status-horde.png) top center no-repeat;
 color: #ffffff;
 height: 150px;
 padding-top:60px;
}
html>body .statusBox { height: 90px;}
.statusBox img { position: relative; top:5px; }
.upColor { color: #ffffff; font-size: 16px; }
.downColor { color: #bbbbbb; font-size: 16px; }

.pve { color: #00ff00; }
.pvp { color: #ff0000; }
.rp { color: #fff000; }
.rppvp { color: #ff8000; }

.lowload { color: #00ff00; font-size: 14px; vertical-align:center; }
.mediumload { color: #ff8000; font-size: 14px; vertical-align:center; }
.highload { color: #ff0000; font-size: 14px; vertical-align:center; }
.maxload { color: #ff00ff; font-size: 14px; vertical-align:center; }
</style>
TopBottom

Mhaime (New Admin) 2/23/2009 3:28 PM EST : RE: Custom WoW Server Status (using XSL)
Mhaime
Posts: 49
Becoming Adept!

Mottie said:

Your XSL is fine, I can see it working. What you are missing is the CSS. So you don't have to mess with the Custom StyleSheet, just add this CSS to your header.


Mottie again, thank you for your time.

I still don't have this right - by 'add this CSS to your header', do you mean:

Site Style --> Custom HTML --> Banner Area?

When I add it there and enable it, it works great! But then my banner image disappears. When I disable it, the banner is back, but the Horde shield is missing again.

I know I'm probably dense and doing something wrong!
TopBottom

Mottie (MVP) 2/23/2009 5:05 PM EST : RE: Custom WoW Server Status (using XSL)
GuildPortal MVP
Mottie
Posts: 3883
Zomgawsh Poster

Hi Mhaime!

Yes the Banner area (Control Panel > Style & Colors > Advanced Styles > Custom HTML > Site Banner Area.

If you look in the box above the banner area editor, you'll see:
$block[bannerimage] - Inserts the URL to an uploaded banner
Just include that code (in green) in the banner area and you should get your banner image back.
TopBottom

Mhaime (New Admin) 2/24/2009 11:06 AM EST : RE: Custom WoW Server Status (using XSL)
Mhaime
Posts: 49
Becoming Adept!

Mottie, you are the BEST.

I had to:

<center>
$block[bannerimage]
</center>

 . . to get it to center, and now it works perfect!

Thank you SO MUCH for your time, patience and knowledge!!!
TopBottom

Greboleus (New Admin) 2/26/2009 12:31 PM EST : RE: Custom WoW Server Status (using XSL)
Greboleus
Posts: 81
Posts With Wolves

i am having the same problem as the person above. whenever i use the server status box on my page, my header doesn't work. i tried using the above solution, but the header still did not show up and the alliance shield behind the server status disappeared. plz help!
TopBottom

Admins Online
There are   members online.
So-and-so has logged on!
%title%
%message%