View source for Template:Probox/doc

{{documentation subpage}}
<!-- PLEASE ADD CATEGORIES AND INTERWIKIS AT THE BOTTOM OF THIS PAGE. -->

Probox is a configurable infobox framework for project pages, built in [[Lua (programming language)|Lua]]. The <nowiki>{{</nowiki>'''Probox'''<nowiki>}}</nowiki> template provides a framework for creating infoboxes for project pages, such as grant proposals, research proposals, and IdeaLab ideas. Probox infoboxes work with the [[m:Meta:FormWizard|FormWizard page creation gadget]] and the upcoming [[m:Meta:AddMe|addMe gadget]], allowing people to create, endorse and join projects without messing around with template parameters.

''See also:''
*[[m:Meta:Probox]]
*[[Module:Probox]]

== Using the default Probox ==
''See [[m:Meta:Probox#Default]]''
<includeonly>{{Probox
|project=My test project
|portal=Default
|status=planned
|summary=A great way to while away a lazy afternoon
|image=File:Kleiner_Waldchampignon_Agaricus_silvaticus.jpg
|creator=Jtmorgan
|member=EpochFail
|member3=Ironholds
|member2=Quiddity
|member9=Jeph paul
|more_participants=NO
|timestamp=March 22nd, 2025
}}</includeonly>

;Example code
<syntaxhighlight lang="wikitext" style="width:60%;">
{{Probox
|project=My test project
|portal=Default
|status=planned
|summary=A great way to while away a lazy afternoon
|image=File:Kleiner_Waldchampignon_Agaricus_silvaticus.jpg
|creator=Jtmorgan
|member=EpochFail
|member3=Ironholds
|member2=Quiddity
|member9=Jeph paul
|more_participants=YES
|timestamp=March 22nd, 2025
}}
</syntaxhighlight>

== Creating custom Proboxes ==
You can change the styling, fields, and interface text of probox infoboxes by creating a custom datasheet and content page. For examples of custom proboxes, see [[Meta:Probox#Deployments]].

=== Sections ===
[[File:Probox structure diagram.png|thumb|The basic template structure. Outer and inner wrapper sections (used for formatting only) have dotted borders. Sections that can contain content have solid borders: black bordered sections are displayed by default; grey bordered sections only display if they contain content. ]]

;outer: This is a wrapper for the infobox. All other sections are inside it. It contains CSS hooks that define the basic styling of the infobox, such as width, position, etc.

;above: This is the first content section of the infobox. It displays content above the grey infobox ("Inner box"). 

;inner: This is the inner box. It doesn't contain any content directly, but rather contains all content sections except "Above" and "Below". It has a grey background by default, but this can be changed.

;head: This is the header section of the infobox. It contains basic information such as the title of the project (required) and an image that goes along with the project (optional)

;main: This is the main content section of the infobox. The primary descriptive information about the project, such as a summary and a project contact (both required) go here.

;participants: This section can be used to display other information about the project, such as an (optional) list of participants. The default background color is white, to set this section apart from the main section. It also has extra padding by default, so that it is displayed as a sub-section on Main.

;cta: This section can be used to put ''calls to action'' (CTAs), such as buttons to invite users to join the project, or an invitation to give feedback on the project talk page.

;below: This section can be used for other meta-information about the project, such as the date it was created, or external links.

=== Styling and formatting ===
Each section of the template can be styled individually. Some sections are always displayed by default, others will only be displayed if certain parameters are included when the template is called. The styles dictionary in the datasheet contains all configurable styling and formatting information for the infobox. 

;Box style: The styling of the divs that define the outer and inner boxes (see diagram above) is defined in m.styles.box.outer and m.styles.box.inner. 

;Section style: You can add style information at the section level using the m.styles.sections.''sectiontitle'' dictionary. 

;Field style: You can add style information to individual fields at three points in the m.fields.''fieldname'' dictionary in the infobox datasheet:
* '''style''' defines the CSS style for the field div
* '''style2''' defines the CSS style for the field title span (if there is one)
* '''style3''' defines the style for the field value span

Leave any unused style keys as empty strings if you don't need extra styling for that field (for example, m.fields.title.style2 can be blank because the title for the title field is not displayed). 

'''Field style classes'''
You can also set style classes (which can be used by multiple fields) in the m.styles.field dictionary. For example, the default font size m.styles.field.h1 is 1.3em. To make a particular field use that font size, set m.fields.''fieldname''.style2 = m.styles.field.h1. 

==Translation==
Probox is fully translatable. The interface text (field titles like "summary" and button titles like "join") are translatable using [[Template:TCT|the translatable content template]] system. TCT is used instead of other systems like [[Template:TNT|TNT]] in order to separate content from structure and formatting, making it easier to update non-text parts of the template without working around [[Meta:Translate_extension|markup created by the translation extension]] and [[User:FuzzyBot]]. 

===Translating interface text===
Any Probox can be set up for translation by marking the relevant content subpage translatable. Several already have been.

''Proboxes currently in translation:''
* IdeaLab ([[Meta:Probox/Idealab|example]], [[Module:Probox/Idealab|config]], [[Template:Probox/Idealab/Content|content]])
* IEG ([[Meta:Probox/IEG|example]], [[Module:Probox/IEG|config]], [[Template:Probox/IEG/Content|content]])
* Inspire ([[User:Jmorgan_(WMF)/Inspire_probox|example]], [[Module:Probox/Inspire|config]], [[Template:Probox/Inspire/Content|content]])
* Learning patterns ([[User:Jmorgan_(WMF)/Pattern_probox|example]], [[Module:Probox/Patterns|config]], [[Template:Probox/Patterns/Content|content]])

===Translating content===
You can translate the content of Probox parameters on any content page that has been marked for translation the same way you would any other text on that page: by wrapping the text in translation tags. Here's a good example: [[Grants:IdeaLab/Reimagining_WMF_grants]]

==Adding categories==
Probox does not automatically add categories to pages. However, if you use a child datasheet you can automatically add categories to pages that use your Probox template with the m.categories dictionary. Just add your categories to m.categories.default, like this:

<code>m.categories.default = "<nowiki>[[Category:My_first_category]] [[Category:My_second_category]]</nowiki>"</code>

== Dependencies ==
* [[Module:Probox]] - the [[w:WP:LUA|Lua]] module on which this template is based

<includeonly>{{Sandbox other||
[[Category:Infobox templates| ]]
[[Category:Templates based on the Infobox Lua module]]
}}</includeonly>