Editing Template:Userbox/doc

{{Documentation subpage}}
{{dependencies|Module:Userbox|Module:Arguments|Module:Yesno}}
<!-- Categories go at the bottom of this page and interwikis go in Wikidata. -->

This template can be used to quickly create a [[w:Wikipedia:Userboxes|userbox]] for display on a user's [[Wikipedia:User pages|user page]] without having to know HTML or Wikitable syntax.

== Usage ==
<!-- Abstract usage of the template, one variable per row. -->
<pre style="overflow: auto">
{{userbox
| bodyclass     = <!--Adds an HTML class attribute to the entire template's HTML table, to allow for styling, emission of microformats, etc.-->
| border-c      = <!--border color (default=id-c or #999999)-->
| border-s      = <!--border width in pixels (default=1)-->
| float         = <!--left|right|none (default=left)-->
| id            = <!--id image or text (image size should normally not exceed 90x45px)-->
| id-a          = <!--id horizontal alignment left/center/right/justify (default=center)-->
| id-c          = <!--id background color (default=#DDDDDD)-->
| id-fc         = <!--id font color (default=info-fc or black)-->
| id-h          = <!--id box height in pixels (default=45)-->
| id-lh         = <!--id line height (default=1.25em)-->
| id-op         = <!--id other CSS parameters-->
| id-p          = <!--id cell padding (default=0 1px 0 0)-->
| id-s          = <!--id text size in points (default=14)-->
| id-w          = <!--id box width in pixels (default=45)-->
| info-class    = <!--Adds an HTML class attribute to the "info" HTML table-row, to allow for styling, emission of microformats, etc.-->
| info          = <!--info text or image-->
| info-a        = <!--info horizontal alignment left/center/right/justify (default=left)-->
| info-c        = <!--info background color (default=#EEEEEE)-->
| info-fc       = <!--info font color (default=black)-->
| info-lh       = <!--info line height (default=1.25em)-->
| info-op       = <!--info other CSS parameters-->
| info-p        = <!--info padding (default=0 4px 0 4px)-->
| info-s        = <!--info text size in points (default=8)-->
| nocat         = <!--block page category declarations; see [[WP:NOCAT]] (default=false)-->
| usercategory  = <!--user category (optional, unlinked and without the "Category:" part)-->
| usercategory2 = <!--user category (optional)-->
| usercategory3 = <!--user category (optional)-->
| usercategory4 = <!--user category (optional)-->
| usercategory5 = <!--user category (optional)-->
}}
</pre>
* All parameters are optional.
* Images should normally be scaled to x45px or less.
<!-- Explain what this template's parameters do -- if no params, delete the definition. -->

Most HTML-based tables use only a handful of these attributes. The following subset can be used to quickly convert an HTML userbox into the format used here:

<pre>
{{userbox
| border-c = 
| id       = 
| id-c     = 
| id-fc    = 
| id-s     = 
| info     = 
| info-c   = 
| info-fc  = 
| info-lh  = 
| info-s   = 
}}</pre>

== Examples ==
{|
! style="width: 300px;" | Code
! Result
|-
| <pre>{{userbox
| border-c      = #aaffaa
| border-s      = 2
| id            = foo
| id-c          = #ffffee
| id-s          = 20
| info          = ''foo bar''
| info-c        = #ffeeff
| info-s        = 12
}}</pre> || {{userbox|id=foo|id-s=20|id-c=#ffffee|info=''foo bar''|info-c=#ffeeff|info-s=12|border-c=#aaffaa|border-s=2}}
|-
| colspan="2"| Below example shows the default appearance of a userbox, which is (much) higher than the 45px.<br>Compare the height of the one below with the above userbox.
|-
| <pre>{{userbox
| border-c      = #aaffaa
| border-s      = 2
| id            = foo logo
| id-c          = #ffffee
| info          = ''We are trying to see 
default distance in between text 
lines, see the distance in 
between cell content and its border, 
and also see total height.''
| info-c        = #ffeeff
}}</pre> || {{userbox|id=foo logo|id-c=#ffffee|info=''We are trying to see default distance in between text lines, see the distance in between cell content and its border, and also see total height.''|info-c=#ffeeff|border-c=#aaffaa|border-s=2}}
|-
| colspan="2"| Below example shows how we can change that userbox and further specify parameters to bring down<br>the overall height of the userbox to the recommended height of 45px, even with four text lines.<br>Cell padding parameter "''info-p''" can also be set at "''1pt 1pt 1pt 2pt''", or "''1pt 2pt''" for better appearance,<br>when there are 4 text lines.
|-
| <pre>{{userbox
| border-c      = #aaffaa
| border-s      = 1
| id            = foo logo
| id-c          = #ffffee
| id-lh         = 1.1em
| id-s          = 14
| info          = ''We have specified values 
to lessen the distance between 
text lines and padding space between 
cell content and its border.''
| info-c        = #ffeeff
| info-lh       = 1.05em
| info-p        = 1pt
| info-s        = 8
}}</pre> || {{userbox|id=foo logo|id-s=14|id-lh=1.1em|id-c=#ffffee|info=''We have specified values to lessen the distance between text lines and padding space between cell content and its border.''|info-c=#ffeeff|info-s=8|info-p=1pt|info-lh=1.05em|border-c=#aaffaa|border-s=1}}
|-
| colspan="2"| Below example is for advanced users, showing how we can specify other [[w:Cascading Style Sheets|CSS]] properties,for example, "''font-family''",<br>to change the font or "''text-decoration''" to add lines around the text. Below, on the right side are two userboxes:<br>the top one is displayed without either parameters; and the bottom userbox is displayed by using the below code,<br>with the help of the "''info-op''" field. 
|-
| <pre>{{userbox
| border-c      = #afa
| border-s      = 2
| id            = foo logo
| id-c          = #ffe
| id-lh         = 1.1em
| id-s          = 14
| info          = foo bar
| info-c        = #fef
| info-op       = font-family: 'Courier New', monospace; text-decoration: wavy overline green;
| info-s        = 14
}}</pre> || colspan="2"| {{Userbox|id=foo logo|id-s=14|id-lh=1.1em|id-c=#ffe|info=foo bar|info-c=#fef|info-s=14|border-c=#afa|border-s=2}} <br style="clear:both">&#160;<br /> {{Userbox|id=foo logo|id-s=14|id-lh=1.1em|id-c=#ffe|info=foo bar|info-c=#fef|info-s=14|info-op=font-family: 'Courier New', monospace; text-decoration: wavy overline green;|border-c=#afa|border-s=2}}
|}

==Microformats==
; bodyclass : This parameter is inserted into the "class" attribute for the userbox as a whole.
; info-class : This parameter is inserted into the "class" attribute for the info component.

This template supports the addition of [[w:microformat|microformat]] information. This is done by adding "class" attributes to various data cells, indicating what kind of information is contained within. To flag a userbox as containing [[w:hCard|hCard]] information about a person, for example, add the following parameter:

<pre>
| bodyclass     = vcard
</pre>

''or''

<pre>
| info-class    = vcard
</pre>

''then'' (for example):

<pre><nowiki>
| title         = …the books of <span class="fn">[[Iain Banks]]</span>
</nowiki></pre>

...and so forth.

See [[w:Wikipedia:WikiProject Microformats]] for more information on adding microformat information to Wikipedia.

== Template Data ==

<TemplateData>{
	"description": "This template can be used to quickly create a userbox for display on a user's user page without having to know HTML or Wikitable syntax.",
	"params": {
		"bodyclass": {
			"label": "bodyclass",
			"description": "Adds an HTML class attribute to the entire template's HTML table, to allow for styling, emission of microformats, etc.",
			"type": "string",
			"required": false
		},
		"border-c": {
			"label": "border-c",
			"description": "border color",
			"type": "string",
			"default": "#999",
			"required": false
		},
		"border-s": {
			"label": "border-s",
			"description": "border width in pixels",
			"type": "string",
			"default": "1",
			"required": false
		},
		"float": {
			"label": "float",
			"description": "left|right|none",
			"type": "string",
			"default": "left",
			"required": false
		},
		"id": {
			"label": "id",
			"description": "id image or text",
			"type": "string",
			"required": false
		},
		"id-a": {
			"label": "id-a",
			"description": "id horizontal alignment left/center/right/justify",
			"type": "string",
			"default": "center",
			"required": false
		},
		"id-c": {
			"label": "id-c",
			"description": "id background color",
			"type": "string",
			"default": "#d0d0d0",
			"required": false
		},
		"id-fc": {
			"label": "id-fc",
			"description": "id font color",
			"type": "string",
			"default": "black",
			"required": false
		},
		"id-h": {
			"label": "id-h",
			"description": "id box height in pixels",
			"type": "string",
			"default": "45",
			"required": false
		},
		"id-lh": {
			"label": "id-lh",
			"description": "id line height",
			"type": "string",
			"default": "1.25em",
			"required": false
		},
		"id-op": {
			"label": "id-op",
			"description": "id other CSS parameters",
			"type": "string",
			"required": false
		},
		"id-p": {
			"label": "id-p",
			"description": "id cell padding",
			"type": "string",
			"default": "0 1px 0 0",
			"required": false
		},
		"id-s": {
			"label": "id-s",
			"description": "id text size in points",
			"type": "string",
			"default": "14",
			"required": false
		},
		"id-w": {
			"label": "id-w",
			"description": "id box width in pixels",
			"type": "string",
			"default": "45",
			"required": false
		},
		"info-class": {
			"label": "info-class",
			"description": "Adds an HTML class attribute to the \"info\" HTML table-row, to allow for styling, emission of microformats, etc.",
			"type": "string",
			"required": false
		},
		"info": {
			"label": "info",
			"description": "info text or image",
			"type": "string",
			"required": false
		},
		"info-a": {
			"label": "info-a",
			"description": "info horizontal alignment left/center/right/justify",
			"type": "string",
			"default": "left",
			"required": false
		},
		"info-c": {
			"label": "info-c",
			"description": "info background color",
			"type": "string",
			"default": "#e0e0e0",
			"required": false
		},
		"info-fc": {
			"label": "info-fc",
			"description": "info font color",
			"type": "string",
			"default": "black",
			"required": false
		},
		"info-lh": {
			"label": "info-lh",
			"description": "info line height",
			"type": "string",
			"default": "1.25em",
			"required": false
		},
		"info-op": {
			"label": "info-op",
			"description": "info other CSS parameters",
			"type": "string",
			"required": false
		},
		"info-p": {
			"label": "info-p",
			"description": "info padding",
			"type": "string",
			"default": "0 4px 0 4px",
			"required": false
		},
		"info-s": {
			"label": "info-s",
			"description": "info text size in points",
			"type": "string",
			"default": "8",
			"required": false
		},
		"nocat": {
			"label": "nocat",
			"description": "block page category declarations (see WP:NOCAT)",
			"type": "string",
			"default": "false",
			"required": false
		},
		"usercategory": {
			"label": "usercategory",
			"description": "user category (optional)",
			"type": "string",
			"required": false
		},
		"usercategory2": {
			"label": "usercategory2",
			"description": "user category (optional)",
			"type": "string",
			"required": false
		},
		"usercategory3": {
			"label": "usercategory3",
			"description": "user category (optional)",
			"type": "string",
			"required": false
		},
		"usercategory4": {
			"label": "usercategory4",
			"description": "user category (optional)",
			"type": "string",
			"required": false
		},
		"usercategory5": {
			"label": "usercategory5",
			"description": "user category (optional)",
			"type": "string",
			"required": false
		}
	},
	"format": "block"
}</TemplateData>

<includeonly>[[Category:Templates]]</includeonly>