SMF Theme Color Editor

[LindaHT]

We are a Paint Shop Pro Graphics Tagging forum.  We are running smf 2.0.2 core theme.  We are able to change headers but that is about all.  We only want to be able to change our colors to compliment our headers.  We do not know anything about coding or uploading ftp, dummies we are, lol.
I am attaching a for instance, with the blue we are stuck.  The one with yellow and green, I made that header for our blog, but it sure will not go with the blue.  We have our forum like we want it, just started up in August so we are good for now, if we could just get this color thing right.

Many thanks
Linda

[Boogalou99]

Wow LindaHT, nice header!!!

[Antechinus]

Ok, so you're good with graphics? Cool. The header background is an image set over a hex code, controlled by the catbg class:



The css is here, in index.css:

Code Select Expand

/* Generic, mostly color-related, classes.
------------------------------------------------------- */

.titlebg, .titlebg2, tr.titlebg td, tr.titlebg2 td
{
color: #000;
font-family: Verdana, Helvetica, sans-serif;
font-weight: bold;
background: url(../images/titlebg.jpg) #E9F0F6 repeat-x;
}
.catbg, .catbg2, tr.catbg td, tr.catbg2 td, tr.catbg th, tr.catbg2 th
{
color: #fff;
font-family: Verdana, Helvetica, sans-serif;
font-weight: bold;
background: url(../images/catbg.jpg) #88A6C0 repeat-x;
}
.catbg, .catbg2, tr.catbg td, tr.catbg2 td, tr.catbg th, tr.catbg2 th
{
background: url(../images/catbg2.jpg) #A1BFD9 repeat-x;
}

If you want to keep the gradient you'll have to change the image (keep the same name for the new one). If you want a flat colour there, just use a hex code. There are some re-coloured images already available, but they may not be suitable. You can grab them from inside the images folder of this old 1.1.x theme if you want to try them out: Default MultiColour

Do NOT try to install the whole theme on a 2.0.x site. It wont work. I've attached the green ones below.

You will probably also want to change the hex codes for these classes:

Code Select Expand

/* Alternating backgrounds for posts, and several other sections of the forum. */
.windowbg, #preview_body, .content, .roundframe
{
color: #000;
background-color: #ecedf3;
}
.windowbg2
{
color: #000;
background-color: #f6f6f6;
}
.windowbg3
{
color: #000;
background-color: #e0e1e8;
}

[LindaHT]

Ok, I was able to find the codes through admin area.  How would you go about installing the files?
The different color ones?

Thank you
LInda

[Antechinus]

Upload them via FTP.

[Deaks]

CyberAlien,

Have you seen the tool at the SMFHacks website? The link to it on their website is on their sidebar menu, and it is labeled "Theme Generator". You can work your way through it selecting the colors for all of the different parts of the page, along with supplying image filenames, and then it will generate a "style.css" file that you can apply to your forum.

If you haven't seen it you should check it out.

Boogalou99. that is only for 1.x themes not 2.0 themes

[Boogalou99]

Yes, I saw that, but I believe that they have plans on updating it. I hope so anyway.

[Deaks]

difference between them is this will work for any theme, theres only works for default theme

[Boogalou99]

I thought that the Style.css could be applied against any theme. I have a lot to learn. Thanks.

[Deaks]

no as people may change padding etc for the theme so using a new style.css from default will alter it.

[Boogalou99]

Thanks, and I am starting to see other things that could /would be changed. I have started learning about CSS, and I see that using a generator could really affect what you end up with versus what you started with. But at the same time, I am also seeing that if you are knowledgeable about CSS, you can control everything. Of course if you are knowledgeable enough, you don't need the use of a generator tool.

I know that I am quickly getting outside of the scope of this topic, but if anybody is interested in learning about CSS, I have found an online tutorial that I really like at hxxp:htmldog.com [nonactive].

[Karlosimovic]

 great  thank you 

[Angie on Dialysis]

Trying this out for the first time as I have loved a theme by harzem who has stopped making themes for free and I am moving over to 2.0.3

[leelondon]

I found this almost by accident while browsing the official SMF forums, and was surprised to see that someone had created a javascript site that enables click-n-pick color variations of the Curve theme! and a few variations of some other 5 themes as well. Although none compare to the professional customized works of Bloc, IMHO.

[S Mac]

Please somebody - how do I use this? I've changed the colour scheme to one that suits and downloaded it. What now? Help!

[Gary]

Once downloaded you install it.

Themes And Layout

[S Mac]

I know it seems like child's play to you lot...I'm obviously well out of my depth. I don't have the curve theme at the moment, so I should download it first? Is it the Adk Curve theme I need? Then I can download my chosen colour scheme? Sorry to be dumb, I'm a genius in other areas of my life. Honest.

[Chalky]

Nobody thinks you're dumb, none of us are born knowing this stuff, believe me 

Above, you said you had already downloaded a colour-changed theme from Colorizeit.  Which theme was that, out of interest?  You should now be able to install that theme on your forum the normal way, in Admin > Themes and Layout > Manage and Install Themes > Install a new theme from a file.  Navigate to the zip you downloaded from Colorizeit, upload to your forum, then proceed to install and see what it looks like 

Here's the relevant bit from the link Gary posted above.  I have scratched through the first bit since you downloaded your theme zip from Colorizeit and not the theme site:

From a file -- a theme archive file, such as can be found on the Simple Machines Theme Site
        Find a theme archive file in the Simple Machines Theme Site and download the file to your desktop. Be certain that this theme is compatible with your version of SMF. The version is also listed on the page where you downloaded the theme. Themes for 1.1.* will not work on 2.0.* and 2.0.* themes will not work on 1.1.*.
        Click the "Browse" button to the right of the "from a file" label.
        From the pop-up, navigate to the theme file (still compressed as a .zip or .tar.gz file) on your computer.
        Click Install and confirm if you want to install the theme in the popup
        Installation will take a few seconds. If all goes well, the installer will tell you that the theme "... was installed successfully."
        From your profile, select the theme, to test it.
        If you have any difficulties with the theme, switch back to the SMF default theme by using theme=1 in your query string (example: http://www.simplemachines.org/community/index.php?theme=1)

Edit:  Oh and for info, Curve is the name of the default theme that comes with SMF v2.  It shows under your installed themes as "default" hence the confusion 

[S Mac]

Thanks OK, currently I have pink art installed. I went to Colourize it and picked the Curve theme and fiddled with the colours, then downloaded it. So this will change the theme and colours on my forum if I install it? I just thought I'd have to install the right theme in my forum first, if you know what I mean. Just don't want to screw up my forum (yes, I at least had the wits to save it first!)

[Chalky]

Yes you should just be able to install the theme you just downloaded independently of any themes you already have.  Hang on one sec, I'm going to install one from there on my test site