ଛାଞ୍ଚ:fmbox/doc

This is the {{fmbox}} or footer & header message box template.

Usage

Simple usage example:

{{fmbox | text = Some text.}}

Complex example:

{{fmbox
| type      = editnotice
| image     = [[Image:Emblem-question-yellow.svg|40px]]
| style     = border: 1px solid #f4c430;
| textstyle = color: red; font-weight: bold; font-style: italic;
| text      = The message body text.
}}

Footer and header message box types

The following examples use different type parameters but use no image parameters thus they use the default images for each type.

Other images

The default images shown above are mostly for testing and demonstration. In most cases it is more appropriate to use a more specific image or no image at all. These examples use the image parameter to specify an image other than the default image.

Special

Some other parameter combinations.

Parameters

List of all parameters:

{{fmbox
| type  = system / editnotice / warning
| image = none / [[Image:Some image.svg|40px]]
| imageright = [[Image:Some image.svg|40px]]
| id = CSS id
| class = CSS class names
| style = CSS values
| textstyle = CSS values
| text  = The message body text.
}}

type

If no type parameter is given the template defaults to type system. That means it gets a light grey background.

image

No parameter = If no image parameter is given the template uses a default image. Which default image it uses depends on the type parameter.

An image = Should be an image with usual wiki notation. 40px - 50px width are usually about right depending on the image height to width ratio. (But the message box can handle images of any size.) For example:

image = [[Image:User-info.svg|40px]]

none = Means that no image is used.

imageright

No parameter = If no imageright parameter is given then no image is shown on the right side.

An image = Should be an image with usual wiki notation. 40px - 50px width are usually about right depending on the image height to width ratio. (But the message box can handle images of any size.) For example:

imageright = [[Image:Nuvola apps bookcase.png|40px]]

Anything = Any other object that you want to show on the right side.

id

Optional CSS id used by the entire message box table. Without quotation marks " ". Mostly meant to be used to tag a message box with its name, to make it easy to detect the presence of the message from javascript.

class

Optional CSS class names used by the entire message box table. Without quotation marks " ". Mostly meant to be used to tag a message box with its name so it can be individually skinned.

style

Optional CSS values used by the entire message box table. Without quotation marks " " but with the ending semicolons ;. For example:

style = margin-top: 1em;

textstyle

Optional CSS values used by the text cell. For example:

textstyle = font-size: 90%; text-align: center;

text

The message body text.

Technical details

This template currently uses hard coded styles and class names. Later it will only use CSS classes making it easier to skin. (In the meantime it can be skinned by using the "!important" keyword.)

If you need to make a box that is less than 100% wide, then do not use this box. Since this box doesn't have the "1px empty image cell" code that makes it so the other mboxes get proper box flow in all browsers when less than 100% wide.

If you need to use special characters in the text parameter then you need to escape them like this:

{{fmbox
| text  = <div>
Equal sign = and a start and end brace { } work fine as they are. 
But here is a pipe {{!}} and two end braces <nowiki>}}</nowiki>. 
And now a pipe and end braces <nowiki>|}}</nowiki>.
</div>
}}

Internally this meta-template uses HTML wikimarkup instead of wikimarkup for the table code. That is the usual way we make meta-templates since wikimarkup has several drawbacks. For instance it makes it harder to use parser functions and some special characters in parameters.

The default images for this meta-template are in png format instead of svg format. The main reason is that some older web browsers have trouble with the transparent background that MediaWiki renders for svg images. The png images here have hand optimised transparent background colour so they look good in all browsers. Note that svg icons only look somewhat bad in the old browsers, thus such hand optimisation is only worth the trouble for very widely used icons.

Note: MediaWiki does not parse and convert HTML wikimarkup in system messages the same way as it does for normal pages. This means for instance that <br> is not automatically converted to <br /> and missing </td> and </tr> tags are not automatically added. Thus see to that any HTML code you use in system messages are valid XHTML. That is, close all tags that you begin. However, regular wikimarkup works fine in most system messages.