Template:Card/doc

Template page
Template:Card invokes Template:Card/styles.css using TemplateStyles.

{{Card}} is a template for generating cards in a grid or row layout on a page.

Parameters

Formatting parameters

count
The number of cards generated
column
The number of cards on a single row (max 6)
wide
Allows the grid to extend beyond page width in widescreen (yes or no)

Content parameters

title(n)
The title text on card (n)
text(n)
The content text on card (n)
bottom(n)
The text on the bottom section of card (n). Usually used for actionable items like links.
page(n)
The page linked by the button on card (n). Only use it when there is only one action.
pagetext(n)
The text displayed on the button on card (n)
bylinetop(n)
The byline text above the title on card (n)
bylinebottom(n)
The byline text below the title on card (n)

Styling parameters

colorbg(n)
The background colour of card (n)
colortext(n)
The text colour of card (n)
colorbyline(n)
The colour of the byline on card (n)
colortitle(n)
The colour of the title on card (n)
colorbgbottom(n)
The background colour of the bottom section of card (n)
colorbottom(n)
The text color in the bottom section of card (n)
colorbgbutton(n)
The background colour of the button on card (n), note that due to templating restrictions, the button text will always be grey. Please ensure there is enough contrast between the background colour and the text.

TemplateData

This template is a template for generating cards in a grid or row layout on a page. Currently only a maximum of six cards are supported in Visual Editing, please refer to the template page for advanced syntax.

Template parameters

This template prefers block formatting of parameters.

ParameterDescriptionTypeStatus
Number of cardscount

The number of cards generated

Default
The number of column
Example
1
Numbersuggested
Number of columnscolumn

The number of cards on a single row (max 6)

Default
1
Example
4
Numbersuggested
Wide modewide

Allows the grid to extend beyond page width in widescreen

Default
No
Example
Yes
Stringoptional
Card 1 titletitle1

The title text on card 1

Example
Red 1 Jared
Stringrequired
Card 1 texttext1

The content text on card 1

Contentrequired
Card 1 bottombottom1

The text on the bottom section of card 1

Contentoptional
Card 1 button linkpage1

The page linked by the button on card 1

Example
Ships
Page nameoptional
Card 1 button textpagetext1

The text displayed on the button on card 1

Example
Don't click
Stringoptional
Card 1 top bylinebylinetop1

The byline text above the title on card 1

Stringoptional
Card 1 bottom bylinebylinebottom1

The byline text below the title on card 1

Stringoptional
Card 2 titletitle2

The title text on card 2

Example
Red 2 Jared
Stringoptional
Card 2 texttext2

The content text on card 2

Contentoptional
Card 2 bottombottom2

The text on the bottom section of card 2

Contentoptional
Card 2 button linkpage2

The page linked by the button on card 2

Example
Ships
Page nameoptional
Card 2 button textpagetext2

The text displayed on the button on card 2

Example
Don't click
Stringoptional
Card 2 top bylinebylinetop2

The byline text above the title on card 2

Stringoptional
Card 2 bottom bylinebylinebottom2

The byline text below the title on card 2

Stringoptional
Card 3 titletitle3

The title text on card 3

Example
Red 3 Jared
Stringrequired
Card 3 texttext3

The content text on card 3

Contentrequired
Card 3 bottombottom3

The text on the bottom section of card 3

Contentoptional
Card 3 button linkpage3

The page linked by the button on card 3

Example
Ships
Page nameoptional
Card 3 button textpagetext3

The text displayed on the button on card 3

Example
Don't click
Stringoptional
Card 3 top bylinebylinetop3

The byline text above the title on card 3

Stringoptional
Card 3 bottom bylinebylinebottom3

The byline text below the title on card 3

Stringoptional
Card 4 titletitle4

The title text on card 4

Example
Red 4 Jared
Stringrequired
Card 4 texttext4

The content text on card 4

Contentrequired
Card 4 bottombottom4

The text on the bottom section of card 4

Contentoptional
Card 4 button linkpage4

The page linked by the button on card 4

Example
Ships
Page nameoptional
Card 4 button textpagetext4

The text displayed on the button on card 4

Example
Don't click
Stringoptional
Card 4 top bylinebylinetop4

The byline text above the title on card 4

Stringoptional
Card 4 bottom bylinebylinebottom4

The byline text below the title on card 4

Stringoptional
Card 5 titletitle5

The title text on card 5

Example
Red 5 Jared
Stringrequired
Card 5 texttext5

The content text on card 5

Contentrequired
Card 5 bottombottom5

The text on the bottom section of card 5

Contentoptional
Card 5 button linkpage5

The page linked by the button on card 5

Example
Ships
Page nameoptional
Card 5 button textpagetext5

The text displayed on the button on card 5

Example
Don't click
Stringoptional
Card 5 top bylinebylinetop5

The byline text above the title on card 5

Stringoptional
Card 5 bottom bylinebylinebottom5

The byline text below the title on card 5

Stringoptional
Card 6 titletitle6

The title text on card 6

Example
Red 6 Jared
Stringrequired
Card 6 texttext6

The content text on card 6

Contentrequired
Card 6 bottombottom6

The text on the bottom section of card 6

Contentoptional
Card 6 button linkpage6

The page linked by the button on card 6

