Community Central
Don't have an account?
Register
Register
Community Central
Community Central
35,364
pages
in: Blog posts

Changes: User blog:Thisismyrofl/Customizing a portable new-style infobox

Back to page
 
Tag: sourceedit
Line 1: Line 1:
  +
{{Blogs by Thisismyrofl}}
⚫
#REDIRECT [[User blog:Thisismyrofl/Creating a portable new-style infobox]]
  
  +
{{Infobox Wolf3D level
  +
| title = Episode 1, Floor 1
  +
| image = E1M1 Screenshot.png
  +
| imagecaption = The level opens on the body of a dead Guard.
  +
| crosses = 8
  +
| chalices = 7
  +
| chests = 7
  +
| par = 1:30
  +
| song = "Get Them"
  +
| secrets = 5
  +
}}Hey! This is [[User:Thisismyrofl|Thisismyrofl]], an admin here on Community Central. I wanted to see if I could explain how to use the ''new'' style of [[Template:Infobox]] (new as in September 2012). On your left, you see a basic infobox made in the new infobox format. We'll learn how to make an infobox of our own to meet our specific needs!
  +
  +
I'm referring here to the ''default'' styles, that is, those that were on the [[c:starter:Template:Infobox|Starter Pages Wiki's '''Template:Infobox''' page]]. Since every newly created wiki, at the time of its creation, is given a copy of every page and template on Starter Pages Wiki, that means that there are thousands of wikis that came with the ''old'' style, and thousands founded after September 2012 that came with the ''new'' style.
  +
  +
== Plan the infobox ==
  +
Let's make a plan! Think about what you want your infobox to look like, and decide about visibility. It might help to write down your plan on a piece of paper, or type it somewhere.
  +
  +
If I wanted to make a template "[[:Template:Infobox Wolf3D level]]" for the game ''Wolfenstein 3D'', it might follow this format:
  +
  +
<pre>
  +
Template:Infobox Wolf3D level
  +
* Title
  +
* Image
  +
* Image caption
  +
* Heading: "Treasure"
  +
** Number of crosses (default: "0")
  +
** Number of chalices (default: "0")
  +
** Number of chests (default: "0")
  +
* Heading: "Other stats"
  +
** Par time (default: hidden)
  +
** Song that plays (default: hidden)
  +
** Number of secrets (default: hidden)
  +
</pre>
  +
  +
