Difference between revisions of "Template:ButtonBox"

Latest revision as of 23:56, 12 March 2022

Generates a column of buttons, with options to have the buttons in a container with content, specify an image to show next to a button, and have a separate button for collections. Custom CSS classes can be specified for further customization.

Template parameters
This template prefers block formatting of parameters.
Parameter		Description	Type	Status
Container	`container`	Defining this variable will place the buttons in a container. Required if Container Content is defined. Example y	String	suggested
Container Class	`containerclass`	Add a custom CSS class to the container. Example myclass	String	optional
Container Content	`containercontent`	Add content to the container to appear before the buttons. Example === Heading Level 3 ===	Content	suggested
Button 1 Link	`link1`	Specify a link for the button. Example [[Eric Weinstein]]	String	suggested
Button 1 Class	`class1`	Specify a custom CSS class for the button. Example myclass	String	optional
Button 1 Image	`image1`	Specify an image to show alongside the button. Example Read.jpg	String	suggested
Button 1 Image Width	`image1w`	Specify the width of the image shown alongside the button. Use if the image isn't square. Note that the button's max height is 64px. Default 64px Example 102px	String	optional
Button 2 Link	`link2`	Specify a link for the button. Example [[Eric Weinstein]]	String	suggested
Button 2 Class	`class2`	Specify a custom CSS class for the button. Example myclass	String	optional
Button 2 Image	`image2`	Specify an image to show alongside the button. Example Read.jpg	String	suggested
Button 2 Image Width	`image2w`	Specify the width of the image shown alongside the button. Use if the image isn't square. Note that the button's max height is 64px. Default 64px Example 102px	String	optional
Button 3 Link	`link3`	Specify a link for the button. Example [[Eric Weinstein]]	String	suggested
Button 3 Class	`class3`	Specify a custom CSS class for the button. Example myclass	String	optional
Button 3 Image	`image3`	Specify an image to show alongside the button. Example Read.jpg	String	suggested
Button 3 Image Width	`image3w`	Specify the width of the image shown alongside the button. Use if the image isn't square. Note that the button's max height is 64px. Default 64px Example 102px	String	optional
Button 4 Link	`link4`	Specify a link for the button. Example [[Eric Weinstein]]	String	suggested
Button 4 Class	`class4`	Specify a custom CSS class for the button. Example myclass	String	optional
Button 4 Image	`image4`	Specify an image to show alongside the button. Example Read.jpg	String	suggested
Button 4 Image Width	`image4w`	Specify the width of the image shown alongside the button. Use if the image isn't square. Note that the button's max height is 64px. Default 64px Example 102px	String	optional
Button 5 Link	`link5`	Specify a link for the button. Example [[Eric Weinstein]]	String	suggested
Button 5 Class	`class5`	Specify a custom CSS class for the button. Example myclass	String	optional
Button 5 Image	`image5`	Specify an image to show alongside the button. Example Read.jpg	String	suggested
Button 5 Image Width	`image5w`	Specify the width of the image shown alongside the button. Use if the image isn't square. Note that the button's max height is 64px. Default 64px Example 102px	String	optional
Button 6 Link	`link6`	Specify a link for the button. Example [[Eric Weinstein]]	String	suggested
Button 6 Class	`class6`	Specify a custom CSS class for the button. Example myclass	String	optional
Button 6 Image	`image6`	Specify an image to show alongside the button. Example Read.jpg	String	suggested
Button 6 Image Width	`image6w`	Specify the width of the image shown alongside the button. Use if the image isn't square. Note that the button's max height is 64px. Default 64px Example 102px	String	optional
Button 7 Link	`link7`	Specify a link for the button. Example [[Eric Weinstein]]	String	suggested
Button 7 Class	`class7`	Specify a custom CSS class for the button. Example myclass	String	optional
Button 7 Image	`image7`	Specify an image to show alongside the button. Example Read.jpg	String	suggested
Button 7 Image Width	`image7w`	Specify the width of the image shown alongside the button. Use if the image isn't square. Note that the button's max height is 64px. Default 64px Example 102px	String	optional
Button 8 Link	`link8`	Specify a link for the button. Example [[Eric Weinstein]]	String	suggested
Button 8 Class	`class8`	Specify a custom CSS class for the button. Example myclass	String	optional
Button 8 Image	`image8`	Specify an image to show alongside the button. Example Read.jpg	String	suggested
Button 8 Image Width	`image8w`	Specify the width of the image shown alongside the button. Use if the image isn't square. Note that the button's max height is 64px. Default 64px Example 102px	String	optional
Button 9 Link	`link9`	Specify a link for the button. Example [[Eric Weinstein]]	String	suggested
Button 9 Class	`class9`	Specify a custom CSS class for the button. Example myclass	String	optional
Button 9 Image	`image9`	Specify an image to show alongside the button. Example Read.jpg	String	suggested
Button 9 Image Width	`image9w`	Specify the width of the image shown alongside the button. Use if the image isn't square. Note that the button's max height is 64px. Default 64px Example 102px	String	optional
Button 10 Link	`link10`	Specify a link for the button Example [[Eric Weinstein]]	String	suggested
Button 10 Class	`class10`	Specify a custom CSS class for the button. Example myclass	String	optional
Button 10 Image	`image10`	Specify an image to show alongside the button. Example Read.jpg	String	suggested
Button 10 Image Width	`image10w`	Specify the width of the image shown alongside the button. Use if the image isn't square. Note that the button's max height is 64px. Default 64px Example 102px	String	optional
Collection Button Link	`collectionlink`	Use this button to link to a collection of the type of pages linked in the list. Example [[Content by Eric Weinstein]]	String	suggested
Collection Button Class	`collectionclass`	Specify a custom CSS class for the button. Example myclass	String	optional

