Guide to Coding

## Welcome

Hello, I'm OpenThought and this a guide to coding for everyone here who is new to coding pages. Now let's get started with a basic way to make a page:

## Making a Page

Making a page can be hard. Look at the slideshow below to understand how:

* Look up and try and find the button titled add. It is close to the number of pages. Click add.
* This should show up. Write down what you want your page to be called.
* This should show up. Write something like 'Currently editing' or 'WIP'.
* After don't click cancel but the other button. Try and find this.
* Once you have, click the arrow and then classic editor
* This should show up. Click source and your good to go.
1/6
## Borders

There one of the things that can make a page look intresting.

Let's start off with your standard border shall we? Copy and paste the one shown below:

```
<div style="border:2px grey solid;text-align:center;padding:20px">
```

Here is the same yet rounded:

```
<div style="border:2px black solid;text-align:center;padding:20px;border-radius:40px;">
```

### Square

Now these are just the basic borders. They will come in handy when making a page anyways, let's move on to some more complex shall we?

```
<div style="border:10px Whit ridge;text-align:center;padding:20px">
```

```
<div style="border:2px silver dashed;text-align:center;padding:20px">
```

```
<div style="box-shadow:inset 0px 0px 60px GoldenRod;text-align:center;padding:20px">
```

```
<div style="border:10px Peru outset;text-align:center;padding:20px">
```

### Making Borders Round

Yes, you can make borders round in just 2 simple and easy steps.

1. Find

```
;padding:20px">
```

in the border's coding.

2. Copy and paste

```
;border-radius:40px;
```

just before the "
Simple as anything!

## Minipulating Text

Alot of people like to code. Learning how to minipulate text can really help in making a good page.

### Centering

Centering is great with making pages. Wanna know how to do it? Well it's simple! It's just
```
<center>
```

To end a centered thing, add a / after <. How easy!

### Text Size

This text is easily much bigger

then normal

Here is ze code:

```
<font size=5>Text here</font>
```

Change the five to your preferred size.

### Fonts

Alrighty, let's get into the stuff that can make your page
Fancy

Before we start, I need to say a disclaimer

!DISCLAIMER!

If a font shows up as Times New Roman, that may mean your computer is not compatible with the font.

Now here is the code for a font:

```
<span style="font-family: La Font Name">Your text here</span>
```

List of Fonts

Helvetica

Times

Times New Roman

Courier

Courier New

Verdana

Georgia

Garamond

Paltino

Bookman

Comic Sans MS

Trebuchet MS

Arial Black

Impact

Century Gothic

Centaur

Candara

Lucida Handwriting

Zapfino

### Coloured Text

Wanna get coloured text like this?

Well, copy and paste below!

```
<font color=le colour>TEXT HERe</font>
```

## Tables

Soooooo you've gotten half you page done and you wanna move onto tables. Welp, let's start with Definition Tables. Oooooo how fancy.

### Definition Tables

About the rank

About the rank

```
{| class="article-table" style="margin: 10px auto; width: 300px; height: 100px;border: 6px solid black;color:white"
'''Rank name'''
About the rank
</div>
About the rank
</div>

```

Alrighty, now let's get to some other tables

### Member Tables

```
{| class="article-table" border="2" cellpadding="1" cellspacing="1" style="margin: 0px auto; width: 200px; height: 10px; border:4px inset black;"

```

### Infomation tables

Sometime that can be seen at the top of a page. Like this:

 Founder/s
 Founded
 Current Leader
 Status
 Realm
 Species
 Camp
 Names
 Theme song

```
{| class="box" style="float:center; width:260px; font-size: 70%; background-color:Black; Border-radius:3px; border: 9px DarkGrey solid" cellspacing="1" cellpadding="5" align="center"
! style="background-color:DarkGrey;color:Black;text-align:center;"|Founder/s
! style="background-color:Black;color:DarkGrey;text-align:center;"|Text
! style="background-color:Black;color:DarkGrey;text-align:center;"|Founded
Text
! style="background-color:DarkGrey;color:Black;text-align:center;"|Current Leader
! style="background-color:Black;color:DarkGrey;text-align:center;"|Text
! style="background-color:Black;color:DarkGrey;text-align:center;"|Status
! style="background-color:DarkGrey;color:Black;text-align:center;"|Text
! style="background-color:DarkGrey;color:Black;text-align:center;"|Realm
! style="background-color:Black;color:DarkGrey;text-align:center;"|Text
! style="background-color:Black;color:DarkGrey;text-align:center;"|Species
! style="background-color:DarkGrey;color:Black;text-align:center;"|Text
! style="background-color:DarkGrey;color:Black;text-align:center;"|Camp
! style="background-color:Black;color:DarkGrey;text-align:center;"|Text
! style="background-color:Black;color:DarkGrey;text-align:center;"|Names
! style="background-color:DarkGrey;color:Black;text-align:center;"|Text
! style="background-color:DarkGrey;color:Black;text-align:center;"|Theme song
Text

```

## Scrolling text

Scroll

Down

To

See

The

Code

```
<div style="overflow: hidden; height: 250px; width: 450px; border: 0px none; margin-center: 0px; border-radius: 0px;color:none;overflow-y: scroll">
</div>

```