If you're upgrading this add-on, PLEASE, look at the bottom of this page for the upgrade notes and instructions
What Is This?
Adds a simple icon to link to a member's console specific profile. For example Playstation, Xbox Live, and Steam.
What does it look like?
Flowers and Butterflies! I'm just kidding. It's the basic logos. Here take a gander on my site or this image here
HOW HOW HOW?
[/INDENT]
---------------------
Upgrade from 1.1 to 1.2
1. Download the resource and upload to overwrite game_images/steamwidget.php
2. Go to message_user_info
3. Find
replace with
Upgrade from 1.0 to 1.1
For those updating from version 1.0 please delete the game_images folder and remove this from your message_user_info template before continuing
What Is This?
Adds a simple icon to link to a member's console specific profile. For example Playstation, Xbox Live, and Steam.
What does it look like?
Flowers and Butterflies! I'm just kidding. It's the basic logos. Here take a gander on my site or this image here
HOW HOW HOW?
1. a. Extract and upload the game_images folder to your forum directory.
1. b. You must create customer user fields for each one! I will demonstrate how to make one custom user field. You must replicate it and change the fields for the the console.
A. Admin Panel > Users > Custom User Fields > +Create New Field.
B. Fill out the following fields specified in the image below and then save.
C. Now Repeat this but replace Field ID, Title, and Description with Steam and PSN
Note: The Field ID is very important! Whatever you set that as must be called to from the code! You can put anything you want! I recommend just being general with this use of it and say 'xbox' 'PSN' and 'Steam' [case sensitive with the code provided below]
2. Now you must add the code where it needs to be placed!C. Admin panel > Appearance > Templates > Search: Message_User_Info and edit
D. Find
Code:
<xen:if is="@messageShowCustomFields AND {$user.customFields}">Add This Above it.
Code:
<div class="ConsoleContainer">
<xen:if is="{$user.customFields.psn_id}">
<a href="http://us.playstation.com/playstation/psn/visit/profiles/{$user.customFields.psn_id}" target="_new" class="OXYgames psn"/><span><img src="http://fp.profiles.us.playstation.com/playstation/psn/pid/{$user.customFields.psn_id}.png" onerror="this.style.display='none';"></span></a>
</xen:if>
<xen:if is="{$user.customFields.xboxid}">
<a href="http://live.xbox.com/en-US/Profile?Gamertag={$user.customFields.xboxid}" target="_new" class="OXYgames xbox"/><span><div class="xboxcontainer"><div class="left2"><embed src="http://gamercard.xbox.com/en-US/{$user.customFields.xboxid}.card" width="200px" height="135px"></div><div class="right2"><img src="http://avatar.xboxlive.com/avatar/{$user.customFields.xboxid}/avatar-body.png" width="68px" height="135px"></div></div></span></a>
</xen:if>
<xen:if is="{$user.customFields.SteamID}">
<a href="http://steamcommunity.com/id/{$user.customFields.SteamID}" target="_new" class="OXYgames steam"/><span><iframe src="/game_images/steamwidget.php?SteamID={$user.customFields.SteamID}" scrolling="no" frameborder="0" height="120" width="230">{$user.customFields.SteamID}</iframe></span></a>
</xen:if>
</div>Save!
3. Add the CSS to EXTRA.css
Paste at the top or bottom
Code:
/* XBL, PSN, Steam */
.OXYgames { height:28px;
background-image:url('/game_images/Game-Icons.png');
float:left; }
a.OXYgames span {display:none;
padding:2px 3px;
margin-left:5px;
margin-bottom: 150px;
width:268px; height:
135px;}
a.OXYgames:hover span{ display:inline;
position:absolute;
z-index: 10000;}
a.xbox span {display:none;
padding:2px 3px;
margin-left:5px;
margin-bottom: 150px;
width:268px; height:
135px;}
a.xbox:hover span{ display:inline;
position:absolute;
background: #3a3838;
color:#6c6c6c;
z-index: 10000;}
.ConsoleContainer {width:100%;
height: 28px;
overflow: hidden;}
.psn { width: 25px;
height: 25px;
background-position: -1px 0;
}
.xbox { width: 25px;
height: 25px;
background-position: -28px 0;
}
.steam { width: 25px;
height: 25px;
background-position: -56px 0;
}
.xboxcontainer {width:270px; overflow: hidden;}
.left2 { width: 75%; float: left;}
.right2 { width: 25%; float: right;}
/* END XBL, PSN, Steam */
Explained:
{$user.customFields.xbox}
I got the xbox text for the Field ID when I created the custom field. So whatever is in "Field ID" must replace the green text above in order to grab that specific data.
calls to the field that's been filled out by the user and prints/displays/shows it.
<xen:if is="{$user.customFields.xbox}">
Checks to see if the xbox user field is filled out.
So if we apply this to the end of a URL that requires a user id it'll link us to their profile 
Without this a the image will show up on everyone's profiles whether they entered their ID or not. This is no bueno (no good), so please be sure to include this in the code.
Explaining it again!
http://live.xbox.com/en-US/Profile?Gamertag={$user.customFields.xbox}
If I enter my (fake XBL) id as 0xy then the URL above will translate to to
My Experience
I'm a novice this was all done through observations from other code, searching, trial and error!
I know there's a better way to table the images. I will eventually use CSS for the whole thing but this is a rushed/simple explanation.
Disclaimer
I'm not responsible if something screws up!
Contributions and Donations
Save your monies!!! All I want is people to positively contribute towards this. Add anything you want to it or re-work the whole thing and make it your own. It's honestly not that difficult...
Support and Donations
I produced this as a free add-on (no point in charging since it's simple!). As a free add-on I can't dedicate my life to it, but that should not be the case in any situation since this is SIMPLE! I will help when and where I can but do not take offense if I do not reply promptly!
I've decided that if you are willing to contribute anything for my work. I ask that you visithttp://www.charitynavigator.org/ and donate whatever amount you were going to donate to me to a charity with a good rating there (4 stars).
---------------------
Upgrade from 1.1 to 1.2
1. Download the resource and upload to overwrite game_images/steamwidget.php
2. Go to message_user_info
3. Find
Code:
<xen:if is="{$user.customFields.SteamID}">
<a href="http://steamcommunity.com/id/{$user.customFields.SteamID}" target="_new" class="OXYgames steam"/><span><iframe src="/game_images/steamwidget.php?SteamID={$user.customFields.SteamID}" scrolling="no" frameborder="0" height="100" width="200">{$user.customFields.SteamID}</iframe></span></a>
</xen:if>replace with
Code:
<xen:if is="{$user.customFields.SteamID}">
<a href="http://steamcommunity.com/id/{$user.customFields.SteamID}" target="_new" class="OXYgames steam"/><span><iframe src="/game_images/steamwidget.php?SteamID={$user.customFields.SteamID}" scrolling="no" frameborder="0" height="120" width="230">{$user.customFields.SteamID}</iframe></span></a>
</xen:if>Upgrade from 1.0 to 1.1
For those updating from version 1.0 please delete the game_images folder and remove this from your message_user_info template before continuing
HTML:
<table><tr><td><xen:if is="{$user.customFields.PSN}"><a href="http://us.playstation.com/playstation/psn/visit/profiles/{$user.customFields.PSN}" target="_new"><img src="/game_images/PSN.png" width="25px" height="23px" /></a><br/></xen:if></td><td><xen:if is="{$user.customFields.xboxid}"><a href="http://live.xbox.com/en-US/Profile?Gamertag={$user.customFields.xboxid}" target="_new"/><img src="/game_images/XBL.png" width="25px" height="23px"></a></xen:if></td><td><xen:if is="{$user.customFields.Steam}"><a href="http://steamcommunity.com/id/{$user.customFields.Steam}" target="_new"/><img src="/game_images/steam.png" width="25px" height="23px"></a></xen:if></td></tr></table>
