center name, avatar ranking etc or add posts, join date etc inside a box

center name, avatar ranking etc or add posts, join date etc inside a box

Mod Version: 1.00, by ShawneyJ

vB Version: 4.2.2	Rating: (4 votes - 5.00 average)	Installs: 46
Released: 02 Aug 2010	Last Update: Never	Downloads: 0
Not Supported Template Edits Code Changes

Some of you, like my self would like to center only title, ranking, reputation, avatar, username and reps.

Well hears a simple edit that works.

To center username, title, ranking, reputation, avatar, username and reps in Postbit Legacy:

Add the following code to your additional.css:

Code:

.postbitlegacy .userinfo  .postuseravatar, .eventbit .userinfo .eventuseravatar {
float:none !important;
text-align:center !important;
}
.postbitlegacy .userinfo .username_container, .postbit_reputation, .postbitlegacy .userinfo .rank, .postbitlegacy .userinfo .usertitle {
text-align:center !important;
}

I have tested on default style vbulletin, and 4 custom styles, all work like a charm, well it does for me, hoping the same for you.

Next - How to add Posts, Location etc inside a box:

Add the following code to your additional.css:

Code:

.post_field {
	background:{vb:stylevar post_field_background_color};
	color:{vb:stylevar post_field_font_color};
	border:{vb:stylevar post_field_border};
	padding:{vb:stylevar post_field_padding};
	margin-top: 2px;
	text-align:left;
}

Next in postbit_legacy template Find:

Code:

<vb:if condition="$post['joindate']"><dt>{vb:rawphrase join_date}</dt><dd>{vb:raw post.joindate}</dd></vb:if>

And wrap this Code around anything you want Boxed:

Code:

<div class="post_field">Text</div>

The <div class="post_field"> must be added just before the <dt> for this to work and the end </div> after </dd> for if conditions only.

Your Code should look like this:

Code:

<vb:if condition="$post['joindate']"><div class="post_field"><dt>{vb:rawphrase join_date}</dt><dd>{vb:raw post.joindate}</dd></div></vb:if>

I did notice for Posts, you would need to wrap the whole small bit of code for this to work. Example:

Code:

<div class="post_field"><dt>{vb:rawphrase posts}</dt> <dd>{vb:raw post.posts}</dd></div>

If you have iTrader, Thanks, or any other addons with a automatic template edit in post bit.

Just wrap the code around the template_hook like this:

Code:

<div class="post_field">{vb:raw template_hook.postbit_userinfo_right_after_posts}</div>

Same for any manual template edits like Moods, Flags Example:

Moods:

Code:

<div class="post_field">{vb:raw vmoods_postbit}</div>

Flags:

Code:

<div class="post_field"><vb:if condition="$post['field5']"><style="text-align:left"> Country:</dt> <img src="{vb:stylevar imgdir_button}/flags/{vb:raw post.field5}.GIF" align="middle" alt="{vb:raw post.field5}" border="" /></vb:if></div>

If you have No Manual Template Edits:

Just Find in postbit_legacy template:

Code:

<vb:if condition="$post['joindate']"><dt>{vb:rawphrase join_date}</dt> <dd>{vb:raw post.joindate}</dd></vb:if>
					<vb:if condition="$post['field2']"><dt>{vb:rawphrase location_perm}</dt> <dd>{vb:raw post.field2}</dd></vb:if>
					<vb:if condition="$post['age']"><dt>{vb:rawphrase age}</dt> <dd>{vb:raw post.age}</dd></vb:if>
					<dt>{vb:rawphrase posts}</dt> <dd>{vb:raw post.posts}</dd>	
					{vb:raw template_hook.postbit_userinfo_right_after_posts}

Remove and Replace with This:

Code:

<vb:if condition="$post['joindate']"><div class="post_field"><dt>{vb:rawphrase join_date}</dt><dd>{vb:raw post.joindate}</dd></div></vb:if>
					<vb:if condition="$post['field2']"><div class="post_field"><dt>{vb:rawphrase location_perm}</dt> <dd>{vb:raw post.field2}</dd></div></vb:if>
					<vb:if condition="$post['age']"><div class="post_field"><dt>{vb:rawphrase age}</dt> <dd>{vb:raw post.age}</dd></div></vb:if>
					<div class="post_field"><dt>{vb:rawphrase posts}</dt> <dd>{vb:raw post.posts}</dd></div>	
					<div class="post_field">{vb:raw template_hook.postbit_userinfo_right_after_posts}</div>

Im hoping i have at least helped 1 or 2 people out here

cheers.

My main reason for this thread was to center username, title, ranking, reputation, avatar, and reps.
Also to help those that want to wrap posts etc in a box.
It SHOULD work for all vb4.x to vb4.2.2

CLICK INSTALL IF I HAVE HELPED IN SOME WAY THANKS

New: vb4.2.2 default style Screenshot added.

PLEASE NOTE: This is NOT copied code from anyone here at vb.org, i have been using this code for a very long while, well since vb4.x.

Download

No files for download.

Screenshots

vBulletin LTS