Difference between revisions of "Template:ButtonBox"

Latest revision as of 23:56, 12 March 2022

Navigation menu

Search

@@ Line 1: / Line 1: @@
 <includeonly>{{#if: {{{container|}}}|<nowiki/>
-<div class="button-section"><nowiki/>
+<div class="button-section {{{containerclass|}}}"><nowiki/>
+{{{containercontent|}}}
 <div class="button-links"><nowiki/>
 {{#if: {{{link1|}}}|<nowiki/>
 <div class="button-object {{{class1|}}}">
 {{#if: {{{image1|}}}|<nowiki/>
-[[File:{{{image1}}}|{{{image1w|64px}}}]] {{{link1}}}|<nowiki/>
+[[File:{{{image1}}}|{{{image1w|64px}}}|link=]] {{{link1}}}|<nowiki/>
 {{{link1}}}<nowiki/>
-}}
+}}<nowiki/>
 </div>
-|}}
+|}}<nowiki/>
 {{#if: {{{link2|}}}|<nowiki/>
 <div class="button-object {{{class2|}}}">
 {{#if: {{{image2|}}}|<nowiki/>
-[[File:{{{image2}}}|{{{image2w|64px}}}]] {{{link2}}}|<nowiki/>
+[[File:{{{image2}}}|{{{image2w|64px}}}|link=]] {{{link2}}}|<nowiki/>
 {{{link2}}}<nowiki/>
-}}
+}}<nowiki/>
 </div>
-|}}
+|}}<nowiki/>
 {{#if: {{{link3|}}}|<nowiki/>
 <div class="button-object {{{class3|}}}">
 {{#if: {{{image3|}}}|<nowiki/>
-[[File:{{{image3}}}|{{{image3w|64px}}}]] {{{link3}}}|<nowiki/>
+[[File:{{{image3}}}|{{{image3w|64px}}}|link=]] {{{link3}}}|<nowiki/>
 {{{link3}}}<nowiki/>
-}}
+}}<nowiki/>
 </div>
