The new methods of forum display... We already said they were much better than the old ways, right? They also offer much more control to admins over forums. Before you customize your forum with CSS, you probably should learn a bit about CSS (Cascading Style Sheets/Style Sheets--they are the same thing). You can type in, style sheet tutorials, into your favorite search engine to find some pages to learn, and read on for a bit of help.

Style Sheets allow a webpage to have a bit of information at the top of the page which controls various aspects of a page's looks. For instance, you can set the page's font size, border width, colors, etc. Also, CSS allows control over the individual properties of certain types of items on a page--for example, if you wanted to you could adjust only the settings for all the bold text on the page, or you could set a background image for all the tables.

Furthermore, CSS allows you to give some names to the settings so they can be individually referred to later on. For instance, if you call one setting a, and make it to be black text on a white background, later, in whatever areas of the page, in the HTML tags itself, you could put class=a and that area would make the text black on white.

The previous paragraph gives an example of the way we used CSS with VoyForums. If we were to set a font/color for the text in the message tables (for table-format forums), that code/html to change the font/color would have to be repeated in every table, and actually in every cell of every table. Using CSS, we can place the settings one time, in the style-sheet included at the top of the page, and this can provide global settings for the rest of the page.

While VoyForums has used CSS in a way that the TABLES must "refer back" to the CSS entries, by name, there is nothing to prevent you from making your own global changes to your page. For example, you could make all links of a different font size, if you so wished, by placing A { font-size: 10pt } in your CSS settings.

Now, it was not only our job to figure out how to implement this new method, but also to somehow convert the old forum settings to the new. This was no easy feat! However, we managed to do a relatively good job--the complication comes in in two cases:

Some issues might not have been accounted for:
This is most likely because we had very little support from beta-testers. However, we would like to give credit to those who have offered their time, hands, thoughts, and feedback in testing this new software. Their testing has revealed many bugs which may have slipped through our own testing.

To assist admins after the conversion, we kept the old values of the display of forums so that admins can refer back to them if needed for reference purposes. These options are available in a single textbox down at the bottom of the CSS, Tables, & Borders configuration area.

Examples: How to handle some design tasks with the new version:
(You should read the Warnings and Recommendations section (below) as well.

1. First, try the themes: This is one of the easiest ways to set a look and see how we handled it. You may not feel our examples are perfectly suited for your forum, so feel free to customize it. If you think you've made an improvement to our method, send us a note to let us know.
2. Font and background colors of the Table-formats:

   Prior to this version, VoyForums had to output a lot of extra code in a webpage in some cases. This was especially true for forums using the Table Format. The new version provides a solution to this problem by allowing the use of CSS. With CSS, you place your settings in one area, or choose a theme to do it for you, and it handles settings globally. Even if there are numerous CSS entries, the new method means they do not need to be repeated for every message in a page, but placed one time using the proper method into the CSS option--consequently, the CSS settings are displayed at the top of the HTML output for a forum and should be invisible to any viewer unless they look at the HTML itself..

   Here is an example. Maybe we want the "Subject, Author, etc." of each message (in a forum set to the table-format) to be a different color from the messages themselves. What VoyForums does is it gives each of these locations a name, then provides the settings for that name via the CSS entry.

   This is how it's done. Because the subject, author, etc. will each use the same settings in this example, we can give them one name. Let's call them "msghead". We place this name (without quotes) into the options in the Admin Menu -> CSS, tables, borders -> Location-specific settings section in the proper locations for the Subject, Author, ... Make sure to put the word msghead into each location you want to control.

   Once that is done, when VoyForums displays your forum's page, it includes this name in the HTML for each location in which you placed "msghead". But we're not done yet. Now we must handle the actual settings for the color, etc.

   To handle this, we must make our own CSS entry for the "msghead" areas. To do this, we simply put a period "." before the name, and put the CSS settings after it, enclosed in curly-braces "{}". For white on black text, our entry might look something like this:

   .msghead { background-color:#000000; color:#ffffff }

   The ; (semi-colon) is used to separate the individual settings, and the #xxxxxx's are the "Hexadecimal" values for the Red, Green, and Blue of the color--the first 2 digits are Red, the next Green, the next Blue, and are sometimes shown as RRGGBB. If you don't know what hexadecimal is, you might want to go to your favorite search engine and type in something like: web color codes hexadecimal.

   For each unique name you use in the Admin Menu -> CSS, tables, borders -> Location-specific settings, you should create a CSS entry in the format of ".name { settings }".

   CSS can be kind of complicated for several reasons. For one, the settings are not standard among all web-browsers. This means you might use something which works with one browser, but not another.

2. Second, the settings in CSS are not standard. Each browser might handle a setting differently, and some settings are usable with some browsers, but not in others. We recommend to stick with the simple common settings. For advanced users, we recommend using the common settings, and taking consideration with the non-standard settings in order to implement them in such a manner that the page will still be readable by users of all browsers.

3. Use short names in your "CSS -> Location-specific settings". Each of these names must be repeated over and over in your forum's output HTML. We have a limit of 3 characters for these names, and you can try a Theme to see what we did. This means our above example which says "msghead" is not valid for actual use, but was for the simplicity of the lesson. Try something like "mhd" instead.