Custom macros for MDN

In This Article
  1. Creating hyperlinks
    1. Template:AlphabeticalTOCForTag
    2. Template:anch
    3. Template:bug
    4. Template:DownloadButton
    5. Template:FirefoxChannelLink
    6. Template:InsertFeedLinkList
    7. Template:IRCLink
    8. Template:Link
    9. Template:LinkItem
    10. Template:LinkItemDL
    11. Template:LiveSample
    12. Template:CSSLiveSample
    13. Template:DOMLiveSample
    14. Template:HTMLLiveSample
    15. Template:SVGLiveSample
    16. Template:JSFiddleLink
    17. Template:enter-bug
    18. Template:ifmethod and Template:ifattribute
    19. Template:Include
    20. Template:ListSubpages
    21. Template:LandingPageListSubpages
    22. Template:NavListWithPrioritizedPages
    23. Template:APIListAlpha
    24. Template:SubpagesWithSummaries
    25. Template:manch
    26. Template:Interwiki
    27. Template:LXRSearch
    28. Template:Pref
    29. Template:RFC
    30. Template:SectionOnPage
    31. Template:seealso_tag
    32. Template:SeeDOMInterface
    33. Template:source
    34. Template:source_cvs
    35. Template:spec
    36. Template:SVGLiveSample
    37. Template:taggedsubpages
    38. Template:toc
    39. Template:TOCSectionForTag
    40. Template:WebkitBug
  2. Linking to pages in references
  3. Quicklinks
    1. Template:MakeSimpleQuicklinks
    2. Template:QuickLinksWithSubpages
  4. Transclusion
    1. Template:Page
      1. Example without heading
      2. Example with heading
  5. About Mozilla
  6. Tagging pages
    1. Icon badges
      1. Templates for specific icon badges
    2. Other badges
      1. Templates for specific badges
    3. Template:disambig
    4. Template:outdated
    5. Template:NeedsReviewWithTags
    6. Template:LockedPage
    7. Template:ReleaseChannelInfo
    8. Template:deprecated_header, non-standard_header, obsolete_header
    9. Templates tagging pages in the references/guides/tutorials
  7. Landing page components
    1. Article lists divided by topic
    2. Community information boxes
  8. Join the UberSuperTech community
  9. General-purpose templates
    1. Template:block-title
    2. Template:Clr
    3. Template:CurrentGecko
    4. Template:Embed_text
    5. Template:EmbedSVG
    6. Template:Gecko
    7. Template:hX_gecko_minversion
    8. This is important information
    9. Template:Note and Template:warning
    10. Template:ref and Template:endnote
    11. Template:deprecated_inline
    12. Template:non-standard_inline
    13. Template:obsolete_inline
    14. Template:js_obsolete_inline
    15. Template:js_obsolete_header
    16. Template:optional_inline
    17. Template:MobileOnlyInline
    18. Template:MobileOnlyHeader
    19. Template:ReadOnlyInline
    20. Template:renamed_inline
    21. Template:unimplemented_inline
    22. Template:unimplemented_inline_webkit
    23. Template:Previous, Template:Next, and Template:PreviousNext
    24. Template:localString
  10. Version information templates
    1. Interface reference summaries
    2. Marking articles or sections as specific to a given release
    3. Version-specific notes and call-out boxes
    4. Adding version indicators to content
  11. Creating bug tables
  12. HTML documentation specific macros
    1. Template:HTMLRefList
    2. Template:HTMLGuideList
  13. Nesting templates
  14. See also

This page lists many of the general-purpose templates created for use on MDN. The complete list of all templates on MDN is available, but since there are so many, we don't list all of them here. For how-to information on using these macros, see "Using link macros" and "Using macros" in the MDN editor guide.

See also the list of custom CSS classes.

Template:AlphabeticalTOCForTag

Template:AlphabeticalTOCForTag inserts a table of contents of all articles with a specified tag. An optional second parameter lets you apply a template to be used when rendering the links; for example: {{AlphabeticalTOCForTag("HTML:Element Reference", "HTMLElement")}} uses Template:HTMLElement to render the items in the TOC.

Template:anch

Template:anch inserts a link to an anchor. {{Anch("top")}} produces <a href="#top">top</a> (top). Note that with this template you cannot choose a link description that is different from the anchor's name. The idea was to create a template that allows easy linking to other sections in a document.

Template:bug

Template:bug allows you to link to a bug on bugzilla.mozilla.org easily using this syntax: {{Bug(123456)}}. This gives you: bug 123456.

Template:DownloadButton

DownloadButton inserts a green "Download" button into the page. It accepts two parameters:

  1. The URL of the destination link
  2. The text for the button itself

For example, {{DownloadButton("http://nightly.mozilla.org/", "Download Nightly")}} results in: Download Nightly

