MyBB Community Forums

Full Version: First Skin Attempt
You're currently viewing a stripped down version of our content. View the full version with proper formatting.
Completion: [90%]

Preview: http://vg-games.uni.cc/board/index.php

But i did want to know one thing, anybody got the code to put side images on teh index categorys. Like this skin for instance:

http://www.extremepixels.com/forum/index.php?styleid=36

its just an example, see how the category has the 2 side images, if no one has done it, ill try to look at the vBulletin code and see how to do it
Not bad keep going
Really cool theme!

Maybe you can insert the images into the templates like:
<img src="left.gif" alt="" align="left" width="10" height="10" />
<img src="right.gif" alt="" align="right" width="10" height="10" />

Greets,
Michael
I have just uploaded the skin. Please note some images have not been custimized, so they are still default, but it really wont matter much. Please reffer to the first post for the attachment.
Templates / *your template* / Forum Bit Templates [Expand]/ forumbit_depth1_cat

In there. the default is:
<tbody>
<tr>
<td class="tcat" colspan="5">
<div class="expcolimage"><a href="javascript:expandCollapse('cat_$forum[fid]');"><img src="$theme[imgdir]/$expcolimage" id="cat_$forum[fid]_collapseimg" border="0" alt="[-]" /></a></div>
<div><strong><a href="forumdisplay.php?fid=$forum[fid]"><i>&raquo;</i> $forum[name]</a></strong><br /><div class="smalltext">$forum[description]</div></div>
</td>
</tr>
</tbody>
<tbody style="$expdisplay" id="cat_$forum[fid]_e">
$forums
</tbody>

basically you have to change it to make sure the the graphics will nest correctly. For example a basic version would be:

<tbody>
<tr height="">
<td class="tcat" colspan="5">
	<table width="100%" border="0" cellspacing="0" cellpadding="0">[color=red]<tr height="">
		<td class="tcat" width="" background="$theme[imgdir]/leftimg.gif">or use <img /> tag</td>[/color]
		<td class="tcat">
		<div class="expcolimage"><a href="javascript:expandCollapse('cat_$forum[fid]');"><img src="$theme[imgdir]/$expcolimage" id="cat_$forum[fid]_collapseimg" border="0" alt="[-]" /></a></div>
		<div><strong><a href="forumdisplay.php?fid=$forum[fid]"><i>&raquo;</i> $forum[name]</a></strong><br /><div class="smalltext">$forum[description]</div></div>
		</td>
		[color=red]<td class="tcat" width="" background="$theme[imgdir]/leftimg.gif">or use <img /> tag</td>[/color]
	</tr></table>
</td>
</tr>
</tbody>
<tbody style="$expdisplay" id="cat_$forum[fid]_e">
$forums
</tbody>

I basically picked up what was originally there.
Popped it in a new table within the original header area.
This way, the images will not stretch, or the forum will not stretch to accomodate those images.

If you put them in the background, make sure you set specific sizes (where coloured red. otherwise you can use the original <img /> tags. The main difference is when highlighted, the images posted using img tags will highlight, whereas table backgrounds do not.

I hope this helps Smile

BTW (By The Way), make sure it is adjusted to fit into your theme. I realised the code was different because your's doesnt show up the 'minimise, maximise' button thingy.
Thanks alot, i will use this in my next skin Vivid Visionz