MyBB Community Forums
First Skin Attempt - Printable Version

+- MyBB Community Forums (https://community.mybb.com)
+-- Forum: Extensions (https://community.mybb.com/forum-201.html)
+--- Forum: Themes (https://community.mybb.com/forum-103.html)
+---- Forum: Theme Support (https://community.mybb.com/forum-10.html)
+---- Thread: First Skin Attempt (/thread-2905.html)



First Skin Attempt - phenetic - 2005-07-03

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


RE: First Skin Attempt - Tsakalos - 2005-07-03

Not bad keep going


RE: First Skin Attempt - Michael S. - 2005-07-03

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


RE: First Skin Attempt - phenetic - 2005-07-04

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.


RE: First Skin Attempt - Netrosis - 2005-07-04

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.


RE: First Skin Attempt - phenetic - 2005-07-04

Thanks alot, i will use this in my next skin Vivid Visionz