Guide to Coding (Credit: Fubsy)

Update Log

Any suggestions of what to add to the guide are heavily appreciated! Please send them here if you would like.

## **Accessing Source Mode:**

### **Source Mode in Classic Editor**

File:Screen Shot 2016-11-02 at 8.24.20 PM.png
1. Start by clicking on the arrow of the "Edit" button in the top left corner of an article.

File:Screen Shot 2016-11-02 at 8.24.27 PM.png
2. Select "Classic Editor" from the options that will appear.

File:Screen Shot 2016-11-02 at 8.24.42 PM.png
3.In the top right corner, you'll see "Source", click this and it will automatically switch to this mode. To switch back to Visual, simply click the "Visual" next to it. Sometimes, if your page is heavily coded, you may be taken directly to Source Mode.

### **Source Mode in Visual Editor**

File:Screen Shot 2016-11-02 at 8.30.46 PM.png
1. Click the "Edit" button in the top left corner of an article.

File:Screen Shot 2016-11-02 at 8.30.58 PM.png
2. Select the button shown above located in the top right next to the "Save" and "Cancel" buttons.

File:Screen Shot 2016-11-02 at 8.31.13 PM.png
3. Select "Source Mode" from the list of options that will appear. That's all there is to it!

### **Editing Comments and Threads in Source Mode**

Believe it or not, you can also edit comments as though you were to edit any page, although excessively coding every comment is not recommended and highly discouraged.

To enter Source Mode simply click this button in the bottom left corner of the comment:

 File:Screen Shot 2016-11-02 at 10.50.30 AM.png
That's all there is to it! To return to the Visual Editor simply click the button with an eye on it next to it!

## **Important Things to Note About Coding**

1. All coding is done in source mode.
2. Coding is easy to mess up, considering all extra symbols/format of the code counts towards it functioning.
3. Considering that most coding is taken from a source, if you mess up, don't get frustrated! Just start over with the original code, and try again.
4. Although you shouldn't take somebody's exact coding without their permission, it's okay to take it and edit it or change something, such as the colors, to make it your own. That's not stealing coding, it's repurposing it.
5. Before contributing, you should read the **Policy** and **Editing Guidelines** if you haven't.

## **Keeping Coding Simple**

Ever been stuck in source mode because your coding is too complex? Although with some types of coding, this is inevitable, this can be very easily avoided if you just simplify your coding.

### **Understanding Tag Elements**

There is no need to code each line of text individually. By understanding tags, you can limit the amount of formatting you need to do on your pages.

#### **<div>**

All hail <div>.

No, really. This little tag is going to make your life so much easier, if you use it correctly. <div> is meant to apply code to **div**isions. This means, it will apply the code you add to it to everything below it until you close it off with a . Of course, this can get a little confusing if you use <div> every time you want to code a single line of text, it should be saved for when you want to code a section of the page, as there is a different tag for that.

#### **<span>**

<span>, a tag of select talents but of great use.

<span> is used to code one line of text specifically. I like to remember it as something that **spans** over one line. It's great for formatting titles and such for your pages. It's kind of like the more personal version of <div>, a tag that thinks about specific lines of code more than the overall picture.

#### **<p>**

Ah, the notorious <p>.

