Forum Skin Design

[Carl the Llama]

So I was wondering how it is you guys develop new forum skins, any tutorials you could possibly point me in the direction of?

Thanks.

[Dr Unne]

Start with the default skin and modify it, would be my suggestion. You can do a lot by changing CSS and a few images.

Try searching youtube for tutorials, if you need basic info.

[Marshall Banana]

Are you using vBulletin?

[Carl the Llama]

Are you using vBulletin?

Thankfully so.

[The Man]

What version? Different versions of vBulletin work radically differently.

[Carl the Llama]

4.2.0

[Aulayna]

You can do a lot by just changing the colours in the stylesheet. For more advanced looking things the best thing to do is make a child style of the default template and then customize the child - for that you're looking at modifying the templates and plugins directly.

It depends what you want to achieve really as to what you want to edit.

EoFF for example is mostly just colour changes and settings changes with very few template edits.

[Rantz]

Depends a bit on what kind of style you want and how heavily you want to edit it. The more changes you make in the actual templates, the more maintenance you will generally have to do after updating vBulletin. The easiest way to get started is usually to use the Style Generator in the admin panel to create a base with the colours you want. The next step is to edit Stylevars (Style Manager -> Style Variable Editor). Often it's apparent which variable to edit to get the change you want, but in the event that it's not, you will want to know a bit of HTML/CSS to be able to figure it out. I usually right click the element I want to change the look of, and click Inspect Element. This tells me some information about the CSS that is used to style the element, which I can then use to find the templates involved (using the Search Templates function), and whether I can change stylevars to get the effect I want. If I can't, I'll usually put CSS changes in the additional.css template instead, which is a template that's empty by default and meant for free customisation.

[rubah]

I use firebug to edit the css in-browser. You can point it to local file references if you don't want to upload your pictures.

as for learning how to do all that stuff, w3schools.com is pretty decent for html and css, and you can probably google or look on stackoverflow for everything else