|

Please feel free to download the plugin and use it as a reference for future implementations or other plugins, however do be aware the plugin is not supported by the latest wordpress versions or steam community. You may wish to look a this plugin instead.

Last night i started to make a widget to show off my Steam Community stats, think of it like the xbox live gamertag but for steam. I’ve used the Steam Community API V2.2 from Seirmubsa Theres a few different services out there, some are based on the same API i’m using, others i’m not sure. The best of these services so far is the SteamCard v2, this will produce a gamertag-esque image that you can then link to from wherever you want.

Unfortunately Steamcard doesn’t really offer what i want, as my blog is themed a specific way i wanted a more HTML/CSS based solution that would allow me and others, to style the information as we see fit.

So in short, after 1 nights work and some minor adjustments to the API, i present the Steam Community Widget v0.2a (Requires PHP 5).

Notes:

REQUIRES PHP 5

Your steam user id can be entered as either Alphanumerical (ie. ruxton), your 17-digit community id (found in the url to your profile, etc) or your steam id (ie. STEAM_0:1:12345) this latter id can be found by typing ‘status’ into the console in game.

The widget display is handled by a file in the directory called ‘scw_display.html’ if you’d like to adjust the display, copy this file into your theme directory and make the changes there.

Installation:

  1. Download plugin from here
  2. Unzip zip file into your /wp-content/plugins/ directory
  3. Ensure the ‘cache’ folder inside the plugin directory has write access
  4. Goto WordPress plugins section and activate ‘Steam Community Widget’
  5. Goto the Widgets section, add the widget to your sidebar and configure it as you wish

Styles

Below are the styles i’ve used in my theme for the widget, you can see these styles in effect on this blog.

/* My Steam Community Widget Stuff*/

.widget .scw-widget {
padding-top: 6px;
}

.scw-widget p {
text-align: center;
margin-top: -1px;
padding: 10px 3px;
border-top: 1px solid #999999;
border-bottom: 1px solid #999999;
background: #eeeeee;
}

.scw-widget a p:hover {
background: #353535;
color: #CCCCCC;
}

.scw-widget p img {
display: block;
margin: 0;
padding: 0;
margin-left: auto;
margin-right: auto;
}

Steam Community Widget V0.2a

Return to Parent Page

Syndication Links