If a row is left empty when the template is called, we must decide whether it should give a '''default value''' (such as "Unknown") or be '''hidden''' (that is, the row won't show up at all). Jump to the section [[#Visibility]] for more information. Mark on your plan how you want each row to be treated.
  +
  +
=== Default syntax ===
  +
  +
Let's also make the default syntax for the new template! This can be copied into the template's documentation. It should look something like this.
  +
  +
<pre>
  +
{{Infobox Wolf3D level
  +
| title =
  +
| image =
  +
| imagewidth =
  +
| imagecaption =
  +
| crosses =
  +
| chalices =
  +
| chests =
  +
| par =
  +
| song =
  +
| secrets =
  +
}}
  +
  +
</pre>
  +
  +
This is what will be pasted into an article and then filled out to make a fully-fledged infobox appear on the article! But before it works, you need to customize the page "Infobox Wolf3D level" on your wiki. Try not to be excessive in naming the parameters: lowercase, typed as one word is sufficient, because it doesn't affect the appearance of the infobox anyway.
  +
  +
Now that we've planned it out, let's customize our infobox.
  +
  +
== Understanding the code ==
  +
Let's take a look at the standard code of [[:Template:Infobox]]. Remember that this is the ''default'' code, and not necessarily the code that will be seen on your infobox. I've colored it myself for clarity - you're not likely to see this kind of coloring when you actually edit.
  +
  +
{{Thisismyrofl-infobox-explain}}
  +
  +
=== Visibility ===
  +
There are two types of infobox rows: those with default values and those which are hidden if no value is given. By default, the first three have default values, and the fourth, fifth, and sixth are hidden.
  +
  +
Below, two infoboxes: on the right, I have filled in the template entirely, but on the left I have left all six fields blank. Because they're blank, the first three return the default value "''Unknown''". The fourth, fifth, and sixth are differently coded: when no value is specified, they do not appear at all. Keep this difference in mind.
  +
  +
{| style="background:transparent; border:transparent; margin-left:auto; margin-right:auto;"
  +
| style="width:300px; vertical-align:top;" |
  +
{{infobox (new)
  +
| title = New infobox
  +
| image =
  +
| imagewidth =
  +
| imagecaption =
  +
}}
  +
| style="width:300px; |
  +
{{infobox (new)
  +
| title = New infobox
  +
| image =
  +
| imagewidth =
  +
| imagecaption =
  +
| first = Foo
  +
| second = Bar
  +
| third = Baz
  +
| fourth = Lol
  +
| fifth = Hoo
  +
| sixth = Hum
  +
}}
  +
|}
  +
  +
  +
== Edit your infobox! ==
  +
  +
'''DON'T CHANGE THE PAGE [[Template:Infobox]]! You're supposed to leave it unchanged and edit ''other'' infobox templates, which you can copy from Template:Infobox.'''
  +
  +
I'll assume that at this point, you already have an infobox or infobox template at the location '''"Infobox Wolf3D level" on ''your'' wiki'''<ref group="footnotes" name="cantfind" />, or whatever you've decided to name it. If you haven't, take a look at my other blog: [[User blog:Thisismyrofl/Creating a new-style infobox]].
  +
  +
Any part of this can be modified, but look at the {{Color|green|green}}, {{Color|red|red}}, and {{Color|blue|blue}} parts. Those are the important parts we need to work with. Until your abilities with templates have improved, it's best to leave the {{Color|purple|purple}} and {{Color|orange|orange}} parts alone.
  +
  +
=== Editing headings ===
  +
:''[http://c.wikia.com/wiki/Template:Infobox_Wolf3D_level?diff=1213492 Click here to see how I did it!]''
  +
By default, the infobox has two heading snippets, highlighted in green in my above code. Their default texts are "some attributes" and "other attributes".
  +
<poem style="font-family:monospace; color:green;">
  +
|-
  +
! colspan="2" | <di<nowiki/>v class="wikia-infobox-section-header"><span style="background:yellow;">Some attributes</span></div></poem>
  +
  +
The default texts aren't really specific enough for a lot of wikis. Just change the text "Some attributes" and "Other attributes" (highlighted here in <span style="color:green;background:yellow;">yellow</span>) to your liking! You can leave the rest of the code intact.
  +
  +
As always, you can remove either or both of the headings if you want (just delete any code that looks like the above heading) or add headings (just paste in a copy of the above code).
  +
  +
=== Editing rows with defaults ===
  +
:''[http://c.wikia.com/wiki/Template:Infobox_Wolf3D_level?diff=1213494 Click here to see how I did it!]''
  +
By default, the infobox has six rows, the first three of which have the property that when a parameter is undefined, the row still shows - showing instead a default text.
  +
<poem style="font-family:monospace; color:red;">
  +
|-
  +
! <span style="background:cyan">First</span>
  +
| {{<nowiki/>{<span style="background:yellowgreen">first</span>|<span style="background:yellow">'<nowiki/>'Unknown'<nowiki/>'</span>}}}
  +
  +
|-
  +
! Second
  +
| {{<nowiki/>{second|'<nowiki/>'Unknown'<nowiki/>'}}}
  +
  +
|-
  +
! Third
  +
| {{<nowiki/>{third|'<nowiki/>'Unknown'<nowiki/>'}}}
  +
</poem>
  +
  +
Each of these three obvious snippets is a row, but the default headings ("first", "second", "third") don't work for a lot of people. So we can feel free to change them! I've highlighted the bits of code you'd edit.
  +
# Change the header text (here highlighted in <span style="background:cyan;color:red;">cyan</span>) to read whatever you want to appear on the left side of the infobox row.
  +
# Change the parameter name (here highlighted in <span style="background:yellowgreen;color:red;">green</span>) to display the parameter name you decided on in your [[#Default syntax|default syntax earlier]]. For example, my first parameter was to be "crosses", so I'd type <code><nowiki>{{{crosses|...}}}</nowiki></code> where the ellipsis ("...") stands for the default text - see the next step.
  +
# Change the default text (highlighted in <span style="color:red;background:yellow;">yellow</span>) if you want. The default action is that an unspecified parameter will display the code <code><nowiki>''Unknown''</nowiki></code> which returns an italicized: "''Unknown''". You can change the default text to whatever you want, and format it with italics, without italics, or otherwise. For example, my default number of crosses was to be "0". So, combined with the parameter name from earlier, I'd type <code><nowiki>{{{crosses|0}}}</nowiki></code>
  +
# I've highlighted and explained how to edit the "First" row, but you can follow the same steps for the second and third.
  +
  +
As always, remember that you can remove one, two, or all three of the above snippets of code in order to use ''fewer'' rows with defaults (perhaps if you want all your rows to be hidden), or you can add your own.
  +
  +
=== Editing rows that hide ===
  +
:''[http://c.wikia.com/wiki/Template:Infobox_Wolf3D_level?diff=1213558 Click here to see how I did it!]''
  +
By default, the infobox has six rows, the fourth, fifth, and sixth of which have the property that when a parameter is undefined, the row does not appear at all. Contrast with the above behavior.
  +
<poem style="font-family:monospace; color:blue;">
  +
|-
  +
{<nowiki/>{#if: {{<nowiki/>{<span style="background:yellowgreen">fourth</span>|}}} |
  +
! <span style="background:cyan">Fourth</span>
  +
{<nowiki/>{!}} {{<nowiki/>{<span style="background:yellowgreen">fourth</span>}}}
  +
| }}
  +
  +
|-
  +
{<nowiki/>{#if: {{<nowiki/>{fifth|}}} |
  +
! Fifth
  +
{<nowiki/>{!}} {{<nowiki/>{fifth}}}
  +
| }}
  +
  +
|-
  +
{<nowiki/>{#if: {{<nowiki/>{sixth|}}} |
  +
! Sixth
  +
{<nowiki/>{!}} {{<nowiki/>{sixth}}}
  +
| }}
  +
</poem>
  +
  +
Each of these three obvious snippets is a row, but the default headings ("fourth", "fifth", "sixth") don't work for a lot of people. So we can feel free to change them! I've highlighted the bits of code you'd edit.
  +
# Change the header text (here highlighted in <span style="background:cyan;color:blue;">cyan</span>) to read whatever you want to appear on the left side of the infobox row.
  +
# Change the parameter name (here highlighted in <span style="background:yellowgreen;color:blue;">green</span>) to display the parameter name you decided on in your [[#Default syntax|default syntax earlier]]. For example, my first parameter which I wanted to be hidden was to be "par", so I'd type <code><nowiki>{{{par|}}}</nowiki></code> in the first spot and <code><nowiki>{{{par}}}</nowiki></code> in the second. (It makes a difference!)
  +
# I've highlighted and explained how to edit the "Fourth" row, but you can follow the same steps for "Fifth" and "Sixth".
  +
  +
As always, remember that you can remove one, two, or all three of the above snippets of code in order to use ''fewer'' rows with default action to hide, or you can add your own.
  +
  +
== We're mostly done! ==
  +
'''Now you can save the page!''' Enjoy your new infobox! Paste your [[#Default syntax|default syntax]] into an article and fill it in. The infobox I made looks like the one on the right. Super pretty!
  +
  +
== Finishing touches ==
  +
The above steps are the important part, which is why I had you save the page. There's a few other things that we can do, but your template will function fine without them.
  +
  +
=== Default title ===
  +
:''[http://c.wikia.com/wiki/Template:Infobox_Wolf3D_level?diff=1213562 Click here to see how I did it!]''
  +
The <code>|title=</code> parameter controls what appears at the top of the infobox, in the fourth row of the code.
  +
<poem style="color:purple;font-family:monospace;">! class="wikia-infobox-header" colspan="2" | {{<nowiki/>{title|'<nowiki/>'Unknown'<nowiki/>'}}}</poem>
  +
By default, you have to fill it in, otherwise your infobox will have a nasty italicized "''Unknown''" at the top. A smarter behavior can be brought about by switching in a <code><nowiki>{{PAGENAME}}</nowiki></code> [[Help:Magic words|magic word]]:
  +
<poem style="color:purple;font-family:monospace;">! class="wikia-infobox-header" colspan="2" | {{<nowiki/>{title|{<nowiki/>{PAGENAME}<nowiki/>}}}}</poem>
  +
Now, if the title is left blank, it'll default to the name of the page. You might still have to edit the <code>|title=</code> parameter on some pages.
  +
  +
=== Documentation ===
  +
Templates are kinda complicated, so it's best to have a little snippet of information on how to use it at the bottom of the template. You'll notice that at the bottom of the default template code, there's a <code>{<nowiki/>{Documentation}}</code> template call. This calls [[:Template:Documentation]], which varies from wiki to wiki, but in any case, it will transclude the page located at '''Template:Your template/doc'''.
  +
  +
Here's a wise layout for your new template's documentation:
  +
<pre>
  +
== Default syntax==
  +
Paste this into the page, then fill it in, to use the template.
  +
<pre>
  +
{{Infobox Wolf3D level
  +
| title =
  +
| image =
  +
| imagewidth =
  +
| imagecaption =
  +
| crosses =
  +
| chalices =
  +
| chests =
  +
| par =
  +
| song =
  +
| secrets =
  +
}}
  +
&lt;/pre>
  +
  +
<noinclude>[[Category:Template documentation]]</noinclude>
  +
</pre>
  +
  +
Paste that to '''[[Template:Infobox Wolf3D level/doc]] (substituting in the name of your infobox) on ''your'' wiki'''<ref group="footnotes" name="cantfind" /> Remember, though, that you need to substitute in ''your'' [[#Default syntax|default syntax]] for what I've pasted here.
  +
  +
=== Be bold! ===
  +
I've only outlined the basics of editing infoboxes. Feel free to '''be bold''' and try editing them further! If you mess up, you can always undo the edits from the page's [[Help:history|history]].
  +
  +
== Notes ==
  +
<references group="footnotes">
  +
<ref name="cantfind">
  +
A number of times, this page refers to pages on ''your'' wiki, such as '''"[[Template:Infobox]] on ''your'' wiki"'''. I don't know what your wiki is, so I can't directly link to it, but if you're having trouble finding the correct page, just click the link to go to ''the equivalent page on Community Central'', then edit the URL so that <code>community.wikia.com</code> is substituted with your wiki's URL: for example <code>wolfenstein.wikia.com</code>.
  +
</ref>
  +
</references>
  +
  +
== See also ==
  +
* [[Help:Infobox]]
  +
* [[User blog:Thisismyrofl/Infoboxes old and new]]
  ⚫
* [[User blog:Thisismyrofl/Creating a new-style infobox]]
  +
* [[User blog:Rappy 4187/Guide to Infoboxes]]
  +
  +
[[Category:Blog posts]]

Revision as of 19:17, 5 December 2015

150px-1330470.png Other blogs by Thisismyrofl
Infoboxes
Suggestions


Template:Infobox Wolf3D levelHey! This is Thisismyrofl, an admin here on Community Central. I wanted to see if I could explain how to use the new style of Template:Infobox (new as in September 2012). On your left, you see a basic infobox made in the new infobox format. We'll learn how to make an infobox of our own to meet our specific needs!

I'm referring here to the default styles, that is, those that were on the Starter Pages Wiki's Template:Infobox page. Since every newly created wiki, at the time of its creation, is given a copy of every page and template on Starter Pages Wiki, that means that there are thousands of wikis that came with the old style, and thousands founded after September 2012 that came with the new style.

Plan the infobox

Let's make a plan! Think about what you want your infobox to look like, and decide about visibility. It might help to write down your plan on a piece of paper, or type it somewhere.

If I wanted to make a template "Template:Infobox Wolf3D level" for the game Wolfenstein 3D, it might follow this format: 

Template:Infobox Wolf3D level
* Title
* Image
* Image caption
*  Heading: "Treasure"
** Number of crosses	(default: "0")
** Number of chalices	(default: "0")
** Number of chests	(default: "0")
* Heading: "Other stats"
** Par time		(default: hidden)
** Song that plays	(default: hidden)
** Number of secrets	(default: hidden)

If a row is left empty when the template is called, we must decide whether it should give a default value (such as "Unknown") or be hidden (that is, the row won't show up at all). Jump to the section #Visibility for more information. Mark on your plan how you want each row to be treated.

Default syntax

Let's also make the default syntax for the new template! This can be copied into the template's documentation. It should look something like this. 

{{Infobox Wolf3D level
| title        = 
| image        = 
| imagewidth   = 
| imagecaption = 
| crosses      = 
| chalices     = 
| chests       = 
| par          = 
| song         = 
| secrets      = 
}}

This is what will be pasted into an article and then filled out to make a fully-fledged infobox appear on the article! But before it works, you need to customize the page "Infobox Wolf3D level" on your wiki. Try not to be excessive in naming the parameters: lowercase, typed as one word is sufficient, because it doesn't affect the appearance of the infobox anyway.

Now that we've planned it out, let's customize our infobox.

Understanding the code

Let's take a look at the standard code of Template:Infobox. Remember that this is the default code, and not necessarily the code that will be seen on your infobox. I've colored it myself for clarity - you're not likely to see this kind of coloring when you actually edit.

Template:Thisismyrofl-infobox-explain

Visibility

There are two types of infobox rows: those with default values and those which are hidden if no value is given. By default, the first three have default values, and the fourth, fifth, and sixth are hidden.

Below, two infoboxes: on the right, I have filled in the template entirely, but on the left I have left all six fields blank. Because they're blank, the first three return the default value "Unknown". The fourth, fifth, and sixth are differently coded: when no value is specified, they do not appear at all. Keep this difference in mind.


Edit your infobox!

DON'T CHANGE THE PAGE Template:Infobox! You're supposed to leave it unchanged and edit other infobox templates, which you can copy from Template:Infobox.

I'll assume that at this point, you already have an infobox or infobox template at the location "Infobox Wolf3D level" on your wiki[footnotes 1], or whatever you've decided to name it. If you haven't, take a look at my other blog: User blog:Thisismyrofl/Creating a new-style infobox.

Any part of this can be modified, but look at the {{{3}}}, {{{3}}}, and {{{3}}} parts. Those are the important parts we need to work with. Until your abilities with templates have improved, it's best to leave the {{{3}}} and {{{3}}} parts alone.

Editing headings

Click here to see how I did it!

By default, the infobox has two heading snippets, highlighted in green in my above code. Their default texts are "some attributes" and "other attributes".

|-

! colspan="2" | <div class="wikia-infobox-section-header">Some attributes

The default texts aren't really specific enough for a lot of wikis. Just change the text "Some attributes" and "Other attributes" (highlighted here in yellow) to your liking! You can leave the rest of the code intact.

As always, you can remove either or both of the headings if you want (just delete any code that looks like the above heading) or add headings (just paste in a copy of the above code).

Editing rows with defaults

Click here to see how I did it!

By default, the infobox has six rows, the first three of which have the property that when a parameter is undefined, the row still shows - showing instead a default text.

|-
! First
| {{{first|''Unknown''}}}

|-
! Second
| {{{second|''Unknown''}}}

|-
! Third
| {{{third|''Unknown''}}}

Each of these three obvious snippets is a row, but the default headings ("first", "second", "third") don't work for a lot of people. So we can feel free to change them! I've highlighted the bits of code you'd edit.

  1. Change the header text (here highlighted in cyan) to read whatever you want to appear on the left side of the infobox row.
  2. Change the parameter name (here highlighted in green) to display the parameter name you decided on in your default syntax earlier. For example, my first parameter was to be "crosses", so I'd type {{{crosses|...}}} where the ellipsis ("...") stands for the default text - see the next step.
  3. Change the default text (highlighted in yellow) if you want. The default action is that an unspecified parameter will display the code ''Unknown'' which returns an italicized: "Unknown". You can change the default text to whatever you want, and format it with italics, without italics, or otherwise. For example, my default number of crosses was to be "0". So, combined with the parameter name from earlier, I'd type {{{crosses|0}}}
  4. I've highlighted and explained how to edit the "First" row, but you can follow the same steps for the second and third.

As always, remember that you can remove one, two, or all three of the above snippets of code in order to use fewer rows with defaults (perhaps if you want all your rows to be hidden), or you can add your own.

Editing rows that hide

Click here to see how I did it!

By default, the infobox has six rows, the fourth, fifth, and sixth of which have the property that when a parameter is undefined, the row does not appear at all. Contrast with the above behavior.

|-
{{#if: {{{fourth|}}} |
! Fourth
{{!}} {{{fourth}}}
| }}

|-
{{#if: {{{fifth|}}} |
! Fifth
{{!}} {{{fifth}}}
| }}

|-
{{#if: {{{sixth|}}} |
! Sixth
{{!}} {{{sixth}}}
| }}

Each of these three obvious snippets is a row, but the default headings ("fourth", "fifth", "sixth") don't work for a lot of people. So we can feel free to change them! I've highlighted the bits of code you'd edit.

  1. Change the header text (here highlighted in cyan) to read whatever you want to appear on the left side of the infobox row.
  2. Change the parameter name (here highlighted in green) to display the parameter name you decided on in your default syntax earlier. For example, my first parameter which I wanted to be hidden was to be "par", so I'd type {{{par|}}} in the first spot and {{{par}}} in the second. (It makes a difference!)
  3. I've highlighted and explained how to edit the "Fourth" row, but you can follow the same steps for "Fifth" and "Sixth".

As always, remember that you can remove one, two, or all three of the above snippets of code in order to use fewer rows with default action to hide, or you can add your own.

We're mostly done!

Now you can save the page! Enjoy your new infobox! Paste your default syntax into an article and fill it in. The infobox I made looks like the one on the right. Super pretty!

Finishing touches

The above steps are the important part, which is why I had you save the page. There's a few other things that we can do, but your template will function fine without them.

Default title

Click here to see how I did it!

The |title= parameter controls what appears at the top of the infobox, in the fourth row of the code.

! class="wikia-infobox-header" colspan="2" | {{{title|''Unknown''}}}

By default, you have to fill it in, otherwise your infobox will have a nasty italicized "Unknown" at the top. A smarter behavior can be brought about by switching in a {{PAGENAME}} magic word:

! class="wikia-infobox-header" colspan="2" | {{{title|{{PAGENAME}}}}}

Now, if the title is left blank, it'll default to the name of the page. You might still have to edit the |title= parameter on some pages.

Documentation

Templates are kinda complicated, so it's best to have a little snippet of information on how to use it at the bottom of the template. You'll notice that at the bottom of the default template code, there's a {{Documentation}} template call. This calls Template:Documentation, which varies from wiki to wiki, but in any case, it will transclude the page located at Template:Your template/doc.

Here's a wise layout for your new template's documentation: 

== Default syntax==
Paste this into the page, then fill it in, to use the template.
<pre>
{{Infobox Wolf3D level
| title         = 
| image         = 
| imagewidth    = 
| imagecaption  = 
| crosses       = 
| chalices      = 
| chests        = 
| par           = 
| song          = 
| secrets       = 
}}
</pre>

<noinclude>[[Category:Template documentation]]</noinclude>

Paste that to Template:Infobox Wolf3D level/doc (substituting in the name of your infobox) on your wiki[footnotes 1] Remember, though, that you need to substitute in your default syntax for what I've pasted here.

Be bold!

I've only outlined the basics of editing infoboxes. Feel free to be bold and try editing them further! If you mess up, you can always undo the edits from the page's history.

Notes

  1. ↑ 1.0 1.1 A number of times, this page refers to pages on your wiki, such as "Template:Infobox on your wiki". I don't know what your wiki is, so I can't directly link to it, but if you're having trouble finding the correct page, just click the link to go to the equivalent page on Community Central, then edit the URL so that community.wikia.com is substituted with your wiki's URL: for example wolfenstein.wikia.com.

See also

Community content is available under CC-BY-SA unless otherwise noted.