Template:Messagebox

{{{text}}}

This template is for generating nicely formatted message boxes in articles, or even other templates.

Usage

The template takes three named parameters that can be given in any order.

text

(required) is the message

type

(optional) determines the presentation using pre-defined styling. One of

success - to indicate what success means
warning - to alert the user about preventing problems
failure - to dialog about when something fails
restricted - shows the keys graphic, to advise of a restricted access area or restricted authoring
forbidden - for messages about policies about things you should not do
normal (default)

style: (optional) is CSS that will be passed through.

Literal Code Example

{{Messagebox
| type = success
| style = width:50%;
| text = your message content
}}

For a more complex (up to 80 parameters) template, see the Infobox template Template_talk:Infobox

Visual Examples

no type, uses default (normal)

Why be normal?

You won!

Do not spit into the wind

You kissed your cousin

You can't do that!

You must be a registered user to create or edit articles. Contact the WikiSysop for an account!

To Do

~~Based on the existing dialog images [1], I should add a type for "restricted" for pages with restricted authoring and or "forbidden"~~
Improve and coordinate the CSS with the site / homepage

Making this template

To generate the resized images from svg 32px

The parser code (how to do switch statements) is based on the example of the Ambox template from Mediawiki

The following CSS is added to skins/freephile/freephile_template.css to make this template complete

The background images for the CSS are put into the images subfolder to make it easier to distinguish what is based on monobook, and what is extra

.message-box {
font-family: Verdana, Arial, Helvetica, sans-serif;
font-size: 11px;
background-color:#EBFFEA;
border:1px solid #0BD200;
color:#333333;
padding:8px;
margin:10px;
background-repeat: no-repeat;
background-position: 6px 6px;
}
.message-box a:link, .message-box a:active, .message-box a:visited {
color:#990000;
text-decoration:none;
border-bottom:1px solid #cccccc;
}
.message-box a:hover {
color:#990000;
text-decoration:none;
border-bottom:1px solid #990000;
}
.message-success {
font-weight: bold;
border:1px solid #8FD500;
background-color:#F2FFD7;
background-image: url(images/32px-Dialog-ok-apply.svg.png);
padding-left: 32px;
}
.message-failure {
font-weight: bold;
color: #990000;
border:1px solid #DD3C10;
background-color:#FFEBE8;
background-image: url(images/32px-Dialog-error.svg.png);
padding-left: 32px;
}
.message-warning {
font-weight: bold;
color:#FF6633;
border: 1px solid #ff9900;
background-color:#fbf8c7;
background-image: url(images/32px-Dialog-warning.svg.png);
padding-left: 32px;
}
.message-box .message-normal {
font-weight:normal;
color: #333;
background-image: url(images/32px-Dialog-information.svg.png);
padding-left: 32px;
}