Forums in columns

[iAndrew]

What you'll end up with using this tutorial - credit to omar also for his code

Index: http://upload.vstanced.com/images/2016/0...wnload.png

Subforum: http://upload.vstanced.com/images/2016/0...forums.png



Open your theme global.css style sheet and put this at the end:

table.forumh {
   width:100%;
   margin: 0px auto auto;
   clear:both;
   background: #f0f0f0;
	
}

table.forumh h3 hr{
   width:98%;
   filter:alpha(opacity=60);
   opacity:0.6;
	
}

table.forumh h3.forumdisplay{
   text-align:center;
	
}

table.forumh h3  img {
   margin-right:1px;
   vertical-align:text-bottom;  
   max-width:30px;
   max-height:25px;
   filter:alpha(opacity=60);
   opacity:0.6;
	
}

table.forumh h3 span {
    font-size: 12px;
	
}

table.forumh ul {
   list-style: none;
   margin: 0px;
   padding: 0px;
	
}

table.forumh ul li {
   list-style: none;
   width: 50%;
   margin-bottom:3px;
   float: left;
	
}

table.forumh ul li table {
   width: 98%;
   min-height: 100px !important;
   margin: auto auto;
   background: #fff;
   border: 1px solid #f0f0f0;
   -webkit-border-radius: 2px;
   -moz-border-radius: 2px;
   border-radius: 2px;
	height: 100px;
	
}

table.forumh ul li table td img {
   max-width:150px;
   max-height:120px;
 
}

table.forumh ul li table div {
    font-size: 12px;
	
}

table.forumh ul li table div.last {
    font-size: 12px;
	
}


 

Open your theme forumbit_depth1_cat template and replace everything with this:

<table border="0" cellspacing="{$theme['borderwidth']}" cellpadding="{$theme['tablespace']}" class="forumh tborder">
<thead>
<tr>
<td class="thead{$expthead}" 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></div>
</td>
</tr>
</thead>
<tbody style="{$expdisplay}" id="cat_{$forum['fid']}_e">
<tr>
<td>
<ul>{$sub_forums}</ul>
</td>
</tr>
</tbody>
</table>
<br />

Open your theme forumbit_depth2_forum template and replace everything with this:

<li>
<table border="0" cellspacing="{$theme['borderwidth']}" cellpadding="{$theme['tablespace']}" class="tborder">
<tr>
	
<td align="left" width="10px" valign="middle" rowspan="5">
<span class="float_right forum_status forum_{$lightbulb['folder']} ajax_mark_read" title="{$lightbulb['altonoff']}" id="mark_read_{$forum['fid']}"><i class="fa fa-quote-right"></i></span>	
</td>

<td align="left" valign="middle" rowspan="5">
	
<div class="smalltext float_right">{$threads}{$unapproved['unapproved_threads']} Topics - {$posts}{$unapproved['unapproved_posts']} Replies</div>
	
<strong><a href="{$forum_url}">{$forum['name']}</a></strong> {$forum_viewers_text} 
	
<span align="center" valign="center" style="margin-right: 5px;"> {$lastpost} </span>	
	
<span style="margin-left: -5px;" valign="middle"> {$subforums}  </span>
	
</td>
</tr>	
</table>
</li>

Open your theme forumbit_depth2_forum_lastpost template and replace everything with this:

<br /> 
<span class="last"><a href="{$lastpost_link}" title="{$full_lastpost_subject}"><strong>{$lastpost_subject}</strong></a> &nbsp; {$lang->by} {$lastpost_profilelink}, </span> <span>{$lastpost_date} {$lastpost_time} </span>

Open your theme forumbit_subforums and replace everything with this:

<br /> {$sub_forums}

Open your theme forumdisplay_subforums template and replace everything with this:

<table border="0" cellspacing="{$theme['borderwidth']}" cellpadding="{$theme['tablespace']}" class="forumh tborder">
<thead>
<tr>
<td class="thead" colspan="1" align="center">
<span class="forumdisplay">{$lang->sub_forums_in}</span>
</td>
</tr>
</thead>
<tbody style="{$expdisplay}" id="cat_{$forum['fid']}_e"><tr><td>
<ul>{$forums}</ul>
</td>
</tr>
</tbody>
</table>
<br />