My Blog

Dynamic RSS Feed

I made several little javascripts that allow users to display their Xbox Live gamercard and/or Playstation Network ID and/or Wii Friend Code in their profile field. (I don't have a Wii or PS3 so the images in the preview are examples of what it looks like)

Preview


First, go to your admin control panel.
Then, on the left side select Profile Fields
Now, for new field, select 1 line text and hit Submit
At the next screen, use the following settings:

Settings

Spoiler: click to toggle

XBOX LIVE GAMERCARD SETTINGS
Title: Xbox Live Gamertag
On Registration: Yes
Admin Only Edit: No
Show field in topics: Yes
Maximum input length: 100

Click Submit


PLAYSTATION NETWORK ID SETTINGS
Title: PlayStation Network ID
On Registration: Yes
Admin Only Edit: No
Show field in topics: Yes
Maximum input length: 100

Click Submit


WII FRIEND CODE SETTINGS
Title: Wii Friend Code
On Registration: Yes
Admin Only Edit: No
Show field in topics: Yes
Maximum input length: 100

Click Submit

Now, from the left side of your admin control panel, select Board Templates
Put the following code(s) in Javascripts

Javascript

Spoiler: click to toggle

XBOX LIVE GAMERCARD JAVASCRIPT

Code:

 


<script type="text/javascript">
//<![CDATA[
$(function () { var ddcalled = "Xbox Live Gamertag"; $("dl.user_profile > dt:contains("+ddcalled+") + dd").each(function () { var item = $(this).text(); $(this).html('<iframe src="http://gamercard.xbox.com/'+item+'.card" scrolling="no" frameBorder="0" height="140" width="204">'+item+'</iframe>');});});
//]]>
</script>


PlAYSTATION NETWORK ID JAVASCRIPT

Code:

 


<script type="text/javascript">
//<![CDATA[
$(function () { var ddcalled = "PlayStation Network ID"; $("dl.user_profile > dt:contains("+ddcalled+") + dd").each(function () { var item = $(this).text(); $(this).html('<img width="204" border="0" src="http://pid.us.playstation.com/user/'+item+'.jpg" class="psntag" />');});});
//]]>
</script>


WII FRIEND CODE JAVASCRIPT

Code:

 


<script type="text/javascript">
//<![CDATA[
$(function () { var ddcalled = "Wii Friend Code"; $("dl.user_profile > dt:contains("+ddcalled+") + dd").each(function () { var item = $(this).text(); $(this).html('<div id="wiitag_bg"><div id="wiitag_text">' + item + '</div></div>');});});
//]]>
</script>


IMPORTANT!!! //<![CDATA[ and /]]> must be on their own line!!!! If the entire code is on a single line, problems will occur.


Then click Edit Board Template located at the bottom.

CSS

Spoiler: click to toggle

At the Admin Control Panel, select Themes from the left.

Click on Edit theme Appearance

Find the following lines in your CSS and change them accordingly (Hint: use ctrl + F to find characters faster).








Add the following line:


Add the following lines for the Wii Friend Code
#wiitag_bg {
background:url(http://209.85.62.24/132/33/0/f123597/wiifriendcodebg.png) center no-repeat;
width:204px;
height:37px;
}

#wiitag_text {
padding:11px 10px 0px 0px;
color:#404040;
text-align:right;
font-weight:900;
font-size:9pt;
}

Click the Edit CSS button at the bottom and your done!

Remember: Capitalization and spacing matter!!

Also note: User just need to enter their username. They do not need to enter any code tags in the profile field.

If you have any problems with these codes, post your problems below or PM me. Include your board url so that I can take a look at your code.

Support for this code can be found here