FirefoxChannelLink inserts a link to download a specific Firefox channel. The link can be either textual or the channel's icon. The idea behind this macro is that it provides an easy way to link to download Firefox without having to deal with potentially changing "best sources" for these downloads, and lets you use icon buttons without worrying about the icon changing. We can just update the macro and all places using the icons will be updated.

It accepts these parameters:

  1. The name of the channel. This is a case-insensitive string, and must be one of "nightly", "aurora", "beta", or "release" (the last one can also be "firefox").
  2. The icon size, in pixels. The width of the icon will be set to this, with the height horizontally adjusted to match. If this is zero, the link will be presented as a textual link instead.
  3. The text for the link. You can leave this parameter out if you specify an icon size, thereby asking for your link to be an icon.

For example, {{FirefoxChannelLink("aurora", 96)}} results in:

And {{FirefoxChannelLink("beta", 0, "Download Firefox Beta")}} results in: Download Firefox Beta

InsertFeedLinkList outputs a list of links from an RSS feed. Its parameters configure the output significantly:

  1. Feed URL
  2. Maximum number of entries to include in the output
  3. The heading level to use for the name of the feed, or 0 to leave that heading out
  4. Class name to use when building the list; this will be applied to the <ul> element.
  5. List type; this is an integer value. 0 produces a simple bullet list, while 1 outputs a header for the page title followed by a paragraph with a byline in it.
  6. The heading level to use for the items in the list when using list type 1.

IRCLink inserts a link to the specified IRC channel, complete with a tooltip that says that's what it does and that an IRC client is needed.

Link inserts a link to the specified page on MDN, using the page's title as the visible string to click on, and the tooltip picked up from the page's SEO summary.

Template:LinkItem

LinkItem inserts a link to a specified URL, with the indicated text as the visible string to click on. The link automatically picks up as its tooltip the summary of the target page. This differs from Link in that you must specify the title.

Template:LinkItemDL

LinkItem inserts a link to a specified URL, with the indicated text as a <dt> which is also the link. The <dd> element contains the specified page's summary.

Template:LiveSample

Template:LiveSample lets you create a button linking to a sample file; these samples should be sent to Eric Shepherd for uploading. These should be used on Reference pages when linking to live, standalone sample pages. The template accepts one parameter, the name of the HTML file to link to.

Template:CSSLiveSample

Template:CSSLiveSample lets you create a button linking to a sample in the CSS Reference; these samples should be sent to Eric Shepherd for uploading. These should be used on CSS Reference pages when linking to live, standalone sample pages. The template accepts one parameter, the name of the HTML file to link to.

Template:DOMLiveSample

Template:DOMLiveSample lets you create a button linking to a sample in the DOM Reference; these samples should be sent to Eric Shepherd for uploading. These should be used on DOM Reference pages when linking to live, standalone sample pages. The template accepts one parameter, the name of the HTML file to link to.

Template:HTMLLiveSample

Template:HTMLLiveSample lets you create a button linking to a sample in the HTML Reference; these samples should be sent to Eric Shepherd for uploading. These should be used on HTML Reference pages when linking to live, standalone sample pages. The template accepts one parameter, the name of the HTML file to link to.

Template:SVGLiveSample

Template:SVGLiveSample lets you create a button linking to a sample in the DOM Reference; these samples should be sent to Eric Shepherd for uploading. These should be used on SVG Reference pages when linking to live, standalone sample pages. The template accepts one parameter, the name of the HTML file to link to.

Template:JSFiddleLink lets you easily create a button linking to a sample on the jsFiddle web site. These should NOT be used to replace in-line samples, or MDC-uploaded samples, but to offer access to secondary examples readers can experiment with. The template accepts one parameter, the ID tag of the jsFiddle item to link to.

Template:enter-bug

Template:enter-bug lets you link to an Enter A Bug page on bugzilla.mozilla.org with specific product and component. For example, {{enter-bug("Core","Layout")}} shows up as Core:Layout.

Template:ifmethod and Template:ifattribute

Template:ifmethod and Template:ifattribute let you create a link to a particular method or attribute (respectively) on an interface that's been created using our standard format for interface documentation. For example, {{ifmethod("nsIAutoCompleteSearch","stopSearch")}} shows up as nsIAutoCompleteSearch.stopSearch(). Note that for Template:ifattribute, id="..." must be added explicitly in the target, since attributes do not have headings.

Template:Include

Template:Include inserts an #include "headername.h" reference that links to the specified file in MXR. This is used in pages that want to have a heading at the top of the page telling you how to include the appropriate header file for the interface being described. For example, {{Include("mozilla/CondVar.h")}} results in:

#include "CondVar.h"

Template:ListSubpages

Template:ListSubpages generates an unordered list of links to all the immediate children of the current page; useful for automatically generating tables of contents for sets of documentation.

Template:LandingPageListSubpages

Template:LandingPageListSubpages outputs a two-column definition list of all immediate subpages of the current page, with their titles as the <dt> and their SEO summary as the <dd>. This makes it easy to automatically generate reasonably attractive landing pages.

