Attractive User Info Boxes for Posts

admin

Administrator
Staff member
#1

This mod will allow you to create attractive custom containers for your member's user info in postbit. For example, Join date, post count, location, thanks etc.

See screenshot in attachments for example.

First, you need to add a class to your additional.css files.

Go to styles and templates > edit templates > css templates > additional.css

Add to the bottom:
HTML:
.postbitboxes {

color:white;
display:inline-block;
padding:3px;
padding-left:7px;
margin:2px;
border:1px solid #000000;
border-radius:5px;
background-color:#2b2b2b;
width:90%;
box-shadow: 2px 2px 1px #888888;

}
Change color, width, and background-color to suit your sites needs.

Now you need to make some edits to your postbit_legacy template.

Go to styles and templates > edit templates > postbit templates > postbit_legacy

Find:
HTML:
<dt>{vb:rawphrase join_date}</dt> <dd>{vb:raw post.joindate}</dd>
Change it to:
HTML:
<div class="postbitboxes">
<dt>{vb:rawphrase join_date}</dt> <dd>{vb:raw post.joindate}</dd>
</div>

Find:
HTML:
<dt>{vb:rawphrase location_perm}</dt> <dd>{vb:raw post.field2}</dd>
Change it to:
HTML:
<div class="postbitboxes">
<dt>{vb:rawphrase location_perm}</dt> <dd>{vb:raw post.field2}</dd>
</div>

Find:
HTML:
<dt>{vb:rawphrase age}</dt> <dd>{vb:raw post.age}</dd>
Change it to:
HTML:
<div class="postbitboxes">
<dt>{vb:rawphrase age}</dt> <dd>{vb:raw post.age}</dd>
</div>

Find:
HTML:
<dt>{vb:rawphrase posts}</dt> <dd>{vb:raw post.posts}</dd>
Change it to:
HTML:
<div class="postbitboxes">
<dt>{vb:rawphrase posts}</dt> <dd>{vb:raw post.posts}</dd>
</div>

Essentially all that you've done here is wrapped the new div tag around each element of your user info displayed in the sidebar.

So the above template edits can also be applied to templates for other mods which display info here such as Abe's Post Thank You Hack.

Enjoy!
 

Facebook Comments

New posts Latest threads Latest profile posts

Top