Tutorial/Part 3

Template:Community Tabs

## Page Organization

We already know how to use headers, but what about more advanced page organization? Picks and Bans pages have tables placed side-by-side next to each other. Some pages have a set number of things side-by-side next to each other that collectively span the page. What about a table of contents on the right? This section will go over several organizational things and contain some wiki code that you may want to save so you can copy-paste in the future.

### BlockBox

This is how Picks and Bans pages work. Items will autofill into a grid left to right and then top down depending on the dimensions of the viewer's browser. You can also control how much space there is in between elements in the grid. Here's how to use a box:

```
{{BlockBox|start|padding=??em}}
Whatever you want in the first "cell"
{{BlockBox|break|padding=??em}}
Whatever you want in the second "cell"
{{BlockBox|break|padding=??em}}
etc
{{BlockBox|end}}

```

The ?? is the amount of space you want in between elements. This can scale from 1 upwards, and you will probably never want a number bigger than 10.

Here's the code used to generate the above:

```
{{BlockBox|start|padding=1em}}
{|class="wikitable"
!There is 1em of padding to the right
{{BlockBox|break|padding=5em}}
{|class="wikitable"
!There is 5em of padding to the right
{{BlockBox|break|padding=2em}}
{|class="wikitable"
!This is the end (and there is 2em of forced padding between<br>here and the end of the page; this can force the line to wrap).
{{BlockBox|end}}
```

You can read the documentation about Boxes **here**.

### Table of Contents

If you have at least 4 headings on a page of any level, a table of contents will be created automatically. By default, it's placed right above the first heading and aligned left. But what if you don't want a table of contents? Or what if you want it aligned right?

To hide a table of contents, put the following code anywhere in the page (recommended at the very top):

```
__NOTOC__
```

(That's two underscores, then "NOTOC," then two more underscores.)

To show the table of contents elswhere, put the following code exactly where you want the table of contents:

```
__TOC__
```

If you want to align the table of contents to the right side of the page, there are two templates you may want to use:

* `{{TOCRight}}`, which inserts the TOC code on the right side of the page inside a div
* `{{TOCRightWInfobox}}` (or `{{TOCRWI}}` for convenience), which inserts the TOC code on the right side of the page inside a div, ofsetting an appropriate amount in order to align it with an infobox.

### Expandable Section

Click [show] on the right to view

File:SonaSquare.png

We use these expandable sections for several purposes, whenever we want to include information that might take up a lot of unnecessary vertical space otherwise.

Here's the base code for an empty box:

```
<div class="NavFrame collapsed">
<div class="NavHead">[Title]</div>
<div class="NavContent">
Content
</div></div>
```

Here's the code for an empty box with our standard formatting:

```
<div class="NavFrame collapsed" style="width:900px;max-width:100%">
<div class="NavHead" style="background-color:#EEE; border:1px solid #AAA">Click [show] on the right to view</div>
<div class="NavContent" style="text-align:left">
</div></div>
```

There's a lot of parameters you can change though. Let's go through:

## Miscellaneous

This section includes a list of things that are important for you to know how to use and interact with that don't fit well into another section. Topics vary from basic to advanced.

### The Team Template

In section 2, we went over how to link a team. However, there are several modifiers you can use, and we will go over them here. You may also find full documentation on the team template and how to use it **here**.

```
{{team|KT Arrows}}
```
```
{{team|KT Arrows|leftlonglinked}}
```
```
{{team|KT Arrows|rightshort}}
```

```
{{team|KT Arrows|leftshort}}
```
```
{{team|KT Arrows|rightshortlinked}}
```
```
{{team|KT Arrows|leftshortlinked}}
```
```
{{team|KT Arrows|onlyimagelinked}}
```
```
{{team|KT Arrows|size=35px}}
```
```
{{team|KT Arrows|onlyimagelinked|size=35px}}
```

### Pulling Rosters from One Place to Another

When you read about Templates in the next part, you'll learn why this works, but for now just recognize that it does. We'll use Team Fusion's initial roster as an example:

The important thing to notice here is <onlyinclude> and </onlyinclude>. What these tags do is allow you to type

```
{|class="sortable wikitable"
!
!ID
!Name
!Role
{{:Team Fusion}}
```

on another page and generate the same table. Just be aware of those tags and this capability, and when you read about templates you'll understand why it works - and be able to apply it in other situations, too.

Template:CommunityNavbox