Scioly.org:Userboxes

Userboxes are small colored boxes to be used on a user page in order to relay information about the user. Userboxes are typically used to indicate commonly-requested or important information about the user, such as the school they compete for or any medals they've earned. Some userboxes may also relate to Scioly.org, with userboxes existing to relay the amount of times a user has been exalted.

Userboxes are commmonly located in the template namespace, which means that the first part of the page name "Template:" (such as Template:Userbox/Exalted or Template:Userbox/School). However, some userboxes may be created in the user namespace as a subpage of a user page. These userboxes typically have page names in the format User:USERNAME/Userboxes/EXAMPLE such as User:Jaspattack/Userboxes/IB and User:Pepperonipi/Userboxes/ATP Synthase. While these userboxes are part of a userpage, they are typically free to use for anyone.

Using a Userbox

To include a userbox on a page, simply include the name of the userbox within curly brackets (e.g. {{Userbox/Exalted}} or {{User:Jaspattack/Userboxes/IB}}). While it is not necessary to include the prefix "Template:" if the page is in the template namespace, if the userbox is in the user namespace the prefix "User:" must be included for the template to work properly.

A majority of userboxes in the template namespace can be found in the category Category:User Templates. Some of these userboxes can also be configured in different ways, with users being able to alter what information is displayed. Always be sure to read the page the userbox is on in order to know how to use it.

Creating a Userbox

For more detailed examples, see the documentation of the Userbox template.

To create a userbox, use Template:Userbox. The Userbox template has a variety of parameters that can be modified and customized in order to create the desired effect. However, the most commonly used parameters are depicted below. All of these parameters are optional, and do not need to be included to create a userbox.

{{userbox
| border-c = 
| id       = 
| id-c     = 
| id-fc    = 
| id-s     = 
| info     = 
| info-c   = 
| info-fc  = 
| info-lh  = 
| info-s   = 
}}

Border Parameters

The very first parameter in the example above is border-c. Because the parameter begins with border it refers to the border that surrounds the userbox as a whole. The c stands for color, so border-c determines the border color. Setting a color hex code (e.x. #0f0f0f) or an HTML color name as the value for this parameter makes the border that color.

ID Parameters

ID parameters refer to the icon or piece of text on the side of the infobox.

MN

Userboxes competes or competed in Minnesota.

In the Userstate template above, that's the MN on the left. There are four common ID parameters: id, id-c, id-fc, and id-s. To change the ID text or insert an image, change the id parameter. If an image is used for an ID, it should be scaled to 45px to match the rest of the infobox. The c for color still applies here, though it affects the background of the ID box instead of the font color. In the Userstate example, id-c refers to the dark blue background behind the MN text. id-fc refers to the font color, changing the color of the text set as the ID. id-s is the last parameter, changing the font size.

Info Parameters

Info refers to the actual main text of the userbox, typically written in the form of "This user [verb phrase] <noun>." or "(Username) [verb phrase] <noun>.". For example, the Userstate template states that "(Username) [competes in] <state>." and a school template might state that "This user [attended] <school>". While there are other userbox formats that are possible, these are the most common.

The same shorthand for c, fc, and s apply to the info parameter as well. The lh in info-lh stands for line height, and changes the height of a line of text. If there are multiple lines of text in a userbox, changing this parameter makes it possible to space them out more or reduce the amount of space between each line. This parameter is particularly useful when making userboxes with lots of text.

Other Parameters

CSS can be used to modify any aspect of an infobox, even if there is not a parameter for it. Some CSS such as text-shadow or text-transform might be included by adding op to the end of the element you want to edit. For example, including info-op as a parameter would let you configure the info section of the userbox using other elements of CSS. Be sure to check the Userbox template page for more details on possible parameters that can be included, as using the op parameter might not be necessary.

Putting it All Together

Now that the most common infobox parameters have been defined, its possible to edit them all to create one cohesive infobox. Remember that it's not necessary to use every parameter for an infobox - any of them can be left out to create a fun design!

Code

Result

{{userbox
| id       = Wiki
| id-c     = #000F97
| id-fc    = #FEE372
| id-s     = 14
| info     = This user edits the [[Main Page|Scioly.org Wiki]].
| info-s   = 9
}}

Wiki

This user edits the Scioly.org Wiki.

{{userbox
| id       = [[File:SciolyOrgLogo.png|45px]]
| id-c     = #2E66B6
| info     = This user loves Scioly.org!
| info-c   = #ffffff
}}

This user loves Scioly.org!

{{Userbox
| border-c = blue
| id       = π
| id-c     = midnightblue
| id-fc    = mintcream
| id-s     = 15
| info     = This user likes to eat pi — both the flaky pastry and the irrational number!
| info-c   = aliceblue
| info-fc  = darkblue
| info-lh  = 1.5
| info-s   = 9
}}

π

This user likes to eat pi — both the flaky pastry and the irrational number!