Template:NavListWithPrioritizedPages

NavListWithPrioritizedPages generates an ordered list formatted properly for use in a zone navigation sidebar (or quicklinks). As input, you can specify zero or more page slugs that should be pulled out of the main list and instead inserted at the top of the list, in the given order. All remaining pages are placed in the list alphabetically. One level of subpages is included.

Template:APIListAlpha

Template:APIListAlpha builds a list of the current page's subpages, formatted as a list of API terms, divided up by first letter. There are three parameters. The first is 0 if you want to include all top-level subpages or 1 to leave out subpages with "." in their names. The second and third let you add text to display as part of the name in each link. This can be used to add "<" and ">" for element links, or to add "()" at the end of lists of method names.

Template:SubpagesWithSummaries

SubpagesWithSummaries constructs a definition list of all the immediate children of the current page. There is no other formatting done. You can get a two-column list ready for use as a multi-column landing page using LandingPageListSubpages.

Template:manch

Template:manch inserts a link to a method within the current interface; this is intended only for use in interface documentation pages. {{manch("foo")}} produces <code><a href="current/path#foo">foo()</a></code> (foo()).

Template:Interwiki

Template:Interwiki makes it easy to create interwiki links. Currently it supports linking to Wikipedia and Wikimo. The first parameter is the name of the wiki ("wikipedia" or "wikimo"), and the second is the path of the article. For example, {{interwiki("wikipedia", "Firefox")}} shows up as Firefox. This template auto-detects the page language and directs to the same language on Wikipedia, for example.

Template:LXRSearch

Template:LXRSearch can be used (somewhat painlessly) to create an LXR search URL. The syntax is as follows: {{LXRSearch(type, param, search-string, link-text)}}. The parameters are used in the following ways:

  • type must be one of search (a string search through source), find (a file name search), or ident (a search through token names in Mozilla source).
  • param must be one of string (for string/file name searches) or i (for token searches). If templates had some conditional power we could get away with one parameter instead of two, but they don't. An extension could probably work around this, as always.
  • search-string is whatever you would type in the search box on LXR if you were doing the search there, except that spaces should be converted to +.
  • link-text is the text for the link that will be created.

Template:Pref

Template:Pref inserts a link to the entry in the Preference reference for the specified preference.

Template:RFC

Template:RFC creates a link to the specified RFC, given its number. The syntax is simply: {{RFC(number)}}. For example, {{RFC(2616)}} becomes RFC 2616.

Template:SectionOnPage

SectionOnPage creates a phrase that links to both the name of a section and the article containing that section. For example, {{SectionOnPage("/en-US/docs/Mozilla/Firefox/Releases/21", "Changes for Web developers")}} outputs the following: "Changes for Web developers" in Firefox 21 for developers.

Template:seealso_tag

Template:seealso_tag inserts a bullet list of articles that are tagged with the specified tag. This makes it easy to list potentially relevant articles in a "See also" section.

Template:SeeDOMInterface

Template:SeeDOMInterface inserts a blurb of text explaining that a specified interface implements a given DOM interface. Use this to create simple stub pages for Gecko interfaces that simply implement standard interfaces in the DOM. For example: {{SeeDOMInterface("nsIDOMHTMLFormElement", "HTMLFormElement")}} looks like this:

The nsIDOMHTMLFormElement interface implements the DOM HTMLFormElement interface. See that page for details.

Template:source

Template:source allows you to link to a Mozilla source code file without having to type a long MXR URL using this syntax: {{Source("browser/Makefile.in")}}. This gives you: browser/Makefile.in. The text of the link is the path provided; if you want different text, then just provide a second parameter, like so: {{Source("browser/Makefile.in", "the browser/ Makefile.in")}}, which produces the browser/ Makefile.in. Note that the link will be to the very latest version of the file in bleeding-edge code.

Template:source_cvs

Template:Source_cvs works just like Template:source, except it links to the CVS repository instead of the newer mozilla-central one.

Template:spec

Template:spec inserts a link to a specification; it's intended for use in "See also" and "Specification" sections, rather than in the body of articles. It accepts one required and two optional parameters: the first is the full URL of the specification, the second is the optional link text to display (if not provided, the URL is just inserted, so you should provide this parameter), and the third is an abbreviation indicating the status of the specification. The status may be one of:

ED
Editor's Draft
WD
Working Draft
LC
Last Call
CR
Candidate Recommendation
PR
Proposed Recommendation
REC
Recommendation

If specified, the status results in a small, color-coded box being drawn next to the specification link. For example: {{spec("http://www.w3.org/TR/FileAPI/#dfn-Blob", "File API Specification: Blob", "WD")}} results in:

File API Specification: BlobWD

Template:SVGLiveSample

Template:SVGLiveSample lets you create a button linking to a sample in the SVG documentation; these samples should be sent to Eric Shepherd for uploading. These should be used on SVG documentation pages when linking to live, standalone sample pages. The template accepts one parameter, the name of the HTML file to link to. The rest of the path is inserted automatically.