-}}
+|}}<nowiki/>
+{{#if: {{{link4|}}}|<nowiki/>
+<div class="button-object {{{class4|}}}">
+{{#if: {{{image4|}}}|<nowiki/>
+[[File:{{{image4}}}|{{{image4w|64px}}}|link=]] {{{link4}}}|<nowiki/>
+{{{link4}}}<nowiki/>
+}}<nowiki/>
+</div>
+|}}<nowiki/>
+{{#if: {{{link5|}}}|<nowiki/>
+<div class="button-object {{{class5|}}}">
+{{#if: {{{image5|}}}|<nowiki/>
+[[File:{{{image5}}}|{{{image5w|64px}}}|link=]] {{{link5}}}|<nowiki/>
+{{{link5}}}<nowiki/>
+}}<nowiki/>
+</div>
+|}}<nowiki/>
+{{#if: {{{link6|}}}|<nowiki/>
+<div class="button-object {{{class6|}}}">
+{{#if: {{{image6|}}}|<nowiki/>
+[[File:{{{image6}}}|{{{image6w|64px}}}|link=]] {{{link6}}}|<nowiki/>
+{{{link6}}}<nowiki/>
+}}<nowiki/>
+</div>
+|}}<nowiki/>
+{{#if: {{{link7|}}}|<nowiki/>
+<div class="button-object {{{class7|}}}">
+{{#if: {{{image7|}}}|<nowiki/>
+[[File:{{{image7}}}|{{{image7w|64px}}}|link=]] {{{link7}}}|<nowiki/>
+{{{link7}}}<nowiki/>
+}}<nowiki/>
+</div>
+|}}<nowiki/>
+{{#if: {{{link8|}}}|<nowiki/>
+<div class="button-object {{{class8|}}}">
+{{#if: {{{image8|}}}|<nowiki/>
+[[File:{{{image8}}}|{{{image8w|64px}}}|link=]] {{{link8}}}|<nowiki/>
+{{{link8}}}<nowiki/>
+}}<nowiki/>
+</div>
+|}}<nowiki/>
+{{#if: {{{link9|}}}|<nowiki/>
+<div class="button-object {{{class9|}}}">
+{{#if: {{{image9|}}}|<nowiki/>
+[[File:{{{image9}}}|{{{image9w|64px}}}|link=]] {{{link9}}}|<nowiki/>
+{{{link9}}}<nowiki/>
+}}<nowiki/>
+</div>
+|}}<nowiki/>
+{{#if: {{{link10|}}}|<nowiki/>
+<div class="button-object {{{class10|}}}">
+{{#if: {{{image10|}}}|<nowiki/>
+[[File:{{{image10}}}|{{{image10w|64px}}}|link=]] {{{link10}}}|<nowiki/>
+{{{link10}}}<nowiki/>
+}}<nowiki/>
+</div>
+|}}<nowiki/>
+{{#if: {{{collectionlink|}}}|<nowiki/>
+<div class="button-object button-collection {{{collectionclass|}}}">
+{{{collectionlink}}}<nowiki/>
+</div>
+|}}<nowiki/>
 </div>
 </div>|<nowiki/>
@@ Line 32: / Line 94: @@
 <div class="button-object {{{class1|}}}">
 {{#if: {{{image1|}}}|<nowiki/>
-[[File:{{{image1}}}|{{{image1w|64px}}}]] {{{link1}}}|<nowiki/>
+[[File:{{{image1}}}|{{{image1w|64px}}}|link=]] {{{link1}}}|<nowiki/>
 {{{link1}}}<nowiki/>
-}}
+}}<nowiki/>
 </div>
-|}}
+|}}<nowiki/>
 {{#if: {{{link2|}}}|<nowiki/>
 <div class="button-object {{{class2|}}}">
 {{#if: {{{image2|}}}|<nowiki/>
-[[File:{{{image2}}}|{{{image2w|64px}}}]] {{{link2}}}|<nowiki/>
+[[File:{{{image2}}}|{{{image2w|64px}}}|link=]] {{{link2}}}|<nowiki/>
 {{{link2}}}<nowiki/>
-}}
+}}<nowiki/>
 </div>