Many pages are absolutely riddled with <p>.<p> is your "friend" with a bad influence. Commonly, it will seemingly "appear on pages by itself", and that's because sometimes it does through automated functions, usually because people use <p> and then don't close it with a

 (and then <p> spreads across your page's code like the plague). It pretty much is a weirder version of <span> that codes **p**aragraphs and is less reliable and more likely to mess itself up. It's probably better to avoid <p> and stick with <span> and <div>.

### **Keeping Your Coding Functional**

Of course things like images aren't going to majorly contribute to the disruption and complexion of code, but commonly on AJCW there are many overly-complex coding elements without any particular function, and are kind of just there. Here are some questions to ask yourself when trying to make a simply coded page.

1. Are all aspects of the coding functional?
2. Is any aspect too bright, overwhelming, or distracting from the rest of the content?
3. Am I prioritizing code over page content?

## **Types of Pages**

**Article** = Any page created that doesn't qualify as one of the below. Create  here.

**User Page** = Pages that have User:(Username) at the beginning. Do not count as articles. They are created in the same way as articles, but with the information stated previously,  here.

**Sub-Page** = A page that links to another page, and is created to do so, almost like a page inside a page. For example, User:FunkySunky/Sandbox, is a sub-page of User:FunkySunky. The sub-page of the user page, is also considered a user page. Another example, would be a sub-page such as DarkClan/Religion, and since DarkClan is an article, DarkClan/Religion would be considered one as well. Sub-pages are often used by groups to describe information about them not on their main page, and this is how such should be formatted.

**Blog Posts** = Blog posts are pages that will appear under your "blog" section aka User blog:Template:Username. They can be made  here.

**Templates** = See  Templates Section. You can create a template by creating a page titled "Template:Template Name Here". Please do not create any templates that are not intended for personal use, but use by the wiki (ex: a "WIP template" or a "Swearing template") without permission from a staff member.

## **Text Formatting**

### **Centering**

Centered Text

```
<center>Text Here</center>
```

### **Font Size**

#### **Using <font size>**

Maximum size using this method is 7.

Text Here

```
<font size="5"> Text Here </font>
```

#### **Using <span>**

Text Here

```
<span style="font-size:15pt"> Text Here </span>
```

#### **Using <big>**

(Makes the font a set larger size)

 Text Here

```
<big> Text Here </big>
```

#### **Using <small>**

(Makes the font a set smaller size)

 Text Here

```
<small> Text Here </small>
```

### **Font Families**

#### **Font Family Code**

Text Here

```
<span style="font-family: FONT HERE">Text Here</span>
```

#### **Font Family List**

Some fonts are only visible from certain computers, any font that appears as Times New Roman, that isn't it of course, is not compatible with your computer. Not all fonts may be listed here as well.

### **Font Color**

#### **Font Color Code**

Text Here

* <font color="white"> Text Here </font>

#### **HTML Colors**

For even more colors use an HTML Color Code, which consists of a # and 6 numbers, for example, #FFFFFF (White). You can make HTML Color Codes here:

http://htmlcolorcodes.com

Or get HTML Color Codes from an existing image: http://html-color-codes.info/colors-from-image/

### **Basic Font Formatting**

#### **Bold**

**Bold Text**

```
'''Bold Text'''
```

#### **Italicized**

*Italicized Text*

```
''Italicized Text''
```

#### **Bold + Italicized**

***Italicized Bold Text***

```
'''''Italicized Bold Text'''''
```

#### **Superscript**

The text shown is Superscript

```
<sup>Superscript</sup>
```

#### **Subscript**

The text shown is Subscript

```
<sub>Subscript</sub>
```

#### **Striked**

This is ~~Striked Text~~

```

striked text

```

#### **Underlined**

This is Underlined Text

```
<u>Underlined Text</u>
```

### **Showing/Hiding Text**

#### **Preformatted Text**

Any text that is preformatted will show up in a scrolling bar as raw text, including coding.

```
Preformatted Text
```

<pre>Preformatted Text

#### **Hidden Text**

```
<!-- This will only show up in editing mode-->
```

```
Using this means you will be unable to edit your page from visual mode in classic editor.

```

#### **Using <nowiki>**

<nowiki> can be used to show coding in visual mode. Any code by <nowiki> will appear as text.

<span style="color:red">nowiki is useful for coding guides

```
<span style="color:red">nowiki is useful for coding guides
```

#### **Opacity**

Opacity refers to the transparency of something. The opacity code can also be used on backgrounds, borders, etc. It is expressed through a number between 0 and 1. Think: 50% of 1 = 0.5; therefore, 0.5 = 50% visible.

This is completely visible.

This is only half-visible.

This is invisible.

```
<span style="opacity:1">This is completely visible.
```

```
<span style="opacity:0.5">This is only half-visible.</span>
```

```
<span style="opacity:0">This is invisible.</span>
```

### **Complex Text Formatting**

#### **Text Shadow**

Text Here

```
<span style="text-shadow: cyan 0 3px 3px;">Text Here</span>
```

#### **Highlighted Text**

Text Here

```
<span style="box-shadow: inset 0 0 100px yellow;">Text Here</span>
```

## **Images**

Basic file format in Source Mode:

[[File:Untitled\_Artwork-3\_12.04.32\_AM.png]]

### **Using Art and Copyrighted Photos**

Art that is drawn by someone else can only be used with proper credit and permission. This doesn't just mean saying "credit to the artist", you must credit them and ASK them for permission for them to be used on your articles unless it is explicitly stated that it is free to use.

You can easily filter these images on Google Images by clicking "Tools" and then "Permission Rights". Any image that is listed as "Free for noncommercial reuse" or "Free for reuse" are free game. There are also websites that do this for you, a personal favorite being photosforclass.com.

For more information, see this chart:

 File:Copyright diagram made by EliteNinjaWarrior.png
### **File Size**

File:Untitled Artwork-3 12.04.32 AM.png

```
[[File:Untitled_Artwork-3_12.04.32_AM.png|200px]]
```

File:Untitled Artwork-3 12.04.32 AM.png

```
[[File:Untitled_Artwork-3_12.04.32_AM.png|100px]]
```

### Captions

**Visible Caption**

 File:Untitled Artwork-3 12.04.32 AM.png

```
[[File:Untitled_Artwork-3_12.04.32_AM.png|thumb|Caption]]
```

**Hidden Caption**

Caption

```
[[File:Untitled_Artwork-3_12.04.32_AM.png|Caption]]
```

Place your mouse over the picture and wait to see the caption!

### **File Alignment**

**Center**

File:Untitled Artwork-3 12.04.32 AM.png

```
[[File:Untitled_Artwork-3_12.04.32_AM.png|center]]
```

**Right**

File:Untitled Artwork-3 12.04.32 AM.png

```
[[File:Untitled_Artwork-3_12.04.32_AM.png|right]]
```

File:Untitled Artwork-3 12.04.32 AM.png

**Left**

```
[[File:Untitled_Artwork-3_12.04.32_AM.png|left]]
```

### **Image Galleries**

#### **Default Gallery**

Lil Bird Fam CUTIES.pngCaptionLil Makani.pngCaptionLil chubster.pngCaption

```
<gallery position="center">
Lil Bird Fam CUTIES.png|Caption
Lil Makani.png|Caption
Lil chubster.png|Caption
</gallery>

```

If you don't want a gallery to be centered simply remove the position="center" from the code, or change it to right or left.

#### **Slideshow**

* Lil Bird Fam CUTIES.pngCaption
* Lil Makani.pngCaption
* Lil chubster.pngCaption
1/3

```
<gallery type="slideshow" position="center">
Lil Bird Fam CUTIES.png|Caption
Lil Makani.png|Caption
Lil chubster.png|Caption
</gallery>

```

If you don't want a gallery to be centered simply remove the position="center" from the code, or change it to right or left.

#### **Sliders**

**Type 1**

```
<gallery type="slider">
Lil Bird Fam CUTIES.png|Caption|linktext=Description
Lil Makani.png|Caption|linktext=Description
Lil chubster.png|Caption|linktext=Description
</gallery>

```

**Type 2**

```
<gallery type="slider" orientation="right">
Lil Bird Fam CUTIES.png|Caption|linktext=Description
Lil Makani.png|Caption|linktext=Description
Lil chubster.png|Caption|linktext=Description
</gallery>

```

#### **Customizing Galleries**

Lil Bird Fam CUTIES.pngCaptionLil Makani.pngCaptionLil chubster.pngCaption

```
<gallery captiontextcolor="COLOR" captionalign="CENTER/LEFT/RIGHT" bordercolor="COLOR" bordersize="LARGE/MEDIUM/SMALL" position="center">
Lil Bird Fam CUTIES.png|Caption
Lil Makani.png|Caption
Lil chubster.png|Caption
</gallery>

```

## **Audio and Media Players**

### **Soundcloud (Audio Player)**

Although soundcloud is allowed anywhere on the wiki, autoplay, which causes the soundcloud to automatically start when a page is viewed, is banned across AJCW.

```
<soundcloud url="https://soundcloud.com/ice-requiem/hatoful-boyfriend-nagekis-end" height="20" width="20" />
```

```
<soundcloud url="https://soundcloud.com/ice-requiem/hatoful-boyfriend-nagekis-end" height="20"></soundcloud>
```

```
<soundcloud url="https://soundcloud.com/ice-requiem/hatoful-boyfriend-nagekis-end" height="60"></soundcloud>
```

```
<soundcloud url="https://soundcloud.com/ice-requiem/hatoful-boyfriend-nagekis-end" height="100"></soundcloud>
```

#### **Colored Soundcloud**

```
<soundcloud url="https://soundcloud.com/lucarizzomusic/pokemon-mystery-dungeon-ost-sky-tower-re-arranged-by-luca-rizzo" color="#FA5882" height="20" width="21"></soundcloud>
```

The color MUST be an HTML Code. It will not work otherwise.

### **Videos (Media Player)**

Press this button:

File:Screen Shot 2017-01-02 at 11.06.27 PM.png

How it looks in Classic Editor, where it can be located to the right in the "Add features and media" section.

File:Screen Shot 2017-01-02 at 11.07.57 PM.png

How it looks in Visual Editor, where it can be located in the bar shown in the top left corner.

It's self-explanatory from there, but by the end of it you will have a video like this:

 File:Meguru Hakoniwa by SENTIVE (Nageki's Ending) - Hatoful Boyfriend Soundtrack
## **Links**

Linking consists of **[[Link|Text Displayed]]** which would then show up as **Text Displayed**. For example, **[[User:FunkySunky|Linked Text Here]]**.

### **Images that Link**

To keep an image from redirecting to the file page/source, you can insert "link=" without an actual redirection itself

Usually images look like this in source mode: [[File:Lil parfae.png]].

To link something to a picture, simply do this:
[[File:Lil parfae.png|link=linkhere]]. It should turn out like this:

[[File:Lil parfae.png|link=User:Fubsy]]

File:Lil parfae.png
Try clicking on it, it will take you to User:Fubsy!

### **Customizing Links**

Links will display like this, as mentioned earlier:
[[Link|Text Displayed]]

But what if you wanted to make the Text Displayed a different color, font, size, etc? That's quite simple:

[[Link|<span style="color: white"><span style="font-family: georgia">Text Displayed</span></span>]]

Text Displayed

## **Positioning**

Positioning is setting certain elements to act a specific way or stay in a specific place. The code commonly looks something like this:

```
<div style="position: style; bottom: 10px; left: 10px; overflow:visible/invisible">
```

Bottom and left can be replaced with top and right respectively. The larger the number (coordinates) on left, the more to the right it is. The larger the number on bottom, the farther up it is.

Overflow can be set to visible or invisible. When it is set to visible, nothing will be hidden. If it is assigned a width and a height, and the overflow is set to invisible, anything pixels that pass the set height/width pixel (px) limit will be hidden.

### **Fixed**

Anything that is fixed in a certain position will remain in the coordinates it is assigned no matter what, and will be visible even as you scroll through the page. See the bird to the left for an example. It is fixed to the bottom left.

File:Ousama3.png

```
<div style="position: fixed; bottom: 60px; left: 10px; overflow:visible;" class="overlay">[[File:Ousama3.png|100px]]</div>
```

### **Absolute**

Similar to fixed positioning, anything that is positioned to be absolute will remain in the coordinates it is assigned no matter what. However, if the positioning is absolute it will not be visible when scrolling, it won't follow essentially.

```
<div style="position: absolute; top: 60px; left: 10px;overflow:visible">text or whatever</div>
```

### **Relative**

Relative positioning positions objects not starting from the top left of the page like Fixed or Absolute does, but from the line they are placed on in the coding. It's useful for small tweaks and adjustments.

text or whatever

```
<div style="position: relative; bottom: 10px; left: 20px;overflow:visible">text or whatever</div>
```

## **Design Elements**

### **Backgrounds**

Keep in mind backgrounds are not allowed on articles or article sub-pages.

#### **Gradient Backgrounds**

Rounded Borderless Gradient Background
```
<div style="background: INVISIBLE COLOR; background-image:linear-gradient(to bottom, COLOR 1, COLOR 2, COLOR 3, COLOR 4); border: 5px; color: FONT COLOR;-webkit-border-radius: 50px; padding: 10px;">TEXT</div>
```

Gradient Borderless Background

```
<div style="background: white; background-image:linear-gradient(to bottom, #FFC5C5,#D4E3E5, #EDCDF2); border: 5px; color: #112A53">TEXT</div>
```

##### **Gradients**

Linear Gradient (To Bottom)

Linear Gradient (To Top)

Linear Gradient (To Left)

Linear Gradient (To Right)

Radial Gradient

#### **Solid Backgrounds**

Borderless Solid Background

```
<div style="background: #D4E3E5>TEXT</div>
```

Borderless Rounded Solid Background

```
<div style="background: #E28F8E;-webkit-border-radius: 50px; padding: 10px;">TEXT</div>
```

Solid Background with Border

```
<div style="background: lemonchiffon;border:1.5px solid black>TEXT</div>
```

```
<div style="background: #D4E3E5>TEXT</div>
```

Rounded Solid Background with Border

```
<div style="background: #E28F8E;-webkit-border-radius: 50px; padding: 10px;border:1.5px solid black">
```

### **Borders**

Keep in mind the four border of 25px total limit on articles. Box shadows do not add to the limit if they are included in the border code.

Rounded Border

```
<div style="border: 7px double white; -moz-border-radius: 0px; -webkit-border-radius: 10px; border-radius: 10px;">TEXT</div>
```

Border

```
<div style="border:5px solid black;">TEXT</div>
```

Box Shadow
```
<div style="background-color: none; padding: 30px; border: none;margin: 3px;box-shadow: inset 0 0 50px azure;">
TEXT</div>
```

Rounded Box Shadow
```
<div style="background-color: none; padding: 30px; border: none;margin: 3px; -webkit-border-radius: 10px; border-radius: 10px; box-shadow: inset 0 0 50px lavenderblush">
TEXT</div>
```

#### **Border Styles**

Solid

```
<div style="border:5px solid rosybrown;">Solid</div>
```

Double

```
<div style="border:5px double skyblue;">Double</div>
```

Dashed

```
<div style="border:5px dashed lightgreen;">Dashed</div>
```

Dotted

```
<div style="border:5px dotted mistyrose;">Dotted</div>
```

Groove

```
<div style="border:10px groove linen;">Groove</div>
```

Inset

```
<div style="border:10px inset snow;">
Inset (Lighter color on the bottom.)
</div>
```

Outset (Lighter color on the top.)

```
<div style="border:10px outset peru;">Outset</div>
```

### **Tabbers**

* Title Text Here
* Title Text Here

Text

Text

```
<tabber>
Text
Text
</tabber><br>

```

### **Collapsibles**

```
{| class="mw-collapsible mw-collapsed" style=width:85%; align:center;"
Text
```

### **Scrolling Text**

Borders and backgrounds can be added into the code to make a scrolling box.

#### **Up/Down (Y-Axis)**

This must have a height in the code to work.

(Try Scrolling!)

This

text

will

scroll

across

the

y-axis

pretty nice

huh

```
<div style="overflow: hidden; margin-center: 300px; overflow-y:scroll; height:100px">This text will scroll</div>
```

#### **Left/Right (X-Axis)**

This must have a width in the code to work

(Try Scrolling!) This text will definitely scroll across the x-axis!

```
<div style="overflow: hidden;width:20px; margin-center: 300px;overflow-x: scroll">
This text will scroll</div>
```

### **Tables**

#### **Tables with Coded Cells**

 an

```
{| class="article-table" border="2" style="margin: 0px auto; width: 200px; height: 200px; border:6px double brown;"
! scope="row" style="font-family:center;border-color:brown;text-align:center;background-color: chocolate;"|This
! scope="row" style="font-family:center;border-color:rgb(0,0,0);text-align:center;background-color: orange;"|an
example

```

#### **Invisible Table**

 Text here

```
! scope="col" |Title
! scope="col" |Title
```

#### **Centered Default Table**

 Text

```
{| border="0" cellpadding="1" cellspacing="1" class="article-table" style="margin: 0px auto; width: 500px;"
! scope="col"|Title Here
! scope="col"|Title Here
```

### **Buttons**

 Linked Text Here

```
<span class="wikia-single-button">[[User:Fubsy/AJCWikBEE| <font color="white">Linked Text Here</font>]]</span>
```

### **Display Titles**

It is recommended yet not required that you do not use these on regular articles.

This will appear at the top of the page on as the title on articles. On user pages, it is what the tab will say when viewed from a different one.

```
{{DISPLAYTITLE:This is a Display Title}}
```

### **Hiding the Table of Contents**

Simply paste this:

\_\_NOTOC\_\_

anywhere on the page. Then the TOC will not show up.

### **Positioning the Table of Contents**

Simply paste this:

\_\_TOC\_\_

where you want the TOC to appear.

### **Removing the Edit Symbol Next to Titles**

Simply paste this:

\_\_NOEDITSECTION\_\_

and File:Screen Shot 2017-01-02 at 11.01.45 PM.png will not appear.

### **Polls**

**If the guide was missing what you needed, please contact  Fubsy about it, so it can be added.**

```
<poll>
Is this helpful?
Yes!
No!
Could be more specific.
Was missing what I needed.
</poll>
```

### **Lines**

Above is a line. Below is the code for it.

## **Categories**

### **Adding Categories**

Adding Categories is easy! Simply use this code:

[[Category:CATEGORY NAME]]

OR

Enter categories into the section shown in the side-bar of Classic Editing mode.
File:Screen Shot 2017-01-02 at 11.14.58 PM.png

### **Important Aspects Concerning Categories**

1. Categories are case-sensitive (Ex: Packs ≠ packs)

1. You should not be creating new categories without consent and permission from the staff.

1. Only articles should be categorized. User pages, blog posts, etc. should not be categorized.

1. You should always try to PROPERLY categorize your pages! Don't just throw categories onto it, try and follow the guidelines and categories listed below.

1. Only attempt to categorize others pages if you know the AJCW categories well.

### **Categories and Their Uses**

#### **Group Page/Subpage Categories**

**Groups**

For any group pages that do NOT classify under Clans, Packs, or Tribes.

**Group Subpages**

For any subpage where the original is categorized "Groups".

**Clans**

For any group pages that are clans.

**Traditional Clans**

For any clans directly based off the books.(Such as ThunderClan, RiverClan, SkyClan, etc.) Used with the Clans category.

**Nontraditional Clans**

For any clans indirectly based off the books. (Such as made up names like FireClan or LavenderClan.) Used with the Clans category.

**Clan Subpages**

For any subpage where the original page is categorized "Clans".

**Packs**

For any group pages that are packs.

**Pack Subpages**

For any subpage where the original page is categorized "Packs".

**Tribes**

For any group pages that are tribes.

**Tribe Subpages**

For any subpage where the original page is categorized "Tribes".

**Multi-species**

Used on group pages for groups that allow multiple species. Used with one of the group categories. (Clans, Packs, Tribes, or Groups)

**Systems**

Used on System pages, this should be the only category unless the page is a sub-page.

**Light-Realmed**

Used on Light-Realmed group pages with a group category. Not used on sub-pages.

**Neutral-Realmed**

Used on Neutral-Realmed group pages with a group category. Not used on sub-pages.

**Dark-Realmed**

Used on Dark-Realmed group pages with a group category. Not used on sub-pages.

#### **OC Page Categories**

**Original Characters**

Used on any page about a character.

**Cats**

Used on any OC page where the character is a cat. Used with the "Original Characters" category.

**Wolves**

Used on any OC page where the character is a wolf. Used with the "Original Characters" category.

**Dogs**

Used on any OC page where the character is a dog. Used with the "Original Characters" category.

**Big Cats**

Used on any OC page where the character is a big cat. Used with the "Original Characters" category.

**Nontraditional Species**

Used on any OC page where the character is not a species listed above (Cat, Dog, Wolf, or Big Cat). Used with the "Original Characters" category.

#### **Other Categories**

**Guides**

Used on any page that serves as a guide to roleplay or something else AJCW- related.

**Roleplay Elements**

Used on any page that describes an element of roleplay outside locations or characters.

**Religion and Beliefs**

Used on any page that describes a religion or belief of a group.

**Locations**

Used on any page that describes a location.

**Medicine**

Used on any page that describes subjects related to healing and medicine.

#### **Article Management Categories**

*(Often added with templates, see the template section below for more info on those)*

**Disambiguation**

Used on pages that serve as a Disambiguation, along side the Disambigation template.  This is an example of a Disambigation page in its correct format.

**Article stubs**

Used on pages that lack content. Should only be applied through the {{Stub}} template. (Add the stub template and it will automatically appear.)

**Candidates for Deletion**

Used on pages that should be deleted for a valid reason. Should only be applied through the {{Delete}} template. (Add the deletion template and it will automatically appear.)

**Candidates for Speedy Deletion**

Used on pages that should be deleted quickly for a special valid reason stated on the template. Should only be applied through the {{SpeedyDelete}} template. (Add the speedy delete template and it will automatically appear.)

Some categories are not listed, but are not intended for use on a regular basis, such as the "Policy" category, which is strictly for the AJCW Policy pages. If you are unsure if a category should exist or not, contact a content moderator or administrator.

## **Templates**

### **Design Templates**

#### **User Talk Template**

Template:User Talk Bubble

```
{{User Talk Bubble
```

It may be easier to paste the talk bubble into source mode and then edit it through visual mode. Access it in visual by double-clicking it!

#### **Username Template**

Template:Username

```
{{Username}}
```

```
While it may seem like I've just written your username here, the template does change based off whose reading it.

```

#### **Quote Template**

Template:Quote

```
{{Quote| Quote here.

-Credit here}}

```

You should always add credit to a quote, if it's not yours. If you don't know the name of the creator of the quote, you can always put "Anonymous".

#### **Family Tree Template**

See here for the format: Template:Familytree

See here for more information on the symbols: https://en.wikipedia.org/wiki/Template:Family\_tree

## **Forums**

### **Making Forums**

File:Screen Shot 2016-11-03 at 8.19.40 AM.png
1. Start by going to the forums! You probably know how to do this, but here's a reminder just in case. All you have to do is look to the top right corner in the navigation bar, it should be on the very right.

You'll come to a page with a variety of boards.

**Tutorials Forum**, **Debate Forum**, **Roleplay Forum**, **Your OC's'**, **Fun and Games**, **Questions and Answers**, **News and Announcements**, and finally **General Discussion**.

Wow! That's a lot of boards, but don't let it intimidate you, the next step is much easier than it may seem.

2. Choosing a board for your post.

This may seem difficult, but it's really not. A brief description of the topics of the boards is actually provided just beneath it, so you can always check that for reference. Still confused? Here, we'll tell you what they're for:

#### **Tutorials Forum**

Template:Quote

If you have a guide, or something you want to say that may teach/help others accomplish something, this is a great board to post it! However, if you're confused or need help with something, you can also post your question here, or on the Questions and Answers board.

#### **Debate Forum**

Template:Quote

This is the best place to start a discussion about topics on the wiki such as coding, rules, art theft, etc. It's basically a place where you can really state your opinion and have others share theirs in return. It is also where the revamps are posted.

#### **Roleplay Forum**

Template:Quote

The most popular board on AJCW by far, this is where you can create a thread and roleplay. Pretty self-explanatory honestly.

#### **Your OC's**

Template:Quote

This board is all about you! Or.. your character that is. Want to tell others about your great new OC through the forums? Go ahead. This is also where users that create "Sign-Ups" for their roleplays, post them.

#### **Fun and Games**

Template:Quote

Ever wanted to just hang out with your friends without having to keep to the wiki topic? Do so here! You can literally do anything on this board, as long as it keeps with the policies, that is. This board is often used for unrelated discussions threads for groups.

#### **Question and Answers**

Template:Quote
The name says it all! Ask us anything about the wiki or a topic concerning it.

#### **News and Announcements**

Template:Quote
Do you have a big announcement? Go ahead and post it here! This board is often user by users and staff to post announcements.

#### **General Discussion**

Template:Quote
Does your thread still not belong in one of the boards above, or are you just unsure? If it's still related to the wiki, just go ahead and put it in the General Discussion board.

3. Once you click on one of the boards, you should see a box at the top that says "Start a discussion". Click it. Something like this should appear:

 File:Screen Shot 2017-01-04 at 12.01.57 PM.png
When you set a topic as a page name, the forum then appears in a section on bottom of the page, like the one shown below:

File:Screen Shot 2017-01-04 at 2.17.31 PM.png
## Other

### =**Creating a Message Wall Greeting**

Simply copy this url into your search bar, and create the article when it says it doesn't exist.

http://animal-jam-clans-1.wikia.com/wiki/Message\_Wall\_Greeting:Template:Username

Keep in mind that if your username has a space, for the link to work you must have a \_ in the place of the gap. (Ex: This\_Is\_A\_Username

### =**Viewing/Editing a Message Wall Greeting**

You can view or edit your Message Wall Greeting (if it has been created already) by typing in Message Wall Greeting:Template:Username in the search bar. Alternatively, you can

### **Activating Chat Hacks**

First, go to **this** page.

Next, create the article, and copy either or both of these into the page:

```
importScriptPage('User:Monchoman45/ChatHacks.js', 'c');
```

Allows you to:

1. Allow you to manually set your status to away anytime.
2. Clear the chat of all messages.
3. Set words that will ping you (beep), when one appears in a message.

```
importScriptPage('User:Joeytje50/ChatPMs.js', 'c');
```

Allows you to:

1. Create a group pm with anyone else who has chat hacks.

Save the page, and follow the instructions to bypass your browser's cache that will automatically appear.
**Make sure your personal javascript (JS) is on. You can enable it in your preferences.**

See  here for more detailed instructions.

Keep in mind chat hacks have a notorious reputation to lag and break pms (both regular pms and group), and cause them to glitch. Keep this in mind if you plan on using them. This is mostly the group pm code, but users experience issues with the regular one as well.

### **Chat Tags**

These are codes that will format your message in the Live!Chat. They can be closed off as well. (Ex: [b]Text here[/b] more text.)

[big] = larger font

[small] = smaller font

[c="color name"] = color

[b] = bold text

[i] = italic text

[s] = text w/ slash through it

[u] = text with underline

[sub] = subscript

[sup] = superscript

[c="#DEDBC6"] = "Invisible" Text

[font="font name"] = Font

[bg="color"] = Highlighted text

### **Linking Things In the Live!Chat**

Although it may seem like linking something in chat would be difficult, it's actually not!

Simply copy the link and paste it, and it should automatically work.

When linking things in chat you must keep in mind:

1. The URL cannot contain any swearing before 7:30 CST without a language warning.
2. If the content of the URL contains swearing, before 7:30 CST you must give a warning. (Ex: Hey guys this is cool but it does have some swears in it!)
3. The URL cannot contain extreme NSFW content.
4. You should give a warning to any content that may upset or offend users.

Didn't know this? You should probably read the Chat Policy if you intend to chat in the near future.