Forum Skins & Scripts

Scripts
One of the best parts of Proboards is that it supports scripts. These scripts can help you do all sorts of things. For example, the Neo-Reality Forums have a script that causes the "Hey, Kathrin, you have ___ messages, __ are unread" go under the top banner instead of to the right of it. Scripts generally just help your forum function better and they look nicer. Now, please note that the scripts on the following link are in no way owned by Neo-Reality, or in any way affiliated with out site. The owners do not allow these scripts to be redistributed so I can just give you the link to a Proboards Script Index. You can click on the name of the script that strikes your fancy and follow the instructions on that page.
Script Index. Let me repeat again that these scripts are not made by Neo-Reality and we do not claim any credit for them. They are property of the respective owners. There are all sorts of different scripts. Just skim through the index and choose those of your liking. You can always remove them later or add more at a later point.

Skins: About
"Skins" are also sometimes called "forum colors" or "forum layouts". The reason they are generally called skins is that a forum can have multiple skins and the users can choose which skin they would like to use to view the forum under. There is a default skin which automatically comes with your forum. This skin is, however, very ugly and quite plain. Therefor most forums make their own skins. You can join Neo-Reality forums. When you first join you will notice that the top banner is green. Go under profile. There you will find a drop down list of different skins that you have the ability to use. You can change it to Royal or Starry -- completely your choice! Now, as you can see if you did that (or as you know from forums you have been on) all the skins are completely different colors and the top banner is different as well. This sniffy little tutorial will show you how to code these skins. Making them is easy: Go to your graphic program, make a new image at least 500 pixels across (That's advised, you CAN make it smaller if you want) and whatever height. Make your top banner on there. You can use whatever strikes your fancy. Look at the Neo-Reality ones for examples. Most of the Neo-Reality ones are 500 by 300.

Advice before hand
Anyways, once you are done with the top banner & have uploaded it to a reliable host (we use photobucket.com) get ready to code. Here's my advice: Have 3 windows open. One your graphics program were you have the top banner image open, this tutorial and of course your forum. Something about finding the Hex color on your program:


Now, why is that important? Because later you will be needing lots of different colors and it looks a LOT (and I repeat a LOT) better if the colors match with your top banner. And they are guaranteed to match if they are the same colors. Hence lets say your looking for a light background color. Go to your top banner. First decide on a color scheme. Lets say its Pink. Then look for one of the lightest pinks in your image. Find out the hex color chart number for it and .. TA DA. Remember: when you are copying the numbers do NOT (and I repeat do NOT) copy the "#" with them. JUST the numbers/Letters. OK? Good..

The actual Coding
This tut is proving to be quite long.. Ah well, you made it this long I am sure you can hang in there a while longer. Go to your Forum, log in under "admin" and then go to admin. There you will find a button called "Skins / Forum Colors". Click on it. Read through the little paragraph. Not much in there that I haven't told you already. Anyhow, go to "Create Skin".
Now you are faced with a ray of options that are probably somewhat confusing to you if you've never seen em before. Don't worry.. I will guide through them step by step. Lets start from the top. You will need to think of a skin name. Preferably something that relates to your top banner (aka Neo-Reality Forum's version "star Struck" has a "starry" top banner), Then give in the URL of your top banner. All easy. I usually just leave the font field the way it is though if you want you can change it. If you didn't make background for your forum, you will need to make a color one. Choose a light color that matches your forum top banner (go to your graphics program and find the color code as mentioned before). Remember not to copy the "#". There has to be exactly 6 numbers/letters. Scroll down all the way to "window background 1:" and "window background 2:". There are the main colors of your forum. Go Here (Image provided courtesy of Proboards). See were "Window background color" is shown?. Its also the color that the background of your posts will have. If you want your font color to be dark, these 2 colors need to be light. Font color is light then these 2 need to be dark. The colors should be somewhat similar though not the same (Like 2 shades of light blue). If you want you can also make these colors the same. If they are the same, make the board highlight and the thread highlight both the same color; preferably lighter than the background color. Do the same even if they are not the same. The table border color should be black or something dark. This will form the borders of all your tables. Either make it black or a dark color. For example, if your color theme is red then make it a dark red. Scroll back up. Text color needs to be easily visible on your window background color. If you made the window background color light, the text should be dark and the other way around. I prefer a simple black text (000000). The link color: needs to also be easily visible on the window background color but should be different from the text color. If your text color is dark, use a dark link color as well. I like to use the same shade I used for the border (if I didn't use black) or just the darkest shade on my image in the correct color theme. Visited Links should be the same color. I make Active Links white (FFFFFF) or black (000000) (if my window background is light I use black and white if the window background is dark).
Just a little interrupt before we go on: there is no real way I can tell you want colors to use. This guide just roughly tells you what I tend to do. Obviously you may find that something entirely different works better for you. This method is used in coding all Neo-Reality Forum skins.
Back to the coding... Copy the color you chose as "background color" and scroll down to pop up window colors. Copy the background color into the space for background color. Copy the font color from the top as well and copy it into there as well. Scroll up about half way to News Background Color. Make it white (FFFFFF) or some other light color. News Text Color needs to be a normal color (lighter than the one you used for links though if you used a dark color & darker than your background color!). For the news title background color and the news title color: one needs to be light and one dark. Same goes for the Category Text color & Category background color, the Title Background color & The title text color. Don't make them all the same! Last but not least copy the Hex number you had for Title Background color (scroll down) into the one for the Pop up Window Colors and copy the Title Text color into the one for Pop up Window Colors: Title text color. Click Create skin

Afterword
Oh goodness, this tutorial was extremely annoying to make. There is no "right" or "wrong" in skin coding so all I could give you was basic advice.. The best tip I can give you is really to just go on your own forum and play around. That's the way I learned. Spend 30 minutes to an hour just changing different parts in your forum skin. You will soon figure out what works and what doesn't. Its best to learn from your mistake. This tutorial just offered you the rough guide lines. Each skin is different. In the beginning, it toke me up to half an hour to code a skin, now less than 10 minutes simply because I have done it several times before. If your still lost, join the Neo-Reality Forums and post a question there :).