-|}}
+|}}<nowiki/>
 {{#if: {{{link3|}}}|<nowiki/>
 <div class="button-object {{{class3|}}}">
 {{#if: {{{image3|}}}|<nowiki/>
-[[File:{{{image3}}}|{{{image3w|64px}}}]] {{{link3}}}|<nowiki/>
+[[File:{{{image3}}}|{{{image3w|64px}}}|link=]] {{{link3}}}|<nowiki/>
 {{{link3}}}<nowiki/>
-}}
+}}<nowiki/>
+</div>
+|}}<nowiki/>
+{{#if: {{{link4|}}}|<nowiki/>
+<div class="button-object {{{class4|}}}">
+{{#if: {{{image4|}}}|<nowiki/>
+[[File:{{{image4}}}|{{{image4w|64px}}}|link=]] {{{link4}}}|<nowiki/>
+{{{link4}}}<nowiki/>
+}}<nowiki/>
+</div>
+|}}<nowiki/>
+{{#if: {{{link5|}}}|<nowiki/>
+<div class="button-object {{{class5|}}}">
+{{#if: {{{image5|}}}|<nowiki/>
+[[File:{{{image5}}}|{{{image5w|64px}}}|link=]] {{{link5}}}|<nowiki/>
+{{{link5}}}<nowiki/>
+}}<nowiki/>
+</div>
+|}}<nowiki/>
+{{#if: {{{link6|}}}|<nowiki/>
+<div class="button-object {{{class6|}}}">
+{{#if: {{{image6|}}}|<nowiki/>
+[[File:{{{image6}}}|{{{image6w|64px}}}|link=]] {{{link6}}}|<nowiki/>
+{{{link6}}}<nowiki/>
+}}<nowiki/>
+</div>
+|}}<nowiki/>
+{{#if: {{{link7|}}}|<nowiki/>
+<div class="button-object {{{class7|}}}">
+{{#if: {{{image7|}}}|<nowiki/>
+[[File:{{{image7}}}|{{{image7w|64px}}}|link=]] {{{link7}}}|<nowiki/>
+{{{link7}}}<nowiki/>
+}}<nowiki/>
+</div>
+|}}<nowiki/>
+{{#if: {{{link8|}}}|<nowiki/>
+<div class="button-object {{{class8|}}}">
+{{#if: {{{image8|}}}|<nowiki/>
+[[File:{{{image8}}}|{{{image8w|64px}}}|link=]] {{{link8}}}|<nowiki/>
+{{{link8}}}<nowiki/>
+}}<nowiki/>
+</div>
+|}}<nowiki/>
+{{#if: {{{link9|}}}|<nowiki/>
+<div class="button-object {{{class9|}}}">
+{{#if: {{{image9|}}}|<nowiki/>
+[[File:{{{image9}}}|{{{image9w|64px}}}|link=]] {{{link9}}}|<nowiki/>
+{{{link9}}}<nowiki/>
+}}<nowiki/>
+</div>
+|}}<nowiki/>
+{{#if: {{{link10|}}}|<nowiki/>
+<div class="button-object {{{class10|}}}">
+{{#if: {{{image10|}}}|<nowiki/>
+[[File:{{{image10}}}|{{{image10w|64px}}}|link=]] {{{link10}}}|<nowiki/>
+{{{link10}}}<nowiki/>
+}}<nowiki/>
+</div>
+|}}<nowiki/>
+{{#if: {{{collectionlink|}}}|<nowiki/>
+<div class="button-object button-collection {{{collectionclass|}}}">
+{{{collectionlink}}}<nowiki/>
 </div>
-|}}
+|}}<nowiki/>
-</div>}}</includeonly>
+</div>}}</includeonly><noinclude><templatedata>
+{
+	"params": {
+		"container": {
+			"label": "Container",
+			"description": "Defining this variable will place the buttons in a container. Required if Container Content is defined.",
+			"example": "y",
+			"type": "string",
+			"suggested": true
+		},
+		"containerclass": {
+			"label": "Container Class",
+			"description": "Add a custom CSS class to the container.",
+			"example": "myclass",
+			"type": "string"
+		},
+		"containercontent": {
+			"label": "Container Content",
+			"description": "Add content to the container to appear before the buttons.",
+			"example": " === Heading Level 3 ===",
+			"type": "content",
+			"suggested": true
+		},
+		"link1": {
+			"label": "Button 1 Link",
+			"description": "Specify a link for the button.",
+			"example": "[[Eric Weinstein]]",
+			"type": "string",
+			"suggested": true
+		},
+		"class1": {
+			"label": "Button 1 Class",
+			"description": "Specify a custom CSS class for the button.",
+			"example": "myclass",
+			"type": "string"
+		},
+		"image1": {
+			"label": "Button 1 Image",
+			"description": "Specify an image to show alongside the button.",
+			"example": "Read.jpg",
+			"type": "string",
+			"suggested": true
+		},
+		"image1w": {
+			"label": "Button 1 Image Width",
+			"description": "Specify the width of the image shown alongside the button. Use if the image isn't square. Note that the button's max height is 64px.",
+			"example": "102px",
+			"type": "string",
+			"default": "64px"
+		},
+		"link2": {
+			"label": "Button 2 Link",
+			"description": "Specify a link for the button.",
+			"example": "[[Eric Weinstein]]",
+			"type": "string",
+			"suggested": true
+		},
+		"class2": {
+			"label": "Button 2 Class",
+			"description": "Specify a custom CSS class for the button.",
+			"example": "myclass",
+			"type": "string"
+		},
+		"image2": {
+			"label": "Button 2 Image",
+			"description": "Specify an image to show alongside the button.",
+			"example": "Read.jpg",
+			"type": "string",
+			"suggested": true
+		},
+		"image2w": {
+			"label": "Button 2 Image Width",
+			"description": "Specify the width of the image shown alongside the button. Use if the image isn't square. Note that the button's max height is 64px.",
+			"example": "102px",
+			"type": "string",
+			"default": "64px"
+		},
+		"link3": {
+			"label": "Button 3 Link",
+			"description": "Specify a link for the button.",
+			"example": "[[Eric Weinstein]]",
+			"type": "string",
+			"suggested": true
+		},
+		"class3": {
+			"label": "Button 3 Class",
+			"description": "Specify a custom CSS class for the button.",
+			"example": "myclass",
+			"type": "string"
+		},
+		"image3": {
+			"label": "Button 3 Image",
+			"description": "Specify an image to show alongside the button.",
+			"example": "Read.jpg",
+			"type": "string",
+			"suggested": true
+		},
+		"image3w": {
+			"label": "Button 3 Image Width",
+			"description": "Specify the width of the image shown alongside the button. Use if the image isn't square. Note that the button's max height is 64px.",
+			"example": "102px",
+			"type": "string",
+			"default": "64px"
+		},
+		"link4": {
+			"label": "Button 4 Link",
+			"description": "Specify a link for the button.",
+			"example": "[[Eric Weinstein]]",
+			"type": "string",
+			"suggested": true
+		},
+		"class4": {
+			"label": "Button 4 Class",
+			"description": "Specify a custom CSS class for the button.",
+			"example": "myclass",
+			"type": "string"
+		},
+		"image4": {
+			"label": "Button 4 Image",
+			"description": "Specify an image to show alongside the button.",
+			"example": "Read.jpg",
+			"type": "string",
+			"suggested": true
+		},
+		"image4w": {
+			"label": "Button 4 Image Width",
+			"description": "Specify the width of the image shown alongside the button. Use if the image isn't square. Note that the button's max height is 64px.",
+			"example": "102px",
+			"type": "string",
+			"default": "64px"
+		},
+		"link5": {
+			"label": "Button 5 Link",
+			"description": "Specify a link for the button.",
+			"example": "[[Eric Weinstein]]",
+			"type": "string",
+			"suggested": true
+		},
+		"class5": {
+			"label": "Button 5 Class",
+			"description": "Specify a custom CSS class for the button.",
+			"example": "myclass",
+			"type": "string"
+		},
+		"image5": {
+			"label": "Button 5 Image",
+			"description": "Specify an image to show alongside the button.",
+			"example": "Read.jpg",
+			"type": "string",
+			"suggested": true
+		},
+		"image5w": {
+			"label": "Button 5 Image Width",
+			"description": "Specify the width of the image shown alongside the button. Use if the image isn't square. Note that the button's max height is 64px.",
+			"example": "102px",
+			"type": "string",
+			"default": "64px"
+		},
+		"link6": {
+			"label": "Button 6 Link",
+			"description": "Specify a link for the button.",
+			"example": "[[Eric Weinstein]]",
+			"type": "string",
+			"suggested": true
+		},
+		"class6": {
+			"label": "Button 6 Class",
+			"description": "Specify a custom CSS class for the button.",
+			"example": "myclass",
+			"type": "string"
+		},
+		"image6": {
+			"label": "Button 6 Image",
+			"description": "Specify an image to show alongside the button.",
+			"example": "Read.jpg",
+			"type": "string",
+			"suggested": true
+		},
+		"image6w": {
+			"label": "Button 6 Image Width",
+			"description": "Specify the width of the image shown alongside the button. Use if the image isn't square. Note that the button's max height is 64px.",
+			"example": "102px",
+			"type": "string",
+			"default": "64px"
+		},
+		"link7": {
+			"label": "Button 7 Link",
+			"description": "Specify a link for the button.",
+			"example": "[[Eric Weinstein]]",
+			"type": "string",
+			"suggested": true
+		},
+		"class7": {
+			"label": "Button 7 Class",
+			"description": "Specify a custom CSS class for the button.",
+			"example": "myclass",
+			"type": "string"
+		},
+		"image7": {
+			"label": "Button 7 Image",
+			"description": "Specify an image to show alongside the button.",
+			"example": "Read.jpg",
+			"type": "string",
+			"suggested": true
+		},
+		"image7w": {
+			"label": "Button 7 Image Width",
+			"description": "Specify the width of the image shown alongside the button. Use if the image isn't square. Note that the button's max height is 64px.",
+			"example": "102px",
+			"type": "string",
+			"default": "64px"
+		},
+		"link8": {
+			"label": "Button 8 Link",
+			"description": "Specify a link for the button.",
+			"example": "[[Eric Weinstein]]",
+			"type": "string",
+			"suggested": true
+		},
+		"class8": {
+			"label": "Button 8 Class",
+			"description": "Specify a custom CSS class for the button.",
+			"example": "myclass",
+			"type": "string"
+		},
+		"image8": {
+			"label": "Button 8 Image",
+			"description": "Specify an image to show alongside the button.",
+			"example": "Read.jpg",
+			"type": "string",
+			"suggested": true
+		},
+		"image8w": {
+			"label": "Button 8 Image Width",
+			"description": "Specify the width of the image shown alongside the button. Use if the image isn't square. Note that the button's max height is 64px.",
+			"example": "102px",
+			"type": "string",
+			"default": "64px"
+		},
+		"link9": {
+			"label": "Button 9 Link",
+			"description": "Specify a link for the button.",
+			"example": "[[Eric Weinstein]]",
+			"type": "string",
+			"suggested": true
+		},
+		"class9": {
+			"label": "Button 9 Class",
+			"description": "Specify a custom CSS class for the button.",
+			"example": "myclass",
+			"type": "string"
+		},
+		"image9": {
+			"label": "Button 9 Image",
+			"description": "Specify an image to show alongside the button.",
+			"example": "Read.jpg",
+			"type": "string",
+			"suggested": true
+		},
+		"image9w": {
+			"label": "Button 9 Image Width",
+			"description": "Specify the width of the image shown alongside the button. Use if the image isn't square. Note that the button's max height is 64px.",
+			"example": "102px",
+			"type": "string",
+			"default": "64px"
+		},
+		"link10": {
+			"label": "Button 10 Link",
+			"description": "Specify a link for the button",
+			"example": "[[Eric Weinstein]]",
+			"type": "string",
+			"suggested": true
+		},
+		"class10": {
+			"label": "Button 10 Class",
+			"description": "Specify a custom CSS class for the button.",
+			"example": "myclass",
+			"type": "string"
+		},
+		"image10": {
+			"label": "Button 10 Image",
+			"description": "Specify an image to show alongside the button.",
+			"example": "Read.jpg",
+			"type": "string",
+			"suggested": true
+		},
+		"image10w": {
+			"label": "Button 10 Image Width",
+			"description": "Specify the width of the image shown alongside the button. Use if the image isn't square. Note that the button's max height is 64px.",
+			"example": "102px",
+			"type": "string",
+			"default": "64px"
+		},
+		"collectionlink": {
+			"label": "Collection Button Link",
+			"description": "Use this button to link to a collection of the type of pages linked in the list.",
+			"example": "[[Content by Eric Weinstein]]",
+			"type": "string",
+			"suggested": true
+		},
+		"collectionclass": {
+			"label": "Collection Button Class",
+			"description": "Specify a custom CSS class for the button.",
+			"example": "myclass",
+			"type": "string"
+		}
+	},
+	"description": "Generates a column of buttons, with options to have the buttons in a container with content, specify an image to show next to a button, and have a separate button for collections.\n\nCustom CSS classes can be specified for further customization.",
+	"format": "block"
+}
+</templatedata>
+</noinclude>