Rounded categor strips

[vbskinshop]

I want rounded category strips and i tried Dans way and it doestnt work it gives me alot of errors so i did it in CSS and i dont know how to put it in the template

Does anyone have a good tutorial for rounded category strips?

BTW:

My CSS in "Additional CSS Definitions"

.header_l{
background: url($stylevar[imgdir_misc]/top_left.png) no-repeat top left; height: 34px; }

.header_r{
background: url($stylevar[imgdir_misc]/top_lright.png) no-repeat top right; height: 34px; }

.header_bg{
 background: url($stylevar[imgdir_misc]/top_x.png) repeat-x top left; height: 34px; }
}

Where would i place this in the forum_1_nopost template?

[La Grange]

Whatever code you use I would put it in forumhome_forumbit_level1_nopost.

[vbskinshop]

i know but i need to know the code and where in that template to place it

[kusanagi]

Sorry i dont put it in Additional CSS Definitions and never use vbulletin css manager system. I import a new file call layout.css and modify with it ( import like this :<link type="text/css" rel="stylesheet" href="template/layout/layout.css" />
An Example :
http://kusanagivn.com/blog/post/8/

Do you see red and blue area in this picture ?
I'll code like this:
HTML:
<div class=”khung2”>
<div class=”khung1”>
<div class=”khung3”>
</div></div></div>
CSS:
.khung1 { background: url(khung1.gif) top left no-repeat ; height:48px }
.khung2 { background: url(khung2.gif) top left repeat-x ; height:48px }
.khung3 { background: url(khung3.gif) top right no-repeat ; height:48px }

khung1 and khung3 will be round , khung2 will be repeat .

And if you want put text in the center . You can use like this

<div class=”khung2”>
<div class=”khung1”>
<div class=”khung3”>

<div class=”Text” style="text-align:center ; padding-top: 7px"> AAAAAAAAAAAA </div>

</div></div></div>

I dont use and design vbb for a long time , but if you need my support you can add my YIM: kusanagi.naruto . Sorry my bad english , i'm vietnamese But i like design very much

[vbskinshop]

oh well i just didnt know where in vb to put it

[kusanagi]

oh well i just didnt know where in vb to put it

Sorry , put what ?

[vbskinshop]

basically i need to add rounded category images and the tutorial by semann doesnt work it messes my whole forums up is there another way?

[kusanagi]

Ok . You must split category first. In FORUMHOME template
Find:

<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]" rel="nofollow">$vbphrase[view_forum_leaders]</a></if>
</strong></div></td>
</tr>
</tbody>

Cut and remove it below :

<td class="alt1" width="100&#37;"><div class="smallfont">$upcomingevents</div></td>
</tr>
</tbody>
</if>
----- PUT IT HERE -------
</table>
<br />
<!-- end what's going on box -->

Going to the top :
Find:

<!-- main -->
<table class="tborder" cellpadding="$stylevar[cellpadding]" cellspacing="$stylevar[cellspacing]" border="0" width="100%" align="center">
<thead>
<tr align="center">
<td class="thead">&nbsp;</td>
<td class="thead" width="100%" align="$stylevar[left]">$vbphrase[forum]</td>
<td class="thead" width="175">$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>
$forumbits

</table>

Remove all and replace with:
$forumbits

Save and close FORUMHOME template

In forumhome_forumbit_level1_nopost :
Put in the top :

<br /><table class="tborder" cellpadding="$stylevar[cellpadding]" cellspacing="$stylevar[cellspacing]" border="0" width="100%" align="center">

And at the bottom:

</table>

Next , find :

<strong>$vbphrase[subforums]</strong>: $forum[subforums]</div></if>
</td>
</tr>
</tbody>
-------- PUT THIS CODE HERE --------
<if condition="$childforumbits">

And add this code :

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

Next , find :

<if condition="$show['forumdescription']"><div class="smallfont">$forum[description]</div></if>

Replace with :

<if condition="$show['forumdescription']"><font class="smallfont"> - $forum[description]</font></if>

Save this template.



-----------------------------------------------------------------------------
When you finish it . You can modify and add rounded category images . An example:

<div class="header_bg"><div class="header_l"><div class="header_r">
</div></div></div>
<div class="left_bg"><div class="right_bg">



forumhome_forumbit_level1_nopost template

</div></div>
<div class="footer_bg"><div class="footer_l"><div class="footer_r">
</div></div></div>

Good luck

[vbskinshop]

wait uh my forum categories are already psaced out

can u start from there XD

[vbskinshop]

after digging and digging i found it

CODE BY MINER

Replace your whole forumhome_forumbit_level1_nopost with

<br />
<!-- top category table setup -->
<table width="100&#37;" style="background-image:url($stylevar[imgdir_misc]/cat_back.gif)" border="0" cellpadding="0" cellspacing="0">
  <tr>
    <td width="140" height="27" align="left" valign="top"><img src="$stylevar[imgdir_misc]/cat_left.gif" alt=" " border="0" /></td>
    <td width="100%" style="background-image:url($stylevar[imgdir_misc]/cat_back.gif)" valign="center">
    
            
            <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="#FFFFFF">$forum[title]</font></b></a></div>
            <if condition="$show['forumdescription']"><div align="center" class="smallfont"><font color="#FFFFFF">$forum[description]</font></div></if>
            <if condition="$show['subforums']"><div class="smallfont"><strong>$vbphrase[subforums]</strong>: $forum[subforums]</div></div></if>
        
    
    </td>
     <td width="140" height="27" align="right" valign="top"><img src="$stylevar[imgdir_misc]/cat_right.gif" 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>
  <!-- bottom table setup -->
    <table width="100%" border="0" cellpadding="0" cellspacing="0">
      <tr>
        <td width="70" align="left" valign="top"><img src="$stylevar[imgdir_misc]/bot_left.gif" alt=" " border="0" /></td>
        <td  width="100%" style="background-image:url($stylevar[imgdir_misc]/bot_back.gif)"></td>
        <td width="70" align="right" valign="top"><img src="$stylevar[imgdir_misc]/bot_right.gif" alt=" " border="0" /></td>
      </tr>
    </table>
   <!-- End bottom table setup -->
     <div class="spacer"></div>

than add your images on the img src tags for each corner