Soyjak Wiki:Soybox Guide

Archived template in use: {{Template name}}. You VVILL remove it from the page, NOW.

This topic relates to this very wikiHere be edit wars, censorship and template spam.

[CollapseExpand]

This page is currently under development(You) VVILL NOT edit the page until it's properly finished.

Soyboxes are a newfangled header meta-template, that (You) can use to more easily create your own custom header templates. They can also be used to make custom single-use header templates for pages.

There are practically no limitations to what you can create using soyboxes, as they're intentionally designed to be powerful whilst remaining as user-friendly as possible.

For example: the following template was made using just 8 lines of template code and 46 lines of CSS code.

This is a Swedish Win!

You are, however, expected to have at least a surface-level understanding of how CSS works when working with templates.

Please experiment on your own dedicated sandboxes before introducing templates into articles or the Template namespace.

The anatomy of a Soybox

See also: Template:Soybox

A soybox is a very simple thing when you break it down, it's has a <div> which your content is wrapped inside of.

The content inside the wrapper is by default positioned using a grid of 3 columns and 1 row, the text content defaults to being placed in the central column.

Guide

In this guide you will find out how (You) can create your own simple template as a jumping off point for you to experiment on your own.

Your first Soybox

By default a soybox is unstyled, this is to make the cascading nature of CSS a little less frustrating to work with, you're expected to provide your own basic styling using borders and a background.

{{Soybox
|style=background: lightgrey; border: 1px solid black;
}}

This on it's own is rather boring as there is no content whatsoever to make it interesting, it's just a box after all.

Now lets add some images and text!

{{Soybox
|style=background: lightgrey; border: 1px solid black;
|image1=[[File:85645 - SoyBooru.png|80px|link=]]
|line1='''This person is a massive schizo.'''
|line2=You can help by notifying the [[Mental Asylum]].
}}

This person is a massive schizo.You can help by notifying the Mental Asylum.

line1 is the parameter for the large line of text, that draws the readers attention the most. line2 is the second, smaller line of text that explains the message above, usually with some form of call to action.

Note: If you do not wish the image of your template to link anywhere, you can leave the link parameter blank to stop the default behavior of opening the image in the mediawiki image viewer.

Congrats! You've now made a very basic template.

Advanced styling

See also: Template Manual of Style#Templatestyles

In order to do some of the more fancy styling effects, you may need to create your own dedicated CSS page for your template.

Start by giving your Soybox it's own class, the naming convention typically goes template-name where "name" is substituted for the name of the template, so the classname for {{Swedishwin}} would be template-swedishwin. We can also go ahead and remove the style parameter for the time being.

{{Soybox
|class=template-schizoperson
|image1=[[File:85645 - SoyBooru.png|80px|link=]]
|line1='''This person is a massive schizo.'''
|line2=You can help by notifying the [[Mental Asylum]].
}}

Then create a dedicated page for your CSS code to live in, typically located at Template:Template name/styles.css, but can theoretically be placed anywhere. Inside here you can write your CSS code and target any tags you want as long as you follow the Template Manual of Style for templatestyles.

For this example we're going to move our styling found in the prior example to the dedicated CSS page:

.template-schizoperson {
	background: lightgrey; 
	border: 1px solid black;
}

Be aware that if you create your CSS code outside of the dedicated /styles.css subpage, you may have to change the content model of the page to SanitizedCSS.

<Templatestyles> tags should be placed at the end of the template code, this is due to the cascading nature of CSS where the declarations made last take priority.

Good	Bad
{{Soybox ... }}<Templatestyles src="..." /> This is good, now your styles take priority.	<Templatestyles src="..." />{{Soybox ... }} This is bad as now your custom styling will be overridden by the default styling of the Soybox and may cause other difficult to diagnose issues.

Once you've added Templatestyles to your template, you must add the {{Template styles}} template to the documentation subpage, with the full page name of where the CSS code is located.

Parameters and categorization

This section is only applies to transcluded templatesDo not add categorization or parameters to single-use templates placed within a page.

See also: Template Manual of Style#Categories

When you want to add custom categories to your template to be applied to the page which the template is transcluded to, you will use the following code snippet: {{#if:{{{nocat|}}}||[[Category:Category Name]]}}

Good	Bad
{{#if:{{{nocat|}}}||[[Category:Category Name]]}}	{{{cat|}}} This is bad as all page categories should be placed at the bottom of the page, and not inside of templates.

If the Category doesn't already exist, you'll need to create the page for the Category and add the {{Templatecategory}} template to indicate this to future editors.

Conditional rendering

Main article: MW:Help:Extension:ParserFunctions

Notes

Soyjak Wiki Guides and Policies Guides: Manual of Style (Template Manual of Style) - Beginner's guide - About - Staff - Bots - Coal articles - Collapsing objects - Morphing objects - Random objects - Galleries Policies: Rules - Moderation - Privacy policy - Policy - Approver policy - Copyright - Edit war