MyBB Community Forums

You have to modify the templates.

For example for the forum bit on the index page, the way I did it was to end the table after the thead and instead of the tbody, I used a div with the same id and have the tbody part in it.

Heres what my forumbit_depth1_cat looks like to give you an example:

<table border="0" cellspacing="{$theme['borderwidth']}" cellpadding="{$theme['tablespace']}" class="tborder">
<thead>
<tr>
<td class="thead" colspan="5">
<div class="expcolimage"><img src="{$theme['imgdir']}/{$expcolimage}" id="cat_{$forum['fid']}_img" class="expander" alt="{$expaltext}" title="{$expaltext}" /></div>
<div><strong><a href="{$forum_url}">{$forum['name']}</a></strong><br /><div class="smalltext">{$forum['description']}</div></div>
</td>
</tr>
</thead>
</table>
<div style="{$expdisplay}" id="cat_{$forum['fid']}_e">
<table border="0" cellspacing="{$theme['borderwidth']}" cellpadding="{$theme['tablespace']}" class="tpost">
<tbody>
<tr>
<td class="tcat" colspan="2"><span class="smalltext"><strong>{$lang->forumbit_forum}</strong></span></td>
<td class="tcat" width="85" align="center" style="white-space: nowrap"><span class="smalltext"><strong>{$lang->forumbit_threads}</strong></span></td>
<td class="tcat" width="85" align="center" style="white-space: nowrap"><span class="smalltext"><strong>{$lang->forumbit_posts}</strong></span></td>
<td class="tcat" width="200" align="center"><span class="smalltext"><strong>{$lang->forumbit_lastpost}</strong></span></td>
</tr>
{$sub_forums}
</tbody>
</table>
</div>
<br />

EDIT: The above is from a custom theme I'm working on, I've added a couple of things to make it look nicer such as the tpost class which does not exist in the default css, so don't just copy paste, I'm posting the above for you to understand what needs to be done.

@G33K here's my code for that template can you tell me what I have to change?

<table border="0" cellspacing="{$theme['borderwidth']}" cellpadding="{$theme['tablespace']}" class="tborder">
<thead>
<tr>
<td class="thead" colspan="5">
<div class="expcolimage"><img src="{$theme['imgdir']}/{$expcolimage}" id="cat_{$forum['fid']}_img" class="expander" alt="{$expaltext}" title="{$expaltext}" /></div>
<div><strong><a href="{$forum_url}">{$forum['name']}</a></strong><br /><div class="smalltext">{$forum['description']}</div></div>
</td>
</tr>
</thead>
<tbody style="{$expdisplay}" id="cat_{$forum['fid']}_e">
{$sub_forums}
</tbody>
</table>
<br />

Check my previous post, you should be able to compare that template with yours and see what changes I made.

I did I don't see any difference except this part

<div style="{$expdisplay}" id="cat_{$forum['fid']}_e">

No one got back to me on this

I don't know what else you want me to do here. I gave you the jscript changes, I told you how to make the divs, I even gave you an example of how it can be done, all you had to do was look at the changes I made to understand what needs to be done.

Short of just making a whole new theme with the changes and giving it to you, I don't know what else you're expecting from me.

Well maybe we could team view this? Please.

There are 'expandedItem.show();' and 'expandedItem.hide();' in different lines, which ones do we have to edit?

Doesn't work for ,e I did as the tutorial said, without any luck