Horizontal Posbit Tutorial

[FirefoxWiz]

This is just a reference in case MyBBFans goes down one day...

This tutorial was originally made by DennisTT on MyBBFans..

To achieve the horizontal postbit, you will need to edit the postbit templates.

ACP > Templates > *Your Template Set* > Postbit Templates > postbit

Replace it with:

Code:

<td class="tcat" colspan="2" height="18" style="white-space: nowrap; text-align: left">{$post['posturl']}<div class="smalltext" style="float:left">{$post['postdate']} {$post['posttime']}</div>
{$post['icon']}<div class="smalltext" style="text-align: center"><strong> {$post['subject']}</strong></div>
</td>
</tr>
<tr>
<td class="{$altbg}" colspan="2" valign="top" style="white-space: nowrap; text-align: left;"><a name="pid{$post['pid']}" id="pid{$post['pid']}"></a>
{$post['user_details']}
</td>
</tr>
<tr>
<td class="{$altbg}" colspan="2" width="85%" valign="top">
<table width="100%">
<tr><td>
<div id="pid_{$post['pid']}">
{$post['message']}
</div>
{$post['attachments']}
{$post['signature']}
<div style="text-align: right; vertical-align: bottom;">
{$post['editedmsg']}
{$post['iplogged']}
</div>
</td></tr>
</table>
</td>
</tr>
<tr>
<td class="{$altbg}" colspan="2" width="100%" valign="middle" height="18">
    <table width="100%" border="0" cellpadding="0" cellspacing="0">
    <tr valign="bottom">
        <td align="left" ><span class="smalltext">{$post['button_email']}{$post['button_pm']}{$post['button_www']}{$post['button_find']}</span></td>
        <td align="right"><span class="smalltext">{$post['button_edit']}{$post['button_quickdelete']}{$post['button_quote']}{$post['button_multiquote']}{$post['button_report']}</span></td>
    </tr>
    </table>
</td>
</tr>
{$seperator}

Now open the postbit_author_guest and replace it with:

Code:

{$post['useravatar']}<strong><span class="largetext">{$post['profilelink']}</span></strong>
<br />
<span class="smalltext">
    {$post['usertitle']}<br />
    {$post['groupimage']}
</span>

Now the postbit_author_user template and replace it with:

Code:

<div class="smalltext" style="float: right">
    {$lang->postbit_posts} {$post['postnum']}<br />
<!--        {$post['userstars']} {$usergroup['title']}<br /> {$lang->postbit_joined} {$post['userregdate']}<br /> -->
    {$lang->postbit_status} {$post['onlinestatus']}{$post['replink']}<br />
</div>

{$post['useravatar']}<strong><span class="largetext">{$post['profilelink']}</span></strong><br />
<span class="smalltext">
    {$post['usertitle']}<br />
    {$post['groupimage']}<br />
</span>

(Notice the commented line. You can remove the comments if you want)

Now replace the postbit_avatar template with this:

Code:

<div style="float:left; padding-right: 10px;"><img src="{$post['avatar']}" alt="" {$avatar_width_height} /></div>

And you should be done. Arrange the stuff, and have fun!

Example:
   

[.Paradox]

Nice code! I'm using this right now.

[bluejade]

I'm not sure how I would like it with all the author information on top... hmm

[FirefoxWiz]

Actually, Jade, it doesn't look so bad. I tried it and it looks pretty nice.

[judel]

Yeah, I tried it too, and after a bit of tweaking looks pretty cool.

[FirefoxWiz]

I think just about everything takes tweaking to get it to your preference.

[.Paradox]

It sure does, because sometimes when i download a skin, I edit it a little bit if I don't like a certain aspect

[lorddonk]

What is difference? I'm confused @_@

[FirefoxWiz]

This puts the author information (postbit) above the posts instead of on the left like it is by default.

[Tarazar]

Will this replace the rounded corners stuff if we use this?