Example
Ships
Page nameoptional
Card 6 button textpagetext6

The text displayed on the button on card 6

Example
Don't click
Stringoptional
Card 6 top bylinebylinetop6

The byline text above the title on card 6

Stringoptional
Card 6 bottom bylinebylinebottom6

The byline text below the title on card 6

Stringoptional
Card 1 background colourcolorbg1

The background colour of card 1

Example
#FFFFFF
Unknownoptional
Card 1 title colourcolortitle1

The colour of the title on card 1

Example
#222222
Unknownoptional
Card 1 text colourcolortext1

The text colour of card 1

Example
#000000
Unknownoptional
Card 1 bottom background colourcolorbgbottom1

The background colour of the bottom section of card 1

Example
#EAECF0
Unknownoptional
Card 1 bottom text colourcolorbottom1

The text colour in the bottom section of card 1

Example
#72777D
Unknownoptional
Card 1 button background colourcolorbgbutton1

The background colour of the button on card 1

Example
#EAECF0
Unknownoptional
Card 1 byline colourcolorbyline1

The colour of the byline on card 1

Example
#72777D
Unknownoptional
Card 2 background colourcolorbg2

The background colour of card 2

Example
#FFFFFF
Unknownoptional
Card 2 title colourcolortitle2

The colour of the title on card 2

Example
#222222
Unknownoptional
Card 2 text colourcolortext2

The text colour of card 2

Example
#000000
Unknownoptional
Card 2 bottom background colourcolorbgbottom2

The background colour of the bottom section of card 2

Example
#EAECF0
Unknownoptional
Card 2 bottom text colourcolorbottom2

The text colour in the bottom section of card 2

Example
#72777D
Unknownoptional
Card 2 button background colourcolorbgbutton2

The background colour of the button on card 2

Example
#EAECF0
Unknownoptional
Card 2 byline colourcolorbyline2

The colour of the byline on card 2

Example
#72777D
Unknownoptional
Card 3 background colourcolorbg3

The background colour of card 3

Example
#FFFFFF
Unknownoptional
Card 3 title colourcolortitle3

The colour of the title on card 3

Example
#222222
Unknownoptional
Card 3 text colourcolortext3

The text colour of card 3

Example
#000000
Unknownoptional
Card 3 bottom background colourcolorbgbottom3

The background colour of the bottom section of card 3

Example
#EAECF0
Unknownoptional
Card 3 bottom text colourcolorbottom3

The text colour in the bottom section of card 3

Example
#72777D
Unknownoptional
Card 3 button background colourcolorbgbutton3

The background colour of the button on card 3

Example
#EAECF0
Unknownoptional
Card 3 byline colourcolorbyline3

The colour of the byline on card 3

Example
#72777D
Unknownoptional
Card 4 background colourcolorbg4

The background colour of card 4

Example
#FFFFFF
Unknownoptional
Card 4 title colourcolortitle4

The colour of the title on card 4

Example
#222222
Unknownoptional
Card 4 text colourcolortext4

The text colour of card 4

Example
#000000
Unknownoptional
Card 4 bottom background colourcolorbgbottom4

The background colour of the bottom section of card 4

Example
#EAECF0
Unknownoptional
Card 4 bottom text colourcolorbottom4

The text colour in the bottom section of card 4

Example
#72777D
Unknownoptional
Card 4 button background colourcolorbgbutton4

The background colour of the button on card 4

Example
#EAECF0
Unknownoptional
Card 4 byline colourcolorbyline4

The colour of the byline on card 4

Example
#72777D
Unknownoptional
Card 5 background colourcolorbg5

The background colour of card 5

Example
#FFFFFF
Unknownoptional
Card 5 title colourcolortitle5

The colour of the title on card 5

Example
#222222
Unknownoptional
Card 5 text colourcolortext5

The text colour of card 5

Example
#000000
Unknownoptional
Card 5 bottom background colourcolorbgbottom5

The background colour of the bottom section of card 5

Example
#EAECF0
Unknownoptional
Card 5 bottom text colourcolorbottom5

The text colour in the bottom section of card 5

Example
#72777D
Unknownoptional
Card 5 button background colourcolorbgbutton5

The background colour of the button on card 5

Example
#EAECF0
Unknownoptional
Card 5 byline colourcolorbyline5

The colour of the byline on card 5

Example
#72777D
Unknownoptional
Card 6 background colourcolorbg6

The background colour of card 6

Example
#FFFFFF
Unknownoptional
Card 6 title colourcolortitle6

The colour of the title on card 6

Example
#222222
Unknownoptional
Card 6 text colourcolortext6

The text colour of card 6

Example
#000000
Unknownoptional
Card 6 bottom background colourcolorbgbottom6

The background colour of the bottom section of card 6

Example
#EAECF0
Unknownoptional
Card 6 bottom text colourcolorbottom6

The text colour in the bottom section of card 6

Example
#72777D
Unknownoptional
Card 6 button background colourcolorbgbutton6

The background colour of the button on card 6

Example
EAECF0
Unknownoptional
Card 6 byline colourcolorbyline6

The colour of the byline on card 6

Example
#72777D
Unknownoptional

See also

Cookies help us deliver our services. By using our services, you agree to our use of cookies.