Quantcast
Channel: MyBB Community Forums - Tutorials
Viewing all articles
Browse latest Browse all 685

Forums in columns

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

Subforum
[Image: lVQh2L4.png]

Index
[Image: uz1ZZUi.png]




Open your theme global.css style sheet and put this at the end:
Code:
table.forumh {
   width:100%;
   margin: 0px auto auto;
   clear:both;
}
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:3px;
   vertical-align:text-bottom;  
   max-width:30px;
   max-height:25px;
   filter:alpha(opacity=60);
   opacity:0.6;
}
table.forumh h3 span {
   font-weight:normal;
}

table.forumh ul {
   list-style: none;
   margin: 0px;
   padding: 0px;
}
table.forumh ul li {
   list-style: none;
   width: 50%;
   margin-bottom:10px;
   float: left;
}
table.forumh ul li table {
   width: 98%;
   min-height: 110px;
   margin: auto auto;
   background: #feffe8;
   background: -moz-linear-gradient(top, #feffe8 0%, #d6dbbf 100%);
   background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#feffe8), color-stop(100%,#d6dbbf));
   background: -webkit-linear-gradient(top, #feffe8 0%,#d6dbbf 100%);
   background: -o-linear-gradient(top, #feffe8 0%,#d6dbbf 100%);
   background: -ms-linear-gradient(top, #feffe8 0%,#d6dbbf 100%);
   filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#feffe8', endColorstr='#d6dbbf',GradientType=0 );
   background: linear-gradient(top, #feffe8 0%,#d6dbbf 100%);
   -webkit-box-shadow: 0px 0px 5px 0px rgba(0, 0, 0, 0.8);
   -moz-box-shadow: 0px 0px 5px 0px rgba(0, 0, 0, 0.8);
   box-shadow: 0px 0px 5px 0px rgba(0, 0, 0, 0.8);
   -webkit-border-radius: 2px;
   -moz-border-radius: 2px;
   border-radius: 2px;
}
table.forumh ul li table td img {
   max-width:150px;
   max-height:110px;
 
}
table.forumh ul li table div {
   font-family: Source Sans Pro;
   font-size:13px;
}
table.forumh ul li table div.last {
   font-family: Source Sans Pro;
   font-size:13px;
}




Open your theme forumbit_depth1_cat template and replace everything with this:
Code:
<table border="0" cellspacing="{$theme['borderwidth']}" cellpadding="{$theme['tablespace']}" class="forumh tborder">
<thead>
<tr>
<td class="thead{$expthead}" colspan="5">
<h3><div valign="top" class="expcolimage"><img src="{$theme['imgdir']}/{$expcolimage}" id="cat_{$forum['fid']}_img" class="expander" alt="{$expaltext}" title="{$expaltext}" /></div></h3>
<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:
Code:
<li>
<table border="0" cellspacing="{$theme['borderwidth']}" cellpadding="{$theme['tablespace']}">
<tr>
<td align="center" valign="middle" width="5px" rowspan="2"><span class="forum_status forum_{$lightbulb['folder']} ajax_mark_read" title="{$lightbulb['altonoff']}" id="mark_read_{$forum['fid']}"></span></td>
<td><strong><a href="{$forum_url}">{$forum['name']}</a></strong>{$forum_viewers_text}<br />
<div class="smalltext">Discussions: {$threads}{$unapproved['unapproved_threads']} &nbsp; Messages: {$posts}{$unapproved['unapproved_posts']}</div>
<div style="margin-left: -10px;" valign="middle">{$subforums}  </div></td>
<td width="36%">{$lastpost}</td>
</tr>
</table>
</li>


Open your theme forumbit_depth2_forum_lastpost template and replace everything with this:
Code:
<div class="last"><a href="{$lastpost_link}" title="{$full_lastpost_subject}"><strong>{$lastpost_subject}</strong></a><br />
{$lang->by} {$lastpost_profilelink}, {$lastpost_date} {$lastpost_time}<br /></div>


Open your theme forumbit_subforums and delete
Code:
<br />


Open your theme forumdisplay_subforums template and replace everything with this:
Code:
<table border="0" cellspacing="{$theme['borderwidth']}" cellpadding="{$theme['tablespace']}" class="forumh tborder">
<thead>
<tr>
<td class="thead" colspan="1" align="center">
<h3 class="forumdisplay">{$lang->sub_forums_in}</h3>
</td>
</tr>
</thead>
<tbody style="{$expdisplay}" id="cat_{$forum['fid']}_e"><tr><td>
<ul>{$forums}</ul>
</td>
</tr>
</tbody>
</table>
<br />

Viewing all articles
Browse latest Browse all 685

Trending Articles