Template:taggedsubpages

Template:taggedsubpages inserts a bulleted list of subpages of the page on which it's used that have the specified tag. For example: {{taggedsubpages("foo")}}

Template:toc

Template:toc constructs and inserts a table of contents for the specified page. You may optionally provide a chapter number and a maximum depth to display.

Template:TOCSectionForTag

Template:TOCSectionForTag inserts a table of contents of all articles with two specified tags. An optional third parameter lets you apply a template to be used when rendering the links; for example: {{TOCSectionForTag("HTML:Element Reference", "Deprecated", "HTMLElement")}} uses Template:HTMLElement to render the items in a list of all deprecated HTML elements, as below:

FIXME: Please correct the code that are commented out here. Maybe we need modification of the template.

Template:WebkitBug

Template:WebkitBug inserts a link to a bug in the WebKit bug database. For example, {{WebkitBug(31277)}} inserts WebKit bug 31277.

Linking to pages in references

We have some macros specifically designed to create quicklinks.

The MakeSimpleQuicklinks macro creates a flat list of links in the quicklinks box. Simply give it a set of paths to destination pages as its input arguments. Each link's text is the page title, and each link has a tooltip derived from the page summary.

Template:QuickLinksWithSubpages

QuickLinksWithSubpages creates a set of quicklinks comprised of the pages below the current page (or specified page, if one is given). Up to two total levels of depth are generated.

Transclusion

Transclusion is the embedding of part or all of one page into another. We have several macros that can be used for this.

Template:Page

The granddaddy of all our transclusion macros, Page lets you embed some or all of a specific page into a document. It accepts five parameters:

  1. The URI of the page to transclude. For example, "/en-US/docs/Project:MDN/About".
  2. The name of the section within the page to transclude. This can be specified either as the title string or as the ID of a block to copy over. If not specified, the entire article is transcluded. Optional
  3. The revision number of the page version to transclude. This feature is not currently implemented, but would allow including text from specific versions of an article. Unimplemented
  4. A Boolean value indicating whether or not to show the heading of the top-level section being transcluded. This is useful if you wish to specify your own heading. The default value is false, meaning the heading is not included by default. Optional
  5. The heading level to use as the top heading level. This adjusts the outermost first-discovered level of the transcluded content to the specified number, and all other headings correspondingly. This lets you include content that has its own headings but adjust them to match the heading level at which you're including them. If you don't specify this value, the headings are not adjusted. Unimplemented

Example without heading

{{Page("/en-US/docs/Project:MDN/About", "About Mozilla")}}

Result:

Whether you want to learn more about who we are, how to be a part of Mozilla or just where to find us, you've come to the right place. To find out what drives us and makes us different, please visit our mission page.

Example with heading

{{Page("/en-US/docs/Project:MDN/About", "About Mozilla", 0, 1)}}

Result:

About Mozilla

Whether you want to learn more about who we are, how to be a part of Mozilla or just where to find us, you've come to the right place. To find out what drives us and makes us different, please visit our mission page.

Tagging pages

These templates should be placed at the top of a page (but below the breadcrumbs). Some templates can be also used at the top of a section.

Icon badges

We have the ability to create attractive icon-based badges to flag compatibility issues. This is done using Template:IconBadge, which accepts five parameters:

  1. The text to display in the badge next to the icon.
  2. Class name for the background in the circle containing the icon. This background should include the icon to display.
  3. Class name for the background in the text area of the badge.
  4. Tooltip text. The tooltip doesn't currently draw but will eventually. Optional

For example:

{{IconBadge("Privileged", "privilegedBadgeIcon", "privilegedBadge", "Only available to certified apps on Firefox OS.")}}

Results in: Privileged

Templates for specific icon badges

We have some templates to make it easy to create specific badges:

Firefox OS: Privileged apps only

Template:PrivilegedBadge can be used to create a badge marking an item as being available only to privileged apps on Firefox OS. It takes no parameters. Example:

Other badges

We also have badges that don't have icon bubbles. The generic template for this is Template:SimpleBadge, which accepts three parameters:

  1. Text to display in the badge.
  2. Name of a CSS class to use as the background for the badge.
  3. (Optional) Text to display in a tooltip when hovering over the badge.

Templates for specific badges

We have some templates for specific types of badge. In some cases these may duplicate functionality of older inline banners. Those banners may be updated to simply redirect to  the new badges soon.

SomeAPI
This is an API.
PrivilegedAPI Privileged
This is a privileged API.
Template:NonStandardBadge Non-standard
Used to mark an item which is not part of a standard.

Template:disambig

Template:disambig is used on the few disambiguation pages we have.

Template:outdated

The template outdated should be used to tag pages that are known to be (or might be) horribly outdated.
The template is followed by an optional parameter, which can be used to provide details.
Example: {{outdated("It was last updated in 1999.")}} gives you this:

Warning: The content of this article may be out of date. It was last updated in 1999.

Template:NeedsReviewWithTags

This template produces a list of articles for which the specified review flag is set. You may specify zero or one review types, as well as an optional list of tags to match against, and a Boolean value indicating whether or not to look across all locales or just the user's current locale.

Syntax:

{{NeedsReviewWithTags(reviewtype, tagList, allLocales)}}

reviewtype
One of "editorial", "technical", or "kumascript". This can also be an empty string if you want all review types to be included.
tagList Optional
If present, this is a comma-delineated string listing the tags that must match before an article will be included in the resulting list. For example, "Mobile,Non-standard" will only include articles tagged with both "Mobile" and "Non-standard". You may omit this parameter, or provide an empty string, to match all pages.
allLocales Optional
If present, this is an integer value; if 0, only the user's current locale is included in the list. If this has any other value, all locales are included in the output.

Template:LockedPage

Template:LockedPage inserts a mark bar across the page that provides an explanation for why a page is locked. There are two parameters: the first is the length of time for which the page is expected to be locked, and the second is the reason why it's locked. A link to the page's discussion page is also included in the bar.

This page is marked as protected web.html($0) for the following reason: web.html($1).
Please discuss changes that need to be made on the web.link(page.talkURI, "Talk page").

Template:ReleaseChannelInfo

Template:ReleaseChannelInfo is used to create the standard header at the top of "Firefox X for developers" pages for a given channel; it takes four parameters: the Firefox version, the Gecko version, a string indicating an expected release date, and the name of the channel on which the release can currently be downloaded. For example, {{ReleaseChannelInfo("29", "29", "April 2014", "Beta")}} yields:

Firefox 29, based on Gecko 29, will ship in April 2014. This article provides information about the changes in this release that will affect developers. Nightly builds of what will become Firefox 29 are currently available on the Beta channel.

Note: Items listed here are tentatively slated for Firefox 29; however, they may be held for a future release if testing shows they're not ready by the time Firefox 29 is due to ship. Please keep an eye on this page to stay up to date on the plans for Firefox 29.

Template:deprecated_header, non-standard_header, obsolete_header

Template:deprecated_header inserts a deprecated mark bar spread out across the page to discourage the use of, e.g., a function, method or property which is officially deprecated. The deprecated bar typically would be placed directly underneath the main page title (or breadcrumb navigation if available) of, e.g., a specific function, method or property specification page. You can also include a version specification indicating the version in which the deprecation occurred.
{{deprecated_header()}} Result:

Deprecated
This feature has been removed from the Web. Though some browsers may still support it, it is in the process of being dropped. Do not use it in old or new projects. Pages or Web apps using it may break at any time.

Similarly, Template:non-standard_header and Template:obsolete_header can be used to mark non-standard and obsolete functionality.
{{Non-standard_header()}} Result:

Non-standard
This feature is non-standard and is not on a standards track. Do not use it on production sites facing the Web: it will not work for every user. There may also be large incompatibilities between implementations and the behavior may change in the future.

{{obsolete_header()}}. Result:

Obsolete
This feature is obsolete. Although it may still work in some browsers, its use is discouraged since it could be removed at any time. Try to avoid using it.

Templates tagging pages in the references/guides/tutorials

There are a number of templates for almost each large collection of pages (such as the DOM reference. They typically link back to the main page of the reference/guide/tutorial (this is often needed because our breadcrumbs sometimes can't do this) and put the article in the appropriate category.

E.g.: Template:DomRef, Template:CSSRef, Template:jsapi ref header, ...

Landing page components

We have an assortment of macros that can be used to automatically generate the contents of landing pages. Here they are.

Article lists divided by topic

We have an advanced macro that generates a menu of subpages, divided up into groups by topic area; this macro is called SubpageMenuByCategories, and it accepts as input a JSON array of tags and section names that correspond to those tags. Given that information, it pulls all subpages of the page on which the macro was invoked and produces a list of those pages, sorted into subheadings of the specified names, with each section's contents selected by the tags found on the articles.

Sections are listed in the order in which they're specified, and within each section, articles are sorted alphabetically.

Articles with the tag "Featured" are presented in special boxes at the top of the list; you should try to avoid having more than three of these.

The JSON input looks like this, for example:

{{SubpageMenuByCategories('[{"tag": "Overview", "name": "Overviews"}, {"tag": "Guide", "name": "Guides"}, {"tag": "Example", "name": "Sample code"}]')}}

This will split up the output among the headings "Overviews" (items found with the tag "Overview", "Guides" (items with the tag "Guide"), and "Sample code" (items with the tag "Example").

Community information boxes

Each top-level landing page, and some others, should have information about how to contact community related to that topic. The CommunityBox macro creates this for you. Its syntax:

{{CommunityBox(communityName, mailingListName, newsgroupName, ircChannelName, extraLinksString)}}

The IRC channel name and extra links string parameters are both optional.

The extra links string is a specially-formatted string for specifying the additional links that appear in the right-hand column of the box, below the IRC channel information. Its format:

heading|url|text|description||heading|url|text|description...

You may specify as many additional links as you need to (although you should try to keep this down to a scant handful, to avoid making the box unwieldy).

For example:

{{CommunityBox("UberSuperTech", "dev-ubersupertech", "dev.tech.ubersuper", "devmo", "MDN|https://developer.mozilla.org/|The MDN web site|Visit the Mozilla Developer Network||Mozilla|https://www.mozilla.org/|Mozilla's web site")}}

Join the UberSuperTech community

Mailing list/newsgroup:
Choose your preferred method for joining the discussion.

Note: Our style guide specifies that this box must be at the bottom of the page.

General-purpose templates

Template:block-title

Template:block-title can be used to create bolded text which visually serves as a title for a block in a page, does not appear in the auto-generated table of contents, and can act as a link target just as headings do. The syntax is: {{block-title(title)}}, where title is whatever you want displayed. title also serves as the target for links to the section you are titling. Template:block-title is meant for use in titling Template:sidenotes, tables, images, and code blocks, particularly in places where you'll be referring to the item more than once or in places not close to the item itself.

Template:Clr

Template:Clr inserts a <br style="clear:both;" /> to make sure the text following it is below any floating images or other figures. Usage: {{clr()}}.

  • Please note that using this template may mess up the layout of the whole page, e.g., if the navigational panel in default skin is floated at the left side, everything after {{clr()}} will also be below the navigational panel.

Template:CurrentGecko

CurrentGecko returns the current version number of Gecko, given an optional branch to return the version of. If no parameter is specified, the release branch version is returned. Allowed values are: release, beta, aurora, nightly, central (where nightly and central are the same). This is primarily intended for use from within other macros. The version number is extracted from the soruce tree for the given branch.

Template:Embed_text

The Embed_text template lets you embed an attached text file into the body of your article. This is helpful if you want to have code snippets that are both downloadable but also displayed within the article's content. You may optionally specify a language for syntax highlighting; if you don't specify one, the text is embedded unformatted. The first parameter is the filename of the attachment to embed; the second, if provided, is the language for the syntax highlighter to apply, such as "javascript", "svg", or "cpp".

Template:EmbedSVG

Template:EmbedSVG embeds an attached XML file as an SVG image, in place on the page. Simply specify the filename of the attached SVG file. You can use this in tandem with Embed_text to show the source and then the rendered output of the same file.

Template:Gecko

The Template:Gecko template inserts the text "Gecko versionnumber" into the text of your article, but adds a tooltip to the text that, when the user hovers over it, displays the corresponding versions of Firefox, Thunderbird, and SeaMonkey. For example, "{{gecko("1.9")}}" looks like this: Gecko 1.9.

Template:hX_gecko_minversion

These templates let you insert headers (h1, h2, and h3) that include at the right end of the line a badge indicating the Gecko version (and corresponding app versions) that the section applies to. For example, {{h3_gecko_minversion("This is important information", "1.9.2")}} looks like this:

(Firefox 3.6 / Thunderbird 3.1 / Fennec 1.0)

This is important information

Template:Note and Template:warning

Template:Note inserts a specially-formatted "note" block into the article's text. This is intended to call out an interesting or important fact. It uses the "note" CSS class. Using the template instead of directly using the class allows us to make more changes to the appearance of the notes more easily in the future (but offers less flexibility).
Usage: {{note("This is an important note.")}}. Result:

Note: This is an important note.

Similarly, Template:warning inserts a specially-formatted "warning" block (uses class="warning").
{{warning("Danger, Will Robinson!")}} results in:

Warning: Danger, Will Robinson!

Template:ref and Template:endnote

Template:ref and Template:endnote can be used to implement footnotes to articles. The footnote "number" is created using {{ref("something")}}, where something should be some suitably descriptive word for whatever is being mentioned in the footnote. Then, at the end of the document, insert the following to create a numbered list for the footnotes' information:

# ^ Blah blah, text for first footnote
# ^ The text for another footnote
# ...

Template:deprecated_inline

Template:deprecated_inline inserts an in-line deprecated mark to discourage the use of, e.g., a function, method or property which is officially deprecated. You can optionally include a version number specification for what version the deprecation occurred in.
Usage:{{deprecated_inline()}}. Example:

  • Item 1
  • Item 2
  • Item 3

Template:non-standard_inline

Template:non-standard_inline inserts an in-line non-standard mark to discourage the use of, e.g., a function, method, property, or attribute which has not been standardized.
Usage: {{Non-standard_inline()}}. Example:

  • Item 1
  • Item 2
  • Item 3

Template:obsolete_inline

Template:obsolete_inline inserts an in-line obsolete mark to prevent the use of e.g. a function, method or property which is officially obsolete. You can, optionally, include a technology (HTML, CSS, JS, or Gecko) and version in which it became obsolete. The old method of use with just the Gecko version number is available for compatibility only.
Usage: {{obsolete_inline([tech&version])}}. Example:

  • Item 1
  • Item 2
  • Item 3 Obsolete since Gecko 1.9.1
  • Item 4

Template:js_obsolete_inline

Please use {{ anch("Template:obsolete_inline") }} instead.

Template:js_obsolete_header

Template:js_obsolete_header inserts banner to indicate that a given JavaScript feature is not available any longer; you can optionally include a JavaScript version number in which it became obsolete. Usage:{{js_obsolete_header([javascript version])}}. Example:

Obsolete since JavaScript 1.8.5
This feature is obsolete. Although it may still work in some browsers, its use is discouraged since it could be removed at any time. Try to avoid using it.

Template:optional_inline

Template:optional_inline inserts an in-line "optional" remark, intended to be used to indicate when a parameter to a function is optional.

Usage: {{optional_inline()}}. Example:

parameterX Optional
Blah blah blah...

Template:MobileOnlyInline

Template:MobileOnlyInline inserts an in-line "Available only for mobile Firefox" remark; intended for use in tables and lists. It indicates the version of Gecko as of which the interface is still only available for mobile.

Usage: {{MobileOnlyInline(geckoVersion)}}. Example:

  • Some item Mobile Only in Gecko 2.0

Template:MobileOnlyHeader

Template:MobileOnlyHeader inserts an "Available only for mobile Firefox" header box. It indicates the version of Gecko as of which the interface is still only available for mobile.

Usage: {{MobileOnlyHeader(geckoVersion)}}. Example:

Mobile Only in Gecko 2.0
Available only in Firefox Mobile as of Gecko 2.0 (Firefox 4 / Thunderbird 3.3 / SeaMonkey 2.1)

Template:ReadOnlyInline

Template:ReadOnlyInline inserts an in-line "Read only" mark to indicate that an API is read-only. This template accepts no parameters. Usage: {{ReadOnlyInline()}}. Example:

isCustomObject Read only
Indicates, if true, that the object is a custom one.

Template:renamed_inline

Template:renamed_inline inserts an in-line "renamed" mark to indicate that an API has been renamed. You provide the Gecko version in which the change occurred, as well as the new name.
Usage: {{renamed_inline(oldname, geckoversion)}}. Example:

  • apiname Renamed from wasapiname in Gecko 1.9

Template:unimplemented_inline

Template:unimplemented_inline inserts an in-line "unimplemented" mark to prevent the use of e.g. a function, method or property which is not yet implemented. You can, optionally, include a bug number indicating the bug covering the request to implement the feature. Usage: {{unimplemented_inline()}}. Example:

  • Item 1
  • Item 2 Unimplemented
  • Item 3 Unimplemented (see bug 11011)

Template:unimplemented_inline_webkit

Template:unimplemented_inline_webkit inserts an in-line "unimplemented" mark to prevent the use of e.g. a function, method or property which is not yet implemented. You can, optionally, include a WebKit bug number indicating the bug covering the request to implement the feature. Usage: {{unimplemented_inline_webkit()}}.

Template:Previous, Template:Next, and Template:PreviousNext

Template:Previous, Template:Next, and Template:PreviousNext provide navigation controls for articles which are part of sequences. For the single-way templates, the only parameter needed is the wiki location of the previous or next article in the sequence. For PreviousNext, the two parameters needed are the wiki locations of the appropriate articles. The first parameter is for the previous article and the second is for the next article.

Template:localString

Template:localString is primarily created for template developers and localizers. It takes a map of translated strings and returns a string appropriate for page language. For example,

// Templates return XML documents, so to get a string you have to wrap template result with xml.text()
xml.text(localString({
  en: "hello world",
  de: "hallo Welt"}));

on a page in https://developer.mozilla.org/en-US/docs/ subtree returns

hello world

and on a page in https://developer.mozilla.org/de/docs/ subtree returns

hallo Welt

As you might have guessed, page language is determined by taking the first part of the path of page URL. For example, if page URL is

https://developer.mozilla.org/en-US/docs/JavaScript

then the determined page language is en.

If used on a user's page, the template determines page language from page properties.

If there is no translation provided for current page's language, then English variant is used. So the above example would return

hello world

in https://developer.mozilla.org/it/docs/ subtree.

Version information templates

Interface reference summaries

Every article in the interface reference should start with the interface summary block, which is created using Template:IFSummary. This creates a uniform, standard format block at the top of the page with basic information about the interface. The template accepts up to 7 parameters, but requires only the first four. The parameters are, in order:

Path of the IDL file defining the interface
This is used to create a link to the interface's IDL on MXR so the reader can refer to it if they wish.
Parent interface
This is the name of the interface upon which the interface being document is based. This will be turned into a link to that interface in the interface reference and displayed.
scriptable/not scriptable
A string indicating whether the interface is scriptable or not. You must use either "scriptable" or "not scriptable" (these are, however, case insensitive). This will be turned into an appropriate indicator in the box, colored green for scriptable interfaces or red for non-scriptable ones. The indicator will also include a link to an article explaining what this means.
Last changed in what Gecko version
This is a string indicating the version of Gecko in which the interface was last changed. Should be a string in standard Gecko version format, such as "1.9" or "1.9.2" or even "1.9.1.6".
Summary Optional
A brief textual summary of what the interface does. Should be just a sentence or two. This is only optional for backward compatibility with old interface documents using the now deprecated InterfaceStatus template (which now calls through to this one). You should always provide this.
Version introduced Optional
If you know the version of Gecko in which the interface was introduced, include that here. This will trigger the inclusion of a version timeline showing the availability of the interface in contrast to the history of Gecko, in graphical format.
Version deprecated Optional
If the interface is deprecated, include that here. This will be used when drawing the version timeline diagram.
Version obsoleted Optional
Similarly, if the interface is obsolete and no longer available at all, include the Gecko version in which that took effect.

Examples:

{{IFSummary("netwerk/base/public/nsIIOService.idl", "nsISupports", "scriptable", "1.9", "Provides assorted network utility functions, as well as functions to parse URLs.", "1.1", "1.8.1", "1.9.2")}}

Provides assorted network utility functions, as well as functions to parse URLs.
1.0
28
Introduced
Gecko 1.1
Deprecated
Gecko 1.8.1
Obsolete
Gecko 1.9.2
Inherits from: nsISupports Last changed in Gecko 1.9 (Firefox 3)

{{IFSummary("netwerk/base/public/nsIIOService.idl", "nsISupports", "scriptable", "1.9", "Provides assorted network utility functions, as well as functions to parse URLs.", "1.1")}}

Provides assorted network utility functions, as well as functions to parse URLs.
1.0
28
Introduced
Gecko 1.1
Inherits from: nsISupports Last changed in Gecko 1.9 (Firefox 3)

{{IFSummary("netwerk/base/public/nsIIOService.idl", "nsISupports", "scriptable", "1.9.1")}}

Please add a summary to this article.
Inherits from: nsISupports Last changed in Gecko 1.9 (Firefox 3)

If your summary is more complex and needs to include non-plaintext content, you can use Template:IFSummaryStart and Template:IFSummaryEnd to bracket your summary content.

Marking articles or sections as specific to a given release

Version-specific notes and call-out boxes

You can include a Gecko version specific call-out box using a combination of the Template:gecko_callout_heading template and the "geckoVersionNote" CSS class. To do this, write your text, including the use of the heading template, then select it all and click the <div> button in the editor's toolbar. Choose "Version note box" from the style pop-up menu in the dialog box that appears and click OK.

For example:

Gecko 1.9 note
(Firefox 3)

Everything in this div block is specific to Gecko 1.9. You can include pretty much anything in here, including code samples, headings, and other information, so it's good for everything from small blocks to very large sections of content about a specific Gecko version.

See, here's a code sample:

var foo = someFunction(bar);
if (foo) {
  foobar(foo);
} else {
  alert("No foo!");
}

See? Very nifty.

Adding version indicators to content

These macros are used to indicate that content is relevant only to specific versions of a product.

GeckoVersionIndicator
Inserts an indicator explaining that the content is relevant only to a specified Gecko version and later. MORE DETAIL SOON.

Creating bug tables

Sometimes you need to create a table listing bugs and their descriptions; this could be to list problems with a technology, or bugs that need to be resolved in order to implement it. This could also be used to list documentation bugs people could help fix. Either way, we have templates to help build these tables!

First, start your table with the template BugTableStart. This takes no parameters. Then use BugTableRow once for each bug, specifying the bug number as a parameter. Finally, close out your table with BugTableEnd. For example:

{{BugTableStart}}
{{BugTableRow(749313)}}
{{BugTableRow(702758)}}
{{BugTableRow(772950)}}
{{BugTableEnd}}

The result is:

Bug Description
749313 Wiki: Edit screen should provide tag suggestions
702758 Add WAI-ARIA role="contentinfo" to "last modified" container
772950 Don't show "approved" information on history pages

HTML documentation specific macros

These macros are specifically for use in the docs for HTML.

Template:HTMLRefList

HTMLRefList inserts an ordered list of links to the top-level pages that are considered part of the HTML reference. This is for use in quicklinks, zone subnavigation, etc.

Template:HTMLGuideList

HTMLGuideList inserts an ordered list of links to the top-level pages that are considered part of the HTML guide. This is for use in quicklinks, zone subnavigation, etc.

Nesting templates

You can't nest templates. Instead, we are creating templates that make it possible to start and end blocks that might need to contain other template calls. See WarningStart and WarningEnd for example.

See also