Nova's Guide To Coding!

In this small written guide, I will be going over some basics of coding for all those people out there that want to jazz up some of their posts or other threads. For those that are looking at this, and ask "what does coding do?" I will show you an example!


That link takes you to my personal character page for Syrius. There, you will see a dark background, some interesting manipulation for character relationships, and some fancy font.

All of this is achievable through coding!

Now, I do not expect you to read this guide and be able to fashion yourself up something like this, but I can at least give you an intro on coding. With this insight, you should be able to pick up any posting template from a resource site and implement it for your use.

Some quick info and tips!

• There is a wide array of resource sites and not every template you pick up will be forumotion compatible. I will get to WHY in a little bit.
  
• If you use a provided resource, be sure to credit the original owner/creator by leaving their credit link intact. This serves as gratitude for letting you tinker around with their coding.
  
• Never ever remove someone's credit and claim it as your own. Just don't.
  

With that, Lets begin with Lesson Number 1! Please keep in mind this is a self maintained guide and I will likely update it frequently. Maybe... Depends if ya'll like it.

---

Forumotion, Proboards, and Jcink are the big three Shōnen of Rping. There is not many forum based RP's on any other hosting sites, so we will only be addressing these three here.

Anyways, these three forum hosts... all use different versions of coding within posts. Proboards uses a unique style of BBC coding and in recent V5 introduced the Newclass Tag; Jcink uses HTML alone; and Forumotion uses a mixture of HTML and BBC Code.

Most of you are familiar with the way normal BBC code works, but I will go through and explain the concept of HTML considering this is a forumotion site.


Html, or Hypertext Markup Language, is the primary language used to make up and design web pages. This includes all kids of web pages! Between this forum host, to tumblr, to small business pages, you name it.

Html is a system designed around the function of 'Tags' and text files to achieve a particular design such as color, size, font, etc.

The basic breakdown of Html is:


The property is the item you are trying to create/change, and the description is the WAY you are performing that change or creation. Some simple examples are.

font-weight: bold
font-style: italic
font-family: georgia
font-size: 10px
font-variant: small-caps

So you may be asking, well how do I know what kinds of properties there are? And how do you know what description to write in?

To be honest, you don't. I am not asking you to memorize this difficult language, but there are plenty of resources out there to give you ideas. I, myself, still have to look up certain properties to achieve something.

You can find a easy to navigate resource site of HTML HERE


Unfortunately it is not as easy as just typing


into your posts. You have to actually specify in the editor that you want to bold your font. This is where 'Tags' come in.

Dun Dun Dun... The DIV tag.

This is the bread to your html sandwich, meaning that there is opening and closing tags.

Code:

<div> </div>

Just like with normal BBC code, where you have...

Code:

[b] [/b] or [spoiler] [/spoiler]

Html uses the slanted bracket DIV tag along with the property:description to tell the browser what you want to change. And example...

Code:

<div style="font-family:georgia; font-weight:bold;"> PLAIN TEXT </div>

That code there, turns the 'PLAIN TEXT' bold, and in georgia font.

This syntax is what you will always use. In this format, you called 3 properties. You can call as many as you'd like in one DIV tag but you always have to remember that...

• The div must always have an opening and closing bracket
  
• The html must always be inside quotation marks
  
• Put the html in one line only
  
• Always put a semi-colon ( ; ) after the description
  
• You must close the entire div with a backslash div to tell the browser to stop making the html true.
  

As long as you copy paste the syntax given exactly as it is, you'll be fine. If the code doesn't work, go back to the list above to check if you accidentally erased or added something else.