[metalguy639]

You will have to take out the tborder part in your template code most likely. The easiest way to do this if you are using vb 3.8 or anything that is not 4.0 is to make the images that you want to use in photoshop, gimp, or whatever program you use to make images. Then you will need to splice it and then add it to 2 different templates and change some code in those templates for it to look right. You will need to know and understand html & css and be able to splice an image into 3 pieces. I can give you an example of what I did on my site.

1. Make your image for your category top in photoshop, gimp or whatever you use. It should be something similar to this:



This is a skin that I will be releasing soon to the public. So you want to either make something like that or you could something like this:

This is actual rounded corners I did some time ago.

Once you make your image and unless you are making it into a png I suggest that you pout a background color that is the same color as the background that the image will be on. You can see evidence of that in both pics above. Its easier and looks neater in the long run.

2. Now splice the image into 3 parts. A left side, right side & a middle part. Name them cat_left.gif, cat_right.gif, & cat_bg.gif.

3. Now you will need to change/add some code to your templates with this category image and you'll need to add it as a table to your templates. If you want tableless then you will have to look that up somewhere, but this will at least give you an idea of where & what to edit.

4. Login to your admincp and scroll down and find "Styles & Templates" Make sure that you expand the menu and look for "Style Manager" underneath the Styles & Templates. Click on the "Style Manager" link to open up your styles.

5. Find the style you want to edit in the list and the click on the drop down menu on the far right side and choose "Edit Templates".

6. Now click the <<>> button on the right side to expand the templates and then scroll down and find the FORUMHOME template. Double click to open it.

7. FIND:

<thead>
	<tr align="center">
	  <td class="thead">&nbsp;</td>
	  <td class="thead" width="100%" align="$stylevar[left]">$vbphrase[forum]</td>
	  <td class="thead">$vbphrase[last_post]</td>
	  <td class="thead">$vbphrase[threads]</td>
	  <td class="thead">$vbphrase[posts]</td>
	  <if condition="$vboptions['showmoderatorcolumn']">
	  <td class="thead">$vbphrase[moderator]</td>
	  </if>
	</tr>
</thead>

AND DELETE IT FROM THE TEMPLATE.

8. NOW FIND:

$forumbits
<tbody>
	<tr>
		<td class="tfoot" align="center" colspan="<if condition="$vboptions['showmoderatorcolumn']">6<else />5</if>"><div class="smallfont"><strong>
			<a href="forumdisplay.php?$session[sessionurl]do=markread" rel="nofollow">$vbphrase[mark_forums_read]</a>
			<if condition="$vboptions['forumleaders']">&nbsp; &nbsp;
			<a href="showgroups.php$session[sessionurl_q]">$vbphrase[view_forum_leaders]</a></if>
		</strong></div></td>
	</tr>
</tbody>
</table>
$forumhome_markread_script
<!-- /main -->

<br />
$ad_location[ad_forumhome_afterforums]
<br />

AND REPLACE WITH:

<!-- main -->
$forumbits
$forumhome_markread_script
<!-- /main -->

<br />
$ad_location[ad_forumhome_afterforums]
<br />

NOTE: If you still want to be able to mark the forum as read & have the view forum leaders at the bottom you can leave this code in and it would look like this instead:

<!-- main -->
$forumbits
<div align="center"><a href="forumdisplay.php?$session[sessionurl]do=markread" rel="nofollow">$vbphrase[mark_forums_read]</a>
			<if condition="$vboptions['forumleaders']">&nbsp; &nbsp;
			<a href="showgroups.php$session[sessionurl_q]">$vbphrase[view_forum_leaders]</a></if></div>
$forumhome_markread_script
<!-- /main -->

<br />
$ad_location[ad_forumhome_afterforums]
<br />

9. NOW FIND:

<!-- what's going on box -->
<table class="tborder" cellpadding="$stylevar[cellpadding]" cellspacing="$stylevar[cellspacing]" border="0" width="100%" align="center">
<thead>
	<tr>
		<td class="tcat" colspan="2">$vbphrase[whats_going_on]</td>
	</tr>
</thead>

AND REPLACE WITH:

<!-- what's going on box -->
<!-- top category table setup -->
<table width="100%" style="background-image:url(path/to/your/category background image/here)" border="0" cellpadding="0" cellspacing="0">
  <tr>
    <td align="left" valign="top"><img src="path/to/your/category left image/here" alt=" " border="0" /></td>
<td align="left" width="100%" style="background-image:url(path/to/your/ left category image/here)" valign="left"><strong><div style="color:#FFFFFF;">$vbphrase[whats_going_on]</div></strong></td>
     <td align="right" valign="top"><img src="path/to/your/category right image/here" alt=" " border="0" /></td>
  </tr>
</table>
        <!-- End top category table setup -->
<table class="tborder" cellpadding="$stylevar[cellpadding]" cellspacing="$stylevar[cellspacing]" border="0" width="100%" align="center">

Be sure to replace the path/to/your/category background image/here with the path and your cat image names. If its the right image then the code before or after it will say align="right" if its the left cat it will say align="left".

10. Now Save the template.

11. Now open the forumhome_forumbit_level1_nopost template.

12. Highlight it all and delete it. Replace it all with this:

<br />
<!-- top category table setup -->
<table width="100%" style="background-image:url(path/to/your/cat background image/here)" border="0" cellpadding="0" cellspacing="0">
  <tr>
    <td width="41" height="30" align="left" valign="top"><img src="path/to/your/Left cat background image/here" alt=" " border="0" /></td>
    <td width="100%" style="background-image:url(path/to/your/cat background image/here)" valign="middle">
	
			
			<a style="float:$stylevar[right]" href="#top" onclick="return toggle_collapse('forumbit_$forumid')"><img id="collapseimg_forumbit_$forumid" src="$stylevar[imgdir_button]/collapse_tcat{$collapseimg_forumid}.gif" alt="" border="0" /></a>
			<div align="center">
			<a href="forumdisplay.php?$session[sessionurl]f=$forum[forumid]"><b><font color="#003300">$forum[title]</font></b></a></div>
			<if condition="$show['forumdescription']"><div align="center" class="smallfont"><font color="#003300">$forum[description]</font></div></if>
			<if condition="$show['subforums']"><div class="smallfont"><strong>$vbphrase[subforums]</strong>: $forum[subforums]</div></div></if>
		
	
	</td>
     <td width="41" height="30" align="right" valign="top"><img src="path/to/your/right cat background image/here" alt=" " border="0" /></td>
  </tr>
</table>
        <!-- End top category table setup -->
        
        
        

<table class="tborder" cellpadding="6" cellspacing="1" border="0" width="100%" align="center">
<if condition="$childforumbits">
<tbody id="collapseobj_forumbit_$forumid" style="{$collapseobj_forumid}">
<tr align="center">
	  <td class="thead">&nbsp;</td>
	  <td class="thead" width="100%" align="$stylevar[left]">$vbphrase[forum]</td>
          <td class="thead" width="200">$vbphrase[last_post]</td>
          <td class="thead">$vbphrase[threads]</td>
	  <td class="thead">$vbphrase[posts]</td>
	  <if condition="$vboptions[showmoderatorcolumn]">
	  <td class="thead">$vbphrase[moderator]</td>
	  </if>
	</tr>
$childforumbits
</tbody>
</if>
</table>

Note that you will need to replace the path/to/your/cat image/here with the path to your images. You will also need to adjust the color in the css as well as the sizes of the images. (width & height)

SAVE THE TEMPLATE.

You are done and now you have category tops & the forums are separated from each other.