The Ultimate Wiki Markup Guide

So this blog was originally over on Bleach Wiki but I figured I would bring it here since I have had a lot of requests from people asking me to help them understand coding. This will be constantly updated as I have more time to work on it and if you have any questions on how to do something, leave it in the comments and I will add it in. If you see something that looks weird or doesnt work on this wiki, point it out to me and Ill fix it.

What is it?[]

So when I say wiki markup, you are likely not really sure what I mean. Wiki markup is the code that wikis run on. When certain characters are entered into a wiki, the wiki will automatically format it into something special. So if you enter #Hi in the editor, the wiki will automatically format that as #Hi. This is wiki markup. So in this blog, I am going to run down a lot of the essentials of wiki markup, what they do and how to use them.

The Basics[]

Numbered Lists[]

The pound symbol is the code for a numbered list. If you type the pound symbol, it will replace that with the next number in the list.

Example:

#This is number 1.
#This is number 2.
#This is number 3

Will automatically format to:

This is number 1.
This is number 2.
This is number 3

Make sure that you don't have any blank lines between each pound sign or else the list won't continue and there will be another number one, such as if you were to do this:

#This is number 1.

#This is number 2.
#This is number 3.

Will format to:

This is number 1.

This is number 2.
This is number 3.

Unordered Lists[]

Exactly the same as an ordered list except you use * instead of #

Blank Lines[]

One of the more abstract things is the use of blank lines in wiki markup. Basically it boils down to this:

This is text
This is text as well

Formats to:

This is text This is text as well

But if you were to throw a blank line in there:

This is text

This is text as well

You would end up getting:

This is text

This is text as well.

Using a blank line is the only way to get two lines of text to be on a separate lines.

Horizontal Line[]

Another really easy thing. If you want to add a horizontal line across the page, just put: ----. That will produce:

Links[]

Links can be both simple and complex depending on how you use them. There are three kinds of links you can use, Internal, External and Interwiki

Internal Links[]

Very simple here. To link to any page on this wiki while you are on this wiki, just take the page name and surround it with [[]].

Example:

[[Gildarts Clive]]

formats as:

Gildarts Clive

You can also change what the links says by using a | and entering what you want the link to say afterwards.

Example:

[[Gildarts Clive|The best character in Fairy Tail]]

formats as:

The best character in Fairy Tail

Also with internal links, you need to know the namespace of what you are linking to. The namespace is just the prefix before the article name. If you want to link to your user page you need to put User: in front of the name. My user name is Godisme, but I can't simply go [[Godisme]] because no page by that name exists in the main article space, aka the pages with no prefixes. So if I want to link to my user page, I need to do the following:

[[User:Godisme]]

which will format as:

User:Godisme

and if I want it to just say Godisme, I need to use a pipe like so:

[[User:Godisme|Godisme]]

which will format as:

Godisme.

If you are linking to an image, say Aizen.png, you need to put Image: in front of it. Now this is where it gets tricky, there are two namespaces that will format as more than just a link, those are the Image/File namespaces (Image and File are two names for the namespaces where pictures are stored) and the category namespace. So let's look at these in a little more depth

Links to the File/Image and Category namespace[]

There are two things you can do with these namespace, you can display the picture for the file namespace and categorize the page you are on with the category namespace , or you can just link to it. For right now, I am just going to cover how to link to it. I will go into how to do the other options when I get more specific with categories and files.

So just linking to these is very simple, just put a colon(:) before the prefix. So if I wanted to link to Juvia's victory pose.png, I just do the following:

[[:File:Juvia's victory pose.png]]

which will format as:

File:Juvia's victory pose.png

And just like other links, I can use a pipe to change what my link says.

[[:File:Juvia's victory pose.png|The sexiest girl in FT]]

which will format as:

The sexiest girl in FT

The exact same rules apply to linking to a category.

External Links[]

A lot simpler and less to understand are external links. To link to an external site, you need the url and to simply surround it in []. When you put a url inside single brackets, unlike internal links, it will not display what you typed, but rather just a number, representing what number external link it is on the page. So,

[http://google.com]

will format as:

[1]

If you want it to display a name instead of a number, you simply need to add a space and then the name. So,

[http://google.com Google]

will format as:

Google

This is it for external links, pretty simple really.

Interwiki Links[]

Because Bleach Wiki is hosted by Wikia, there are a ton of other wikis all hosted by Wikia as well that can be linked to very easily through wiki markup. If you are linking to another wiki, there is no need for an external link so long as the wiki is also on wikia.

There are two things to understand when using an interwiki link and those are the letters w and c.

The prefix w: in a link, tells the wiki that you are linking to Community Central, the central hub of all wikis. So if I wanted to link to my user page on community central, I would put:

[[w:User:Godisme]]

which formats as:

w:User:Godisme

If you click the link, you will see that you end up on community.wikia.com/wiki/User:Godisme, which you can see is a pretty handy shortcut to typing out the url.

So once you are on central, the prefix c: tells the wiki that you are linking to another wiki. To do this you need the part of the url that comes before the .wikia.com, not the wiki name itself. A good example of this is the Rave Master Wiki. While the name of the wiki is Rave Master Wiki, the part before the .wikia.com is just ravemaster with no space. So if you were on community central, the following would link to Fairy Tail Wiki:

[[c:ravemaster]]

But since we are not on community central, that won't work here. So in order to link to another wiki, we simply need to tell the wiki to go to community central and then back to another wiki, which you do by combining w and c as follows:

[[w:c:ravemaster]]

which formats as:

w:c:ravemaster

Click it and you will end up on Rave Master Wiki. Now that we can link between wikis, you can get even more specific by linking to specific pages. This is done through another colon like the following:

[[w:c:ravemaster:Haru Glory]]

which formats as:

w:c:ravemaster:Haru Glory

Click it and you will end up on the page for Haru Glory on Rave Master Wiki. From there, all other rules of links apply, you can add pipes to change what the link says or you can add the namespace in there to link to different namespaces.

Ignoring Wiki Markup[]

So by now, you are probably thinking "If all of this is done automatically, how are you showing all of this without the wiki turning it into what its supposed to?" The answer is pretty simple, there are two tags that can make it so that the wiki does not automatically format your text. These are the nowiki and pre tags.

So first questions: What is a tag?

A tag is a special bit of code that when wrapped around something, will format it in a predetermined way. You can recognize a tag by arrows (<>). A tag starts with <tagname> and ends with </tagname>. That </tagname> is pretty important as only when you enter that, will the tag stop formatting text. So the nowiki tag is perfect for getting the wiki to not format anything on a single line. Usually when you put,

#hi

It comes out as:

hi

But if I put:

It comes out as:

#hi

The pre tag works exactly like this except for two key differences. The first is that the pre tag surrounds everything in a box. The second is that it disables ALL wiki markup. The nowiki tag can't stop certain things, such as the pre tag from formatting. Pre stops all wiki formatting so if you ever have a bunch of stuff you want to write down that includes a bunch of things that will format, use a pre tag

Headings[]

Headings, or sections as some people say, are very simple. Its all controlled through the equal sign (=). Basically, the more equal signs you have on either side of the name of the header, the lower the level of heading you get. So

=Heading=

produces a level 1 heading called Heading. If you add one more = on each side of the word heading, it goes down a level. Most commonly on this wiki, you will see level 2 (==Heading==) and level three (===Heading===) headings. So what does all of this do? Take a look above and notice the table of contents. See how it shows 1,2, 2.1, 2.2, 2.3, 2.3.1 etc? Thats because I have organized everything into different headings. The added benefit is when you click on the heading in the table of contents, it will go directly to that part of the page. Because this is a wiki, you can also specifically edit only that section.

Bold and Italics[]

These two are very simple. To italicize text, use '' ''. To bold text, use ''' '''.

''Italics''

formats to:

Italics

'''Bold'''

formats to:

Bold

Categories[]

I talked a little bit earlier about linking to categories, but now I will talk a bit about what categories are and how to use them. Basically, a category connects groups of similar pages. For instance, most wikis have a Characters category. This groups all characters into a single list that makes navigation easier. Look at Gildarts's page and you will see a lot of links on the bottom that say Characters, Male, Fairy Tail Members etc. These are all categories and are pretty simple to work with. I said earlier that to link to a category, you need to add a colon before the word category. But if you just want to add a page to a category, remove the colon and link the category as you would link a page, this will add it to the category. A word of warning though, Wikia in their infinite wisdom, has decided that wikia should no longer tell you if the category you added actually exists or not. When you link to a page that does not exist, the link is red. When you link to a page that does exist, the link is blue. When you add a category that exists, the link is blue. When you add a category that does not exist, the link is blue. See their logic? Me neither. Ill post an individual fix for this in the comments later as it is a css fix and not wiki markup.

Images[]

I debated whether to put images in the intermediate section or the basic section. They are kind of in between as they can be very simple, or a little more complex depending on what it is you want to do with them.

The basic way to add an image is as follows:

[[File:Filename.extension]]

Now that probably does not make a lot of sense to you so here is what that all means. You start as if you were making a link with the brackets. Then place the word File: to tell the link that it is in the image namespace. Then you need the file name, simply the name of the picture you want to use. So like all of my image examples, I will be using Juvia. So now we have [[File:Juvia's victory pose.extension]]. The last part on there is the extension. Every image has an extension on it which tells you what kind of file it is, be it a png, a jpg, gif, bmp, whatever. So now we have [[File:Juvia's victory pose.png]], and when I post that, I get:

Which is a pretty nice picture.

But wait, there's more! Yes, images can be customized even more, so below, I will post the full extent of what you can do with an image.

So from above, you know the first part of this, the Filename.extension part. The next part of that is thumb. That controls whether or not the image is a thumbnail. A thumbnail is shrunk down and has a border around it and a place for a caption. If you want it to be a thumbnail, keep the word thumb in there. If you don't want it to be a thumbnail, take the word thumb out and also remove the caption, as only thumbnails have captions. So the above is not a thumbnail, below is a thumbnail.

So next is the position, simply where it is aligned on the page. You have three options here, left, right or center. Plug one of those words in in place of the word position and it will align itself to your wishes. Thumbnails default right, non thumbnails default left. Next is the size. There are 2 parts to the size, you can just use the square size, or you can get specific. So, take out the word size and enter the amount of pixels you want. So for example:

The above is a 200px image. You just need to change what the size is if you want a square image. Alternatively, you can get exact with your lengths and widths.

Above is an image that is 200 px by 100px in length, which I inputted with the code [[Image:Juvia's victory pose.png|200x100px]]. And that is how you control size. On this wiki, we set all our images to 190px in size, but you can adjust the default size of unsized thumbnails in your preferences.

Next up there is the link. You can make an image into a link by using the code link=page, where page is the name of the page you want to link to. So for example:

[[Image:Juvia's victory pose.png|190px|link=Juvia]]

Is the code for an image of Juvia that links to her page, which will look like this:

You can also use interwiki links there, it functions exactly the same as any internal link would.

And finally, we have the caption. Simple enough, if you are making a thumbnail, you can make it say something.

[[Image:Juvia's victory pose.png|thumb|Juvia is shmexy]]

would produce:

So now that we have all of that, let's combine it all and make an image of Juvia that is a thumbnail, positioned in the middle of the page, that links to her page, is 200px in size and says "Juvia is shmexy". To do so, we put:

and that is going to produce:

The Intermediate[]

Color and the Span Tag[]

One of the biggest requests I see when helping people is that people want to know how to add color to what they write. On this wiki, we make it simple. We have a template called color that will add color for you. To use it write the following:

which formats as:

This is colored red

I will cover templates a little more later so that you will understand why that looks the way it does, but for now, I will just point out to you how to use this specific template. So on this one, there are two variables (things that you can change). The first variable comes after the first | and is the color you want. In my example above, I wanted red text, so I put the word red in there. When you use the template, you can use any word found here. After the second pipe is what you actually want to write. So put in whatever you want and it will be in the color you want, just make sure you placed the }} as the very last thing.

Now here is where it gets technical. The color template works because it uses an HTML tag called span. What span is is a special tag used in web design that allows text to be formatted in a variety of ways. Some of you may be familiar with and the span tag is what has replaced the font tag in modern web design. The reason I say use span rather than font is because font is what is called a deprecated tag. That means that certain browsers no longer support it and so it does nothing in those browsers. The span tag works with all browsers. So to start, lets look at how to change the color with a span tag.

This is colored red

Formats as:

This is colored red

You can also get more technical and use a hexidecimal value instead of a color name if you want. To do that, just replace red with a # and something from here. For example:

This is colored red

formats as:

This is colored red

That is just one use of the span tag, you can also modify things such as font size with the span tag.

This is size 20 font.

will format to:

This is size 20 font.

The reason why the span tag was chosen over the font tag for continued use is its ability to put all these different uses of it into one tag. So I can combine multiple commands like so:

This is size 20 font colored red.

which formats as:

This is size 20 font colored red.

You can string as many different commands as you want in there, provided you just separate them with a semicolon(;).

Div[]

By request of Mega

The div tag is very similar to the span tag in that it is an HTML tag that allows you to use CSS as if it were HTML. So what does this mean for you? It means it is a very versatile tag that can do a lot of stuff like the span tag. Its main element though is align. This means that its main purpose is to align text to different areas of the page. Some quick examples

<div align="center;">Hello</div>

Produces the following:

Hello

And just like that, I can also move text left or right in the same way:

<div align="right;">Hello</div> will give you:

Hello

Text is left aligned by default so it is rare you would need to align left, but you can do it.

The div tag also handles global variables, aka most things a span tag can do, a div tag can do as well, but the span is usually the better choice as that is what its there for.

Signatures[]

Signatures are a way for people to tell that something you wrote is by you. If you go to vote in the arena, you need to sign your vote to take credit for what you wrote. Signatures can be as simple or as difficult as you want them to be. Most basically, you can just type ~~~~ to sign your name. That will add a link to your userpage and your talk page.

You can also just sign your name with no time signature by putting ~~~ or you can simply put the timestamp, nothing else by putting ~~~~~ Now for something a little more difficult.

Custom Signatures[]

You will notice that some people on this site have a fancy looking signature. I am hesitant to teach how to do this as it can be massively complicated and can screw up pages if you do not do it right. So I will go over how to make a simple custom signature and then touch very briefly on advanced signatures.

First off, let's look at a simple signature I used to use. It is a good example of a nice simple custom signature. It looked like this:

God (Pray)

To do that, I used the following code:

[[User:Godisme|'''God''']] [[User talk:Godisme|(Pray)]]

Look what I did there, I just combined a few of the elements I have already mentioned above. I start with just a link to my user page, I add a pipe so I can change what the link says, and add a span tag to change the color of what it displays. When you are changing the color of a link, you always want to put your span tag after the pipe or else it will not work. I also use ''' to bold my name. The next part of the signature is a link to my talk page, but look how I use a w:c: interwiki link to my talk page here. This means that whatever wiki I go to, if I sign, that link will always direct back to my talk page here. My span tag is nearly the same as the first one I used but I also shrink the font size down to 25%. Nothing too complicated there and looks pretty nice.

Once you have an idea of what you want to do with your signature and have the code you want, you need to place it. To get it so that when you sign, that code shows up, you need to go to Special:Preferences. See where it says Signature? Enter your code in that box. Then hit the button below which says that you want to use wikicode in your signature. Then just hit save and you are good to go.

Finally, I will show my old sig. I am hesitant to show it as it is very complicated and should not really ever be copied in any way because one missed ending tag and the entire page will break. So here goes. My sig looks like this:

God Pray04:29, June 2, 2013 (UTC)

The code behind that is

<span style="padding-left:2px; color:white; background:-moz-linear-gradient(top, #000000 70%, #3c3b3b 30%); background:-webkit-gradient(linear, 0% 0%, 0% 100%, color-stop(70%, #000000), color-stop(30%, #3c3b3b)); border-top-left-radius:2ex; border-bottom-left-radius:2ex; border-bottom-right-radius:2ex; border-top-right-radius:2ex;">[[User:Godisme|God]][[User talk:Godisme||Pray]]{{{1|}}}

So yeah, its really long and does a lot of different things. Because my sig is so long, I have to template it. What that means, is I need to put {{User:Godisme/SwirlSig}} on User:Godisme/Sig so that all that code doesn't get placed on every page I sign on. Basically, what my sig does is it creates a series of loops of black and white which surround each other for a swirl effect. I use gradients to fill in the parts that display my name and talk, and I have also added a variable to insert the time into the signature. I'm not really going to get too much more in depth about that but if you have questions, Ill answer them in the comments.

The Advanced[]

Tables[]

I will be the first to admit, I hate tables. Tables are too overcomplicated on wikis. I usually leave the table coding to other people as they are far more complicated than they should be. But this is the advanced section, so I am going to go into some detail about tables and how to set them up and a few different styles of tables.

Below is the code to a very basic table. It is not flashy or anything, it is just nice and easy.

{| class="wikitable" border="2" style="color:#d9d4d4; background:transparent;"
|-
|Content goes here
|Content goes here
|Content goes here
|-
|More content goes here
|More content goes here
|More content goes here
|-
|This is filler
|This is filler
|This is filler
|}

If you enter that, the wiki will format it like this:

Content goes here	Content goes here	Content goes here
More content goes here	More content goes here	More content goes here
This is filler	This is filler	This is filler

Now, thats not too bad, but let's break it down into what it is. Any table starts with {|. It tells the wiki that you are starting a table. Next you see class="wikitable". This tells the wiki to format the table according to the rules of what it knows as a wikitable. You can give it other classes, but we will stick with wikitable for now. Next is your border. Some people like borders, others don't. If you don't want a border, enter 0 in there. If you do want a border, enter a value larger than 0. The bigger it is, the thicker the border will be. Finally, where you see "style=", treat it like you would a span tag, the color property as you know changes the font color and background controls the color of the background. I have set it to transparent here. So that takes care of the basic set up. Once you have that all set up, you need to put |- to signify the start of a new row. Every | in there signifies a new column. You can have as many columns as you want, so long as you keep the number of columns per row the same in every row. When you are done with a row, put another |- in order to go to the next one. When you are all done filling out your table |} will close the table. This is not terribly hard, but there is a lot of room for mistakes.

Now for something more advanced. This is the table that I used on another wiki.

Grammar Corner Members
Role	Name	Member Info
Project Head	Godisme	Talk - Contributions - Edit Count
Project Member	Jushiro971	Talk - Contributions - Edit Count
Project Member	Blossomofdeath	Talk - Contributions - Edit Count
Project Member	Dark Seeker Kotsu	Talk - Contributions - Edit Count
Project Member	Ultraprime2	Talk - Contributions - Edit Count

and the code behind that is as follows:

{|border="1" cellpadding="2" cellspacing="2" style="{{border-radius|7px|7px|7px|7px}} float: center; font-size:90%; width:100%;"
|colspan="3" style="{{border-radius|7px|7px|7px|7px}} text-align:center; font-size:13.5px; font-weight:bold; background:#6D9BC3; color:#000000"|Grammar Corner Members 
|-
|style="background:#6D9BC3; padding:4px 4px 4px 4px; text-align:center; font-weight:bold; color:#000000;"|<font color="#000000">'''Role'''</font>
|style="background:#6D9BC3; padding:4px 4px 4px 4px; text-align:center; font-weight:bold; color:#000000;"|<font color="#000000">'''Name'''</font>
|style="background:#6D9BC3; padding:4px 4px 4px 4px; text-align:center; font-weight:bold; color:#000000;"|<font color="#000000">'''Member Info'''</font>
|-
|style= text-align:center;|Project Head||style= text-align:center;|{{User|Godisme}}||style= text-align:center;|[[User talk:Godisme|Talk]] - [[Special:Contributions/Godisme|Contributions]] - [[Special:Editcount/Godisme|Edit Count]]
|-
|style= text-align:center;|Project Member||style= text-align:center;|{{User|Jushiro971}}||style= text-align:center;|[[User talk:Jushiro971|Talk]] - [[Special:Contributions/Jushiro971|Contributions]] - [[Special:Editcount/Jushiro971|Edit Count]]
|-
|style= text-align:center;|Project Member||style= text-align:center;|{{User|Blossomofdeath}}||style= text-align:center;|[[User talk:Blossomofdeath|Talk]] - [[Special:Contributions/Blossomofdeath|Contributions]] - [[Special:Editcount/Blossomofdeath|Edit Count]]
|-
|style= text-align:center;|Project Member||style= text-align:center;|{{User|Dark Seeker Kotsu}}||style= text-align:center;|[[User talk:Dark Seeker Kotsu|Talk]] - [[Special:Contributions/Dark Seeker Kotsu|Contributions]] - [[Special:Editcount/Dark Seeker Kotsu|Edit Count]]
|-
|style= text-align:center;|Project Member||style= text-align:center;|{{User|Ultraprime2}}||style= text-align:center;|[[User talk:Ultraprime2|Talk]] - [[Special:Contributions/Ultraprime2|Contributions]] - [[Special:Editcount/Ultraprime2|Edit Count]]
|}

As you can see, that is a whole lot more complicated. I will try to break it down as best I can. To start, the table starts like any other table, with {|. However, it does not assign a class, this is because it is going to define everything for itself. So first up, it assigns a border of 1. Next are the cellpadding and cellspacing, which control how much space between each individual cell there are and how much space is in each cell. Next is the style tag. The only things you haven't seen here are the Radius template, which controls the degree to which the table edges are rounded, and the width property, which simply controls how much of the page the table spans. You may not have seen float before but all its doing is positioning the table in the center of the page. The next line is more styling. The colspan property defines how many columns there are in this table. This one is set at 3. Now comes more rounding and styling, this is controlling this specific header row and setting the size, the background color, the font color etc. Where you see the |, the text that follows is the header on the table.

So now it breaks into a new row and these three columns act as the headers to the rest of the columns. These three columns are given more padding, a background, font color and are aligned center. Once all that is defined, the actual table info starts. Each cell needs to be aligned individually. You can see in here that it is not necessary to put each | on a new line, you can put them all on one if you want. Thats pretty much all there is to that, but if you have questions, as always, ask.

Templates[]

So this is the one I have been dreading writing as it is the most abstract thing there is on wikis. Back when I was an admin on Community Central, I'd see a lot of people asking how to make a template. That is a very difficult thing to answer as a template is very very very easy to make...but what is meant by template can be anything. When trying to define what a template is, a lot of people will say that a template is anything in the Template: namespace. While this is technically correct, it is not entirely true. Basically, every page on a wiki is a template. The best definition I can come up with as to what a template is is that a template is any page that can be placed on to another page using a line of code shorter than the page you are trying to put on to another page. So let's break that down a little.

The point of a template is that a large amount of code or something else is placed on the page you want to use as a template. You can then use a small line of code to display the template page on another page. This is called transclusion. When you transclude a template on to a page, the contents of the template page will show on the page you put it on, but without all the code.

Using Templates[]

To use a template, simply put the name of the page between{{ }}. Think of it like a link, just instead of using square brackets, you are using curly brackets. However, because there is a template namespace where you are supposed to put templates, if you are using a page in the template namespace, you can just skip putting the namespace. So say you want to use the clear template located at Template:Clear. This is a nice simple template that makes it so that no content over hangs into the text below. To use it, you just need to type:

That will put the clear template on the page and it will work its magic. You can also substitute a template onto a page. Substitution is the opposite of transclusion. Instead of placing just the template on a page, it will place the code stored in the template on the page. To substitute, just add the word subst: in front of the template name. So if I wanted to substitute the clear template onto a page, I would put:

Which would put the follow on to the page:

You can also do this with pages outside the template namespace by putting the namespace in. That is how my signature works. I said before that I templated my signature. This is because of how much code my signature is. I don't want to put thousands of characters on to a page every time I sign. Wikia also forces templates in the signature line to be substituted. So what I did is use a series of templates. User:Godisme/SwirlSig is where my code is. I then take that page, and transclude it into User:Godisme/Sig by putting {{User:Godisme/SwirlSig}} in there. Finally, the signature line of my preferences contains {{subst:User:Godisme/Sig}}.

So as you can see, you can use any page as a template, you just need the namespace.

Variable Templates[]

So here is where it gets a little more tricky. Some templates can take or require a variable. Some templates simply take a variable, while others need the variable name as well as the variable. This all depends on how it is coded.

Personally, I like to code my templates so that you do not need a variable name. An example once again is my signature, which has a time variable. The variable is whatever comes after the pipe (|). So in my signature

would produce: God Pray04:29, June 2, 2013 (UTC)

As you can see, I just put a timestamp code (~~~~~) after my pipe. No variable name was required.

Other templates do require the variable name though. One such being our discussion closed template. This template is used to alert editors when a decision has been made on a discussion. It can also take a variable to state the result of the discussion.

{{Discussion Closed}} produces:

This discussion is closed.
Please do not edit this discussion.

That is how the normal template displays. If I were to add a variable in there like how I did with my signature,

simply produces this:

This discussion is closed.
Please do not edit this discussion.

As you can see, nothing has changed. This is because it needs the variable name in order to work. So instead we need to put the variable in, which is called result.

This discussion is closed. The result of this discussion is:
Closed
Please do not edit this discussion.

To see if you need the variable name or not, check the template page and see what the variable is called. If the variable name is not a number, it needs the variable name in the template.

Userboxes[]

By Request of Carrot WARNING: This section is going to look really bad visually as userboxes are not meant to be placed in paragraphs with text.

Userboxes are a great way to add some color and diversity to your userpage but also a great example of templates with variables. At its core, a userbox is just a table with colored borders, a picture and some text all wrapped up into a template. They are easy enough to use. Since Carrot requested I cover these, Ill use Jellal as my example.

So say you want to add Jellal's support userbox to your user page. You can just go to your user page and put {{JellalSupport}} on there, which will come out as

This user supports Jellal Fernandes.

Simple right? But here is where things get fun, because the support boxes take two variables. So if Jellal started sleeping with Meredy, Carrot would likely start to not like him anymore since she is a Jerza shipper. In that case she can change the code on her user page to {{JellalSupport|do not support}} which will display as

This user does not support Jellal Fernandes {{{2}}}.

But see how you now have that ugly {{{2}}} sitting there? Thats because when you add the first variable to these templates, it also requires the second. If you don't want to enter a reason for your not supporting of a character, you can escape this by using the code {{JellalSupport|do not support|}} which will neatly format as:

This user does not support Jellal Fernandes .

All I did there was add a pipe there and leave the second variable blank, which is allowed. Now that we have entered the first variable, the second variable is there to allow you to show why you support or do not support them. So before I said the reason Carrot may start to not like Jellal is because he slept around, so she can add {{JellalSupport|do not support|cause he is a man whore}} Which comes out to:

This user does not support Jellal Fernandes cause he is a man whore.

And there you have it. You can do this with any of the userboxes on this site. You can also change the do not support to just support to make it say you support with a reason.

But Carrot also wanted to know how to make them look all nice and in a row. Well, there are a few ways. You can just stack them all right next to each other like

{{GodSupport}}
{{JellalSupport}}
{{GildartsSupport}}

Which comes out alright like

This user supports Godisme.

This user supports Jellal Fernandes.

This user supports Gildarts Clive.

But you can also use a table. Remember that simple table I showed you earlier? Its perfect for organizing these userboxes. So for example, I will use this:

{| border="0" style="color:#d9d4d4; background:transparent;"
|-
|{{GodSupport}}
|{{GildartsSupport}}
|{{JellalSupport}}
|-
|{{CarrotSupport}}
|{{RaiSupport|do not support|because he is a whore}}
|{{MegaSupport}}
|}

This user supports Godisme.

This user supports Gildarts Clive.

This user supports Jellal Fernandes.

This user supports TheCarrot
SaysYumYum.

This user supports Godisme.

This user supports Omega natsu2.

The table has aligned them all nicely as you can see. And that completes the userboxes section.

Making Templates[]

This is going to be a little short section as templates can be super advanced or super easy to make, but for the purposes of this blog, I'll just go over the simple stuff.

User:Godisme/spoiler is a little template I made for myself because I am always doing different things to my text. It is fairly simple and I'll explain the code behind it.

<span style="color:{{{1|}}}; font-size:x-small; text-decoration:line-through;">{{{2|}}}</span>

So right away, you can see it is a span tag. It starts with the font color. You see the {{{1|}}}? Thats a variable. That means that at the time of using the template, I can put in any color I want. The same goes for the 2 later on in the code. So what is happening here is that it asks for a color to the text and then makes it really small and then puts a line through the text. The span tag ends there and the 2 variable is what you actually want to type.

If I wanted to name my variables so that someone could see what the purpose of the variable is, I simply need to replace the {{{1|}} with the variable name. On a wiki, anything in triple curly braces is a variable. A pipe after a variable name means that it will take a new input for what is stored in the variable. Sometimes you will just see {{{1}}}. No pipe means that 1 already holds the data you want and it should not just be used where you are putting it. So let's break that down a little. Say I wanted to change my template to have named variables. My new code would look like:

<span style="color:{{{color|}}}; font-size:x-small; text-decoration:line-through;">{{{text|}}}</span></div>
|}

And then to use it, I would have to put:

The reason that you need the variable name in your call with named variables is because the wiki no longer knows the order you are putting variables in. When there were numbered variables, the wiki knew the first thing after the pipe was the first variable and so on. But without the numbers, the wiki can't be sure, so you need to have those assignment statements in there.

Finally, say I wanted to use a variable twice but only wanted it to take information once. My code would look something like this:

<span style="color:{{{1|}}}; font-size:x-small; text-decoration:line-through;">{{{1}}}</span>

You can see I added the {{{1}} in there with no pipe. This will simply display 1 rather than asking for me to define it. So now I simply type {{User:Godisme/spoiler|#8b0000}} and the following displays:

Glossary[]

Below is a simple list of markup characters on the list and what they mean on the right

# - Next number in a numbered list.
* - Bullet in a bullet list.
--- - Horizontal line
[[]] - Internal Link
[] - External Link
[[Image: - Display an image
[[:Image; - Link to an image page
[[Category: - Add a page to a category
[[:Category: - Link to a category page
~~~~ - Add your signature and timestamp to a page
~~~ - Add only your signature to a page
~~~~~ - Add a timestamp to a page
== == - Level 2 Heading
=== === - Level 3 heading
<nowiki></nowiki> - Negate automatic wiki formatting
'' '' - Italics
''' ''' - Bold
{| |} - Table
{{ }} - Template call
{{{ }}} - Template variable

To be continued