Mini Mods - SteamProfile Integration

Description
Integrates SteamProfile badges into your forum. Allows forum users to see the current status of other members, including, adding them as Steam firends, viewing their profile, joining their current game and viewing their Team Fortress 2 backpack. The script accepts Steam IDs (ex STEAM_X:X:XXXXXXXX), Steam Community IDs (17 digit number) or Steam Community Aliases. I have included my vB4 skin as the default for the widget.

Example Of The Badges (Demo Coming Shortly)

Installation

1. Download attached "steamprofile_vb4_1.0.1.zip".
2. Expand and upload the "steamprofile" folder into your forum's root directory.
3. Go to AdminCP > Styles & Templates > Style Manager > Common Templates.
4. Add the following to a new line at the bottom of your "headinclude":
   

   <script type="text/javascript" src="steamprofile/jquery-1.3.2.min.js"></script>
   <script type="text/javascript" src="steamprofile/steamprofile.js"></script>

5. Save.
6. Go to AdminCP > User Profile Fields > Add New User Profile Field > Single-Line Text Box.
7. Enter in what ever title and description you want.
8. Optional To only accept Steam IDs add the following to "Regular Expression":
   

   STEAM_[0-9]:[0-9]:[0-9]{4,}

9. Change the "Display Page" option to "Options: Other".
10. Save.
11. Make note of the field number (ex field5).
12. Go to AdminCP > Styles & Templates > Style Manager > Edit Templates > Postbit Templates > postbit_legacy.
13. Find the following line:
    

    				<vb:if condition="$post['title'] OR $show['messageicon']">

14. Replace fieldX, in both locations, in the following line of code with your noted field number from above. Then add the code to a new line after the previous line:
    

    				<vb:if condition="$post['fieldX']"><div class="steamprofile" title="{vb:raw post.fieldX}" style="float: right;"></div></vb:if>

15. Save. Finished.

Additional Credits
Barracuda the author of SteamProfile.
drpepper of TF2Maps.net for his original vB 3.8.2 mod.

Upgrade Instructions (1.0.0 > 1.0.1)

1. Download attached "steamprofile_vb4_1.0.1_upgrade.zip".
2. Expand and upload the "steamprofile" folder into your forum's root directory. Replacing all files.
3. Finished.

Version History
1.0.0 - Initial Release
1.0.1 - Fixed Quote Overlap Issue

[johkalhaups]

<a href="http://www.theriseoftsm.com/forums/index.php" target="_blank">http://www.theriseoftsm.com/forums/index.php</a>

I use posbit instead of postbit_legacy, is there anyway to have this show up to the left of the info in posts like location, posts, join date, etc?

[i3lack]

I put this under my postbit right under the Posts:XXX

To Do this follow the instructions below.

1. Go to Postbit_Legacy
2. Search "Posts" should look like this

{vb:rawphrase 'posts'} : {vb:raw post.posts} 
    </div>

Below Put

<vb:if condition="$post['fieldx']"><div class="steamprofile" title="{vb:raw post.fieldx}" style="float: left;"></div></vb:if>
<script type="text/javascript" src="steamprofile/jquery-1.3.2.min.js"></script>
<script type="text/javascript" src="steamprofile/steamprofile.js"></script>

Make sure to change ['fieldx'] to your field number exp: ['field5']

Save and Load . It too long so to edit this go to steamprofile/themes/default
Edit the Style.css file and change to this

.steamprofile {
	position: relative;
	width: 180px;
	height: 48px;
	background: #8ba6b8 url(background.png);
	overflow: hidden;
	margin: 4px;
	z-index: 100;
}

To Change how far it comes out change

width: 180px;

I have mine at width: 180px;

http://thogaming.com/forums/news-center/4325-new-tho-media.html#post4708

If you have already installed this make sure you delete the coding you put in. If you dont it will not work with this!

[R4Z0R49]

Hello Mycologist,

Works perfect Thank you

PS Steam ids can be found here: http://steamidfinder.com/

[T3MEDIA]

cool. will check it out.

[horussjr]

can somebody make the 2.0.4 work on vbulletin 4.0.8? (or any other v4). here is the official project link
http://code.google.com/p/steamprofile/


PS: not changing the status because of the setting in the files. it's veri ugly made, unfinished etc. i made some changings into the files and themes and it's a lot nicer. and work very well changing the refresh rate

[kroko]

so dose this works with the newest version vbulletin?

[lcn]

Works well with Vbulletin 4.0.8
I modified one small part so the Steam information is posted on the left.

# Go to AdminCP > Styles & Templates > Style Manager > Edit Templates > Postbit Templates > postbit_legacy.
# Find the following line:

		<vb:if condition="$post['title'] OR $show['messageicon']">

in DeepSkyBlue change the word right to center

	<vb:if condition="$post['field5']"><div class="steamprofile" title="{vb:raw post.field5}" style="float: center;"></div></vb:if>

[ccsdef]

For those asking about http://code.google.com/p/steamprofile/.

Just use the same instructions as given here however note that you need only include the javascript files included in the new release you do not need jQuery.

If you want the Steam profile to show up on every post simply just move it (the code from step 14) before the code found in step 13.

Also in the default CSS to fix the quote overlap problem you must add a z-index. I used the following to properly display all images and fix the quote overlap.

.steamprofile z-index = 1

.steamprofile .sp-extra z-index = 2 (this just pertains to the stuff that rolls out)

.steamprofile .sp-handle z-index = 3 (this is the part you click to roll out the extras)

Hope this helps!

[Stheal]

does the mod work? cause i have this problem



Can anyone help me getting it work?

[matrixmark]

Originally Posted by stuky4ever

How can I add the Steam Profile thing below the Post Count. Example.

Took a bit of playing around but finally got it for me

find:

{vb:raw post.yahooicon} {vb:raw post.skypeicon}

In your postbit_legacy file.

and under that ^ line paste in:

<vb:if condition="$post['fieldX']"><div class="steamprofile" title="{vb:raw post.fieldX}" style="float: left;"></div></vb:if>

Make sure to change the X in ['fieldX'] part to the number of your field when you created it.

Save and reload.

p.s you might and probably will have to modify the css a little to fit it in there better! but that I wont explain as it might be different all depending what theme you are using etc. The css file is located in "/steamprofile/themes/default" this is the block you need to edit up a little bit to fit your needs.

.steamprofile {
position: relative;
width: XXXpx;
height: XXXpx;
background: #8ba6b8 url(background.png);
overflow: hidden;
margin: 4px;
z-index: 100;
}

Replace the XXX's with the sizes for your forum, i used width: 170px; height: 48px; for mine but it might be different for yours

Well hopefully that made sense if not let me know and i'll try and explain better. Oh and here is a lil screenshot of what it looks like... hope this is allowed :O

Uploaded with ImageShack.us

Mark