[Release] Category Images

[SaintDog]

Author: SaintDog

Description: This is the long awaited tutorial on how to replace your categories with images w/o a border (such as what have been done both here and at yaxay). All support for this modifcation will be provided in this thread only. Hopefully, no support will be needed, I have made it as easy as possible.

Note: This modification does require that you install the following modifications before installing the category images modification:

Category Spacing::
http://www.vbulletintemplates.com/mods/showthread.php?s=&threadid=13

Forum Headers Under Categories:
http://www.vbulletintemplates.com/mods/showthread.php?s=&threadid=11

Have fun!

[Bungie]

heh, I need support. :D

So, there's 3 image file paths...'left', 'catbg' and 'right'. is that 3 parts of the same image? or how does that work. I might just be being ignorant... but hey, it's late. lol.

[vertex]

WOOO exactly EXACTLY what i was looking for, amazing support here Saint

keep it up bud. = ]

[imported_ULTIMATESSJ]

lol my constant moaning finally got answered, thanx a bunch saintdog

[SaintDog]

Originally posted by Bungie
heh, I need support. :D

So, there's 3 image file paths...'left', 'catbg' and 'right'. is that 3 parts of the same image? or how does that work. I might just be being ignorant... but hey, it's late. lol.

To use this, you basically need to end images and one background image. The background image is placed in the middle cell, the other 2 cells just have the images.

Note: The image names can be changed, it is nothing final.

[Crono]

Thank You saint dog, You answered my prayers.

[HHawk]

Nice indeed... Adds some more spice to a forum...

How do you do this for the posts (like in here), I noticed every post in here has a top and bottom graphics section...

Sorry about my sucky English, but I'm Dutch... Ehr not a good excuse is it... ;)

[SaintDog]

Originally posted by HHawk
How do you do this for the posts (like in here), I noticed every post in here has a top and bottom graphics section...

You will need to edit the postbit template and play around with it. I do plan on releasing a postbit here a little later on when I get time, although vBT's postbit will not be released.

[HHawk]

Wow you always answer this fast SaintDog? :)
Thanks...

Oh and also how do you add bottom side graphics to a categorie like this forum has?

(I guess it will be the same kinda answer I'll get from you as before)

Thanks again in advance...

[P?larity]

I spent an hour yesterday figuring this out on my own. (I don't know much html)

And now you release it today! >_<

Oh well, thanks for sharing your knowledge with the rest of us. =p

[K33nny]

Originally posted by HHawk
Wow you always answer this fast SaintDog? :)
Thanks...

Oh and also how do you add bottom side graphics to a categorie like this forum has?

(I guess it will be the same kinda answer I'll get from you as before)

Thanks again in advance...

I would answer that but I'm unclear on what exactly want. Get a speedly reply up and I'll answer that. The last I saw SaintDog isn't online or at least on the forums. I'll try and help.

[SaintDog]

vBT does not have bottom images on the categoriesm unless you are speaking of the postbit (which is what you are looking at as you read this). If it is the postbit, there has not been a tutorial posted or release made that will show you how. Please search the forum and you will find more information, many members have asked this ;).

[SemperFidelis]

Saintdog
I applied the three modifications to a fresh install of vb 2.2.6

And I have just noticed a problem

This occurs when not running IE at fullscreen
And I then drag the size of the window inwards.

In the style settings I currentlly have this set :
Main Table Width: 65
Content Table Width: 100

This occurs at other sizes above too

I noticed this doesnt occur at vBT
How can I fix this ?

Added Note :
The colours and the images used are only on a test board
I was trying to make it look as close to vBT as possible hoping it may make things easier for yourself to diagnose.

Edit :
This doesnt occur for the footer as that lines up correctly

[GimIk]

THANK YOU

i have been lookin for all three of these...thank you very much

[Ajnabi]

thx a bunch man. this one is really useful

[G2 Lost Soul]

i'm thinking it is because the vB image is too big... and if you have downsized the width of the forum from 100% that will occur.

[dmjof]

V-Net: I don't work here or anything but please take those catagory images down. They are a rip/re-color of these. SaintDog will probably tell you the same, but take those down. That is counted as a rip.

[SaintDog]

@V-Net: Whether you re-color them or not, or if they are on your test board or not, they were taken from here and need to be removed. All images here (unless otherwise stated) belong to myself & vBulletinTemplates and are not for public use.

[G2 Lost Soul]

ty so much for these saint dog. soon i plan on applying these button images and stuff... if i can ever figure out how to do it. www.g2-squad.com/chat ty again

[Grealm]

anyway i can resize the category height? coz i have to use 30 pixel height for the images.. if not, the images will be doubled.. :(

[Jon]

Thankyou for this wonderful idea.

[SaintDog]

Not as popular as everyone made it seem a while back ;).

[CyTreX]

Hi :)

I have a question...
I want to put some border-images under the categories too, so it looks like a box. Which template i have to edit? I can?t found it.

[P?larity]

CyTreX -Someone posted that, but then took it down and said they need more time to work on the install.

If anyone else knows how to do this please let us know though.

[CyTreX]

Ok, I have it! :D
You can see it here (http://www.ctx-board.com).

But it only looks good when you have a table (I have a welcomepanel) above your categories.
I have put the lower border-images-code above the code in the forumhome_forumbits_level1_nopost-Template. So the welcomepanel have the Images from my first category *g*
The last category now have no lower border-imgs at this time. But its very simple, just put the border-images-code below $forumbits in the forumhome-Template. ;)
Perhaps no comfortable way, but it works! ;):D

Sorry for my english, schooltime is a long time ago ;)

[imported_Sufian]

Hi,

This is great, and I have it working for categories. One question though. How do I do the same for the threads like here on vBT?

[jediguy]

One of my favorite modifications (http://forums.shoresofvalinor.com)....thank you. Can't understand why it's not more popular!

[Tony G]

Yes, a nice mod. Good work. :)

[bonnmac]

Originally posted by Sufian
Hi,

This is great, and I have it working for categories. One question though. How do I do the same for the threads like here on vBT?

I too have been trying to figure out how to do this with the threads like here on vbt (image attached). Anyone care to share?

[TDS]

um....
I think I did something wrong....
It looks good BUT, the middle image is only the size it needs to be to Be under the catagory name.
it doesn't go to the edges of the boards.

Um.. some info on the images might help eh?

topleft = 65x58
topmid = 26x58
topright = 65x58

[imported_Tweak]

How would you do this for Private message Cat and Online user Cat?

[Tony G]

Follow the same instructions in forumhome_loggedinusers and forumhome_pmloggedin. (There may be some differences)

[Mage]

Originally posted by TDS
um....
I think I did something wrong....
It looks good BUT, the middle image is only the size it needs to be to Be under the catagory name.
it doesn't go to the edges of the boards.

Um.. some info on the images might help eh?

topleft = 65x58
topmid = 26x58
topright = 65x58

This is the exact problem that I'm getting, the category middle image is appearing only as big as the specified forum name, SUPPORT PLEASE!

[lebanon2001]

THANK YOU

[Red Shadow]

i didnt know it was this easy, thanks!

[Sc0rp]

yeah, really nice one SD, working like a charm.. though can u tell me how to add them to the bottem aswell???

[Zehlek]

I noticed at http://forum.yaxay.com they have images underneath each set of forums by category. Any idea on how to do that?

[rocky14199]

Could you explain to me how to add images to the botom of each catagory just you have it to the bottom of each post here...

[imported_Blindchild02]

hey, im havin a problem.... everytime i add the BG it adds a white line under it.... anyone know how to fix?

[imported_CityInet]

Saint,
I used this mod and it works great. thanks. but it only for the frontpage. how do can i make these changes accross the whole forum?

[Tony G]

There are some mods which add categories to other places but just use similar code but in the other templates.

[Cypher720]

i released a mod for that if you look around

[Foxfire]

Hello. I tried installing this template, and I had a little error. For starters, I hadn't had any of the 3 required templates on this hack installed, so my error might be from any one of them.

I also have Demonz' sidemenu template on, and that's what's causing this problem, well not causing the problem, but receiving it. I can't really go into detail about what's wrong, because I am not very good with html. So I decided to post some screens of my problem, so maybe you could help me out, if you can I'd really appreciate it.

[Foxfire]

here's the rest of the box, before you hit the forum listing.

[SsJ8Darkness]

well I know a way that needs no templant mods.. but this doesnt have side images.. in the style colors.. do this:

#??????" background="{imagesfolder}/image.ext

replace ?????? with the color normaly seen.. this is suggested incase the image is deleted..

and replace image.ext with the image file name.. and there is a reason the background code doesnt have a " at the end.. caz the php adds one..

BEST USED with a 50px X 50px Gradent going up or down.. or a image that can be repeated.. or a image that is longer then needed

[imported_Someguy]

I love you (in a heterosexual way). For a graphic designer like myself, this is a neccessity for skinning forums. You friggin 0\/\/|\|

[imported_Eye Kay]

One problem that I had, and I don't know if anyone else did was I got 3 small images, the left and right were proper size, but the middle was only 200 (pixels) wide. I fixed this by: going to "Forumhome_postbit_nopost1" >> finding <td align="center" background="images/catbg.gif" width="200"> and changing it to <td align="center" background="images/catbg.gif" width="100%">

^^ Just incase someone else has the same problem and dosn't know what to do.

[imported_Eye Kay]

Ehh', I'm too lazy to code it right now, and I'm sleepy so I fear that I might mess up my board (with all the hacks I have on it now) anyone care to link me to a forum on showing how (or quickly tell me how) to add this to Currently Active Users, and Logged Users today... I know which files to edit, just think it'd be easier if I just followed a link :D

[Zachery]

Ehh', I'm too lazy to code it right now, and I'm sleepy so I fear that I might mess up my board (with all the hacks I have on it now) anyone care to link me to a forum on showing how (or quickly tell me how) to add this to Currently Active Users, and Logged Users today... I know which files to edit, just think it'd be easier if I just followed a link :D


<td width="48" align="left"><img src="{imagesfolder}/left.gif" border="0"></td>

<td align="center" background="{imagesfolder}/catbg.gif" width="100%"><a href="forumdisplay.php?s=$session[sessionhash]&forumid=$forum[forumid]"><normalfont color="{categoryfontcolor}"><b>$forum[title]</b></normalfont></a></td>

<td width="48"><img src="{imagesfolder}/right.gif" border="0"></td>

that should work :\

[AN-net]

i have this line on the top of my forums now=( how do i get rid of this?