new to all this, i need some help from you friendly folk :)

[rafiky77]

well i struggled through the installation and amazingly it worked and now i am doing the design side

here is a screenie so far


so i have a number of questions, please bare in mind i am a total forum newbie, not used previous versions, just bought 5,

how do i make it so the forum looks alot more like this forum, with everything listed down one side, nice big boxes, description next to each sub-forum, add icons next to each forum (again like this one) i am probably being a idiot or missing something, looked at the video tutorials and it does not tell me anything about actual forum design, if someone could tell me or point me in the right direction i would be forever in your debt

so to some up, how do i copy the layout of this forum and just change the pictures and colours and the like

sorry for my newbiness

[Lynne]

Most of what you want to do would be solved by writing some custom CSS.

[rafiky77]

i will refrain from being rude................................... thanks for the reply! could anyone give me a little more information? is there no designs/templates i can download for vb5 that would simplify the process, i really need some more info than "write some code" i mean no offence, but to a newbie its a pretty terrible reply

[Wayne Luke]

Edit your top level forums like "In the Dog" house and make them Categories.

In the Page Manager there will be a link to click for each of them. If you use the AdminCP then you would go to Channel Manager -> Forum Manager and edit each top level forum and set the option to make it a category. The entire display will change and it will be more like this site.

[rafiky77]

thanks wayne, much appreciated

[Lynne]

I didn't actually mean to write some code, just some CSS to move things around. But, doing what Wayne suggested may get you close enough to what you want.

[rafiky77]

sorry lynne was getting a little frustrated with it at the time, my apologies

next question the little speech bubble icons next to each forum, what is the image called and where is it stored? and when found do i just replace it on the host?

[Lynne]

If you use something like firebug in firefox, it really helps out to find things like images. The little speech bubble thingie next to the forums is at "url(http://yourdomain.com/core/images/css/sprite_icons_vb.png)" However, note that it is a sprite, so it's not so easy to replace (take a look at the image file and you'll see what I mean). So, what I would do is create a new directory for your custom images, let's pretend it's images2/css and put the file there (icon1.png), so it's path would be http://yourdomain.com/core/images/css/icon1.png, and then write your own CSS for it, like:

.forum-list-container .forum-item .cell-forum .icon {  
background: url(http://yourdomain.com/core/images/css/icon1.png);
height: 30px;
width: 30px;
}

and enter that into the css_additional.css file. And then do the same for ".forum-list-container .forum-item.new .cell-forum .icon" and any others you want to change. You really will want to use firebug to help with this.

[hubbers]

Can you just edit the CSS directly? If yes, which css files and where? Will this cause any issues with the Style Manager?

[Wayne Luke]

CSS is stored in the Database like other templates. You can access them via Styles & Templates -> Style Manager. Click on the <<>> button on the far right to expand the template list for a style. We recommend you put your custom CSS in the css_additional.css template. This is loaded last and should override previous CSS declarations. This prevents problems when upgrading.

[hubbers]

CSS is stored in the Database like other templates. You can access them via Styles & Templates -> Style Manager. Click on the <<>> button on the far right to expand the template list for a style. We recommend you put your custom CSS in the css_additional.css template. This is loaded last and should override previous CSS declarations. This prevents problems when upgrading.

Great answer thanks.

[hubbers]

Restyling quickly from a blue theme to a green theme

Some more questions:

1. If I edit colors in Style Variable Editor will these be overwritten when I do an upgrade? I'm assuming not if the values are stored in the db.

2. What would be dead handy would be if someone had a list of all of the css styles for a each colour so that one loooooooong style could be added to the additional css that could be used to bulk swap each color ... I don't suppose someone has done this ...

3. In Style Variable Editor is there a way to bulk replace a particular RBG eg blue with another RGB eg green? Or do I have to go through line by line?

4. Where are the gradients stored? I would like to add a new gradient to replace the one in the basic template. Currently I can see two png files. One in images/ (I guess this is the one from the css) and the other in core/images/css. I could figure this out with a quick test but am not sure why there are two and under what circumstances each might be called.

[Mark.B]

1, If I edit colors in Style Variable Editor will these be overwritten when I do an upgrade? I'm assuming not if the values are stored in the db.

These are not overwritten in an upgrade.

2. What would be dead handy would be if someone had a list of all of the css styles for a each colour so that one loooooooong style could be added to the additional css that could be used to bulk swap each color ... I don't suppose someone has done this ...

No, there's no such list at this stage.

3. In Style Variable Editor is there a way to bulk replace a particular RBG eg blue with another RGB eg green? Or do I have to go through line by line?

Nope, line by line at the moment, sorry.

4. Where are the gradients stored? I would like to add a new gradient to replace the one in the basic template. Currently I can see two png files. One in images/ (I guess this is the one from the css) and the other in core/images/css. I could figure this out with a quick test but am not sure why there are two and under what circumstances each might be called.

They are in sprites:
/core/images/sprite_gradients.png
/core/images/sprite_gradients_vb.png
/core/images/gradients_vb_responsive.png