Template:Article thumbnail - Revision history

Wikilah admin at 07:23, 4 January 2026

2026-01-04T07:23:54Z

← Older revision		Revision as of 15:23, 4 January 2026
Line 1:		Line 1:
	<templatestyles src="Article thumbnail/styles.css" />		<templatestyles src="Article thumbnail/styles.css" />
	<div class="article-thumb">		<div class="article-thumb article-thumb--align-{{{align\|center}}}">
	<div class="article-thumb__imgwrap">		<div class="article-thumb__imgwrap">
	[[File:{{{image\|work-in-progress-book.jpg}}}\|{{{width\|180}}}px\|link={{{page\|{{BASEPAGENAME}}}}}\|alt={{{alt\|Thumbnail for {{{page\|{{BASEPAGENAME}}}}}}}}]]		[[File:{{{image\|work-in-progress-book.jpg}}}\|{{{width\|180}}}px\|link={{{page\|{{BASEPAGENAME}}}}}\|alt={{{alt\|Thumbnail for {{{page\|{{BASEPAGENAME}}}}}}}}]]
Line 9:		Line 9:
	</div>		</div>
	</div><noinclude>		</div><noinclude>
	== What this does ==
	Displays a small, consistent '''article thumbnail''' card: an image that links to a page, with a caption under it.

	== Parameters ==		== Parameters ==
	* <code>image</code> – ~~Optional.~~ File name without ~~<code>File:</code>~~ prefix.		* <code>image</code> – File name without prefix.
	* <code>page</code> – ~~Optional.~~ Target page ~~for the~~ link~~. Defaults to <code>{{BASEPAGENAME}}</code>~~.		* <code>page</code> – Target page link.
	* <code>caption</code> – ~~Optional. Plain text description appearing~~ under the ~~page~~ ~~link~~.		* <code>caption</code> – Text under the link (color #202122).
	* <code>~~width~~</code> – Optional. ~~Numeric~~ ~~width~~ ~~for~~ ~~the~~ ~~file~~ ~~(defaults~~ to ~~180)~~.		* <code>align</code> – Optional. Set to <code>left</code>, <code>right</code>, or <code>center</code>. Defaults to <code>center</code>.
	* <code>~~alt~~</code> – ~~Optional.~~ ~~Accessibility~~ ~~text~~.		* <code>width</code> – Image width (numeric).

	== Example ==		== Example (Left Aligned) ==
	<pre>		<pre>
	{{Article thumbnail		{{Article thumbnail
Line 25:		Line 22:
	\| page = Atomic Habits		\| page = Atomic Habits
	\| caption = James Clear (2018)		\| caption = James Clear (2018)
			\| align = left
	}}		}}
	</pre>		</pre>

Wikilah admin at 07:19, 4 January 2026

2026-01-04T07:19:53Z

@@ Line 4: / Line 4: @@
 [[File:{{{image|work-in-progress-book.jpg}}}|{{{width|180}}}px|link={{{page|{{BASEPAGENAME}}}}}|alt={{{alt|Thumbnail for {{{page|{{BASEPAGENAME}}}}}}}}]]
 </div>
-<div class="article-thumb__caption">[[{{{page|{{BASEPAGENAME}}}}}]]</div>
+<div class="article-thumb__caption">
 </div><noinclude>
 == What this does ==
 Displays a small, consistent '''article thumbnail''' card: an image that links to a page, with a caption under it.
 == Parameters ==
-* <code>image</code> – Optional. File name of the image '''without''' the <code>File:</code> prefix (e.g., <code>Atomic Habits cover.jpg</code>).
+* <code>image</code> – Optional. File name without <code>File:</code> prefix.
-* <code>page</code> – Optional. Target page for the image link and caption. Defaults to <code>{{BASEPAGENAME}}</code>.
+* <code>caption</code> – Optional. Plain text description appearing under the page link.
-* <code>width</code> – Optional. Width passed to the file thumbnail ('''numeric only, no units'''). Defaults to <code>180</code>.
+* <code>width</code> – Optional. Numeric width for the file (defaults to 180).
-== Examples ==
+== Example ==
 <pre>
 {{Article thumbnail
- | image = Atomic Habits cover.jpg
+ | image   = Atomic Habits cover.jpg
 }}
 </pre>
 </noinclude>

Wikilah admin at 07:12, 4 January 2026

2026-01-04T07:12:45Z

← Older revision		Revision as of 15:12, 4 January 2026
Line 1:		Line 1:
	<templatestyles src="Article thumbnail/styles.css" />		<templatestyles src="Article thumbnail/styles.css" />
	<div class="article-thumb">		<div class="article-thumb">
	<div class="article-thumb__imgwrap">		<div class="article-thumb__imgwrap">
	[[File:{{{image\|work-in-progress-book.jpg}}}\|{{{~~height~~\|~~150~~}}}px\|link={{{page\|{{BASEPAGENAME}}}}}\|alt={{{alt\|Thumbnail for {{{page\|{{BASEPAGENAME}}}}}}}}]]		[[File:{{{image\|work-in-progress-book.jpg}}}\|{{{width\|180}}}px\|link={{{page\|{{BASEPAGENAME}}}}}\|alt={{{alt\|Thumbnail for {{{page\|{{BASEPAGENAME}}}}}}}}]]
	</div>		</div>
	<div class="article-~~thumb__content~~">		<div class="article-thumb__caption">[[{{{page\|{{BASEPAGENAME}}}}}]]</div>
	<div class="article-thumb__title">[[{{{page\|{{BASEPAGENAME}}}}}]]</div>
	{{#if:{{{subtitle\|}}}\|<div class="article-thumb__subtitle">{{{subtitle}}}</div>}}
	{{#if:{{{description\|}}}\|<div class="article-thumb__description">{{{description}}}</div>}}
	</div>
	</div><noinclude>		</div><noinclude>
	== What this does ==		== What this does ==

Wikilah admin at 07:04, 4 January 2026

2026-01-04T07:04:09Z

← Older revision		Revision as of 15:04, 4 January 2026
Line 2:		Line 2:
	<div class="article-thumb">		<div class="article-thumb">
	<div class="article-thumb__imgwrap">		<div class="article-thumb__imgwrap">
	[[File:{{{image\|work-in-progress-book.jpg}}}\|{{{~~width~~\|~~180~~}}}px\|link={{{page\|{{BASEPAGENAME}}}}}\|alt={{{alt\|Thumbnail for {{{page\|{{BASEPAGENAME}}}}}}}}]]		[[File:{{{image\|work-in-progress-book.jpg}}}\|{{{height\|150}}}px\|link={{{page\|{{BASEPAGENAME}}}}}\|alt={{{alt\|Thumbnail for {{{page\|{{BASEPAGENAME}}}}}}}}]]
	</div>		</div>
	<div class="article-thumb__content">		<div class="article-thumb__content">

Wikilah admin at 07:00, 4 January 2026

2026-01-04T07:00:13Z

← Older revision		Revision as of 15:00, 4 January 2026
Line 10:		Line 10:
	</div>		</div>
	</div><noinclude>		</div><noinclude>
	[[Category:Templates]]
	</noinclude>
	[[Category:Templates]]
	</noinclude><noinclude>
	== What this does ==		== What this does ==
	Displays a small, consistent '''article thumbnail''' card: an image that links to a page, with a caption under it.		Displays a small, consistent '''article thumbnail''' card: an image that links to a page, with a caption under it.

Wikilah admin at 06:59, 4 January 2026

2026-01-04T06:59:21Z

← Older revision		Revision as of 14:59, 4 January 2026
Line 10:		Line 10:
	</div>		</div>
	</div><noinclude>		</div><noinclude>
			[[Category:Templates]]
			</noinclude>
	[[Category:Templates]]		[[Category:Templates]]
	</noinclude><noinclude>		</noinclude><noinclude>

Wikilah admin at 06:55, 4 January 2026

2026-01-04T06:55:20Z

← Older revision		Revision as of 14:55, 4 January 2026
Line 1:		Line 1:
	<templatestyles src="Article thumbnail/styles.css" />		<templatestyles src="Article thumbnail/styles.css" />
	<div class="article-thumb">		<div class="article-thumb">
	<div class="article-thumb__imgwrap">		<div class="article-thumb__imgwrap">
	[[File:{{{image\|work-in-progress-book.jpg}}}\|{{{width\|180}}}px\|link={{{page\|{{BASEPAGENAME}}}}}\|alt={{{alt\|Thumbnail for {{{page\|{{BASEPAGENAME}}}}}}}}]]		[[File:{{{image\|work-in-progress-book.jpg}}}\|{{{width\|180}}}px\|link={{{page\|{{BASEPAGENAME}}}}}\|alt={{{alt\|Thumbnail for {{{page\|{{BASEPAGENAME}}}}}}}}]]
	</div>		</div>
	<div class="article-~~thumb__caption~~"~~>[[{{{page\|{{BASEPAGENAME}}}}}]]</div~~>		<div class="article-thumb__content">
			<div class="article-thumb__title">[[{{{page\|{{BASEPAGENAME}}}}}]]</div>
			{{#if:{{{subtitle\|}}}\|<div class="article-thumb__subtitle">{{{subtitle}}}</div>}}
			{{#if:{{{description\|}}}\|<div class="article-thumb__description">{{{description}}}</div>}}
			</div>
	</div><noinclude>		</div><noinclude>
			[[Category:Templates]]
			</noinclude><noinclude>
	== What this does ==		== What this does ==
	Displays a small, consistent '''article thumbnail''' card: an image that links to a page, with a caption under it.		Displays a small, consistent '''article thumbnail''' card: an image that links to a page, with a caption under it.

Wikilah admin at 11:25, 15 October 2025

2025-10-15T11:25:02Z

← Older revision		Revision as of 19:25, 15 October 2025
Line 2:		Line 2:
	<div class="article-thumb">		<div class="article-thumb">
	<div class="article-thumb__imgwrap">		<div class="article-thumb__imgwrap">
	~~{{#ifexist:~~ File:{{{image\|work-in-progress-book.jpg}}}		[[File:{{{image\|work-in-progress-book.jpg}}}\|{{{width\|180}}}px\|link={{{page\|{{BASEPAGENAME}}}}}\|alt={{{alt\|Thumbnail for {{{page\|{{BASEPAGENAME}}}}}}}}]]
	\| [[File:{{{image\|work-in-progress-book.jpg}}}\|{{{width\|180}}}px\|link={{{page\|{{BASEPAGENAME}}}}}\|alt={{{alt\|Thumbnail for {{{page\|{{BASEPAGENAME}}}}}}}]]
	\| [[File:work-in-progress-book.jpg\|{{{width\|180}}}px\|link={{{page\|{{BASEPAGENAME}}}}}\|alt={{{alt\|Thumbnail for {{{page\|{{BASEPAGENAME}}}}}}}]]
	}}
	</div>		</div>
	<div class="article-thumb__caption">[[{{{page\|{{BASEPAGENAME}}}}}]]</div>		<div class="article-thumb__caption">[[{{{page\|{{BASEPAGENAME}}}}}]]</div>
Line 11:		Line 8:
	== What this does ==		== What this does ==
	Displays a small, consistent '''article thumbnail''' card: an image that links to a page, with a caption under it.		Displays a small, consistent '''article thumbnail''' card: an image that links to a page, with a caption under it.
	Styling is provided via TemplateStyles (''Article thumbnail/styles.css''). Images are centered and scaled to fit the fixed thumbnail area.		This version performs '''no existence checks''' (no <code>#ifexist</code>) to avoid expensive parser calls. Styling is provided via TemplateStyles (''Article thumbnail/styles.css''). Images are centered and scaled to fit the fixed thumbnail area.

	== Parameters ==		== Parameters ==
	* <code>image</code> – Optional. File name of the image '''without''' the <code>File:</code> prefix (e.g., <code>Atomic Habits cover.jpg</code>).		* <code>image</code> – Optional. File name of the image '''without''' the <code>File:</code> prefix (e.g., <code>Atomic Habits cover.jpg</code>).
	If ~~the file is missing or not provided~~, it ~~falls back~~ to <code>work-in-progress-book.jpg</code>.		If omitted, it defaults to <code>work-in-progress-book.jpg</code>. '''No existence check is performed'''—if the specified file does not exist, MediaWiki will render it as a missing image link/icon as per your wiki configuration.
	* <code>page</code> – Optional. Target page for the image link and caption. Defaults to <code>{{BASEPAGENAME}}</code>.		* <code>page</code> – Optional. Target page for the image link and caption. Defaults to <code>{{BASEPAGENAME}}</code>.
	* <code>width</code> – Optional. Width passed to the file thumbnail ('''numeric only, no units'''). Defaults to <code>180</code>.		* <code>width</code> – Optional. Width passed to the file thumbnail ('''numeric only, no units'''). Defaults to <code>180</code>.
Line 67:		Line 64:
	== Notes ==		== Notes ==
	* Provide the exact file name, including extension, but do not include the <code>File:</code> prefix in <code>\|image=</code>.		* Provide the exact file name, including extension, but do not include the <code>File:</code> prefix in <code>\|image=</code>.
	* If ~~the~~ ~~provided~~ ~~image~~ ~~file~~ ~~does~~ ~~not~~ ~~exist~~ ~~(or~~ is ~~omitted),~~ ~~this~~ ~~template~~ ~~automatically~~ ~~uses~~ <code>work-in-progress-book.jpg</code>.		* This template intentionally avoids expensive parser functions. There is '''no automatic fallback''' if the file is missing; pass a known placeholder (e.g., <code>work-in-progress-book.jpg</code>) from the caller if you want a guaranteed image.
	* The CSS fixes the card width (150 px) and image area height (180 px). The image is centered and constrained with <code>max-width:100%</code> and <code>max-height:100%</code>.		* The CSS fixes the card width (150 px) and image area height (180 px). The image is centered and constrained with <code>max-width:100%</code> and <code>max-height:100%</code>.
	* For grid layouts, place multiple template calls on the same line or separated by spaces; each card is <code>display:inline-block</code> and will wrap as needed.		* For grid layouts, place multiple template calls on the same line or separated by spaces; each card is <code>display:inline-block</code> and will wrap as needed.

Wikilah admin at 05:54, 14 October 2025

2025-10-14T05:54:11Z

← Older revision		Revision as of 13:54, 14 October 2025
Line 1:		Line 1:
	<templatestyles src="Article thumbnail/styles.css" />		<templatestyles src="Article thumbnail/styles.css" />
	<div class="article-thumb">		<div class="article-thumb">
	<div class="article-thumb__imgwrap"~~>[[File:{{{image}}}\|{{{width\|180}}}px\|link={{{page\|{{BASEPAGENAME}}}}}\|alt={{{alt\|Thumbnail for {{{page\|{{BASEPAGENAME}}}}}}}]]</div~~>		<div class="article-thumb__imgwrap">
			{{#ifexist: File:{{{image\|work-in-progress-book.jpg}}}
			\| [[File:{{{image\|work-in-progress-book.jpg}}}\|{{{width\|180}}}px\|link={{{page\|{{BASEPAGENAME}}}}}\|alt={{{alt\|Thumbnail for {{{page\|{{BASEPAGENAME}}}}}}}]]
			\| [[File:work-in-progress-book.jpg\|{{{width\|180}}}px\|link={{{page\|{{BASEPAGENAME}}}}}\|alt={{{alt\|Thumbnail for {{{page\|{{BASEPAGENAME}}}}}}}]]
			}}
			</div>
	<div class="article-thumb__caption">[[{{{page\|{{BASEPAGENAME}}}}}]]</div>		<div class="article-thumb__caption">[[{{{page\|{{BASEPAGENAME}}}}}]]</div>
	</div><noinclude>		</div><noinclude>
Line 9:		Line 14:

	== Parameters ==		== Parameters ==
	* <code>image</code> – ~~'''Required~~.~~'''~~ File name of the image '''without''' the <code>File:</code> prefix (e.g., <code>Atomic Habits cover.jpg</code>).		* <code>image</code> – Optional. File name of the image '''without''' the <code>File:</code> prefix (e.g., <code>Atomic Habits cover.jpg</code>).
			If the file is missing or not provided, it falls back to <code>work-in-progress-book.jpg</code>.
	* <code>page</code> – Optional. Target page for the image link and caption. Defaults to <code>{{BASEPAGENAME}}</code>.		* <code>page</code> – Optional. Target page for the image link and caption. Defaults to <code>{{BASEPAGENAME}}</code>.
	* <code>width</code> – Optional. Width passed to the file thumbnail ('''numeric only, no units'''). Defaults to <code>180</code>.		* <code>width</code> – Optional. Width passed to the file thumbnail ('''numeric only, no units'''). Defaults to <code>180</code>.
Line 61:		Line 67:
	== Notes ==		== Notes ==
	* Provide the exact file name, including extension, but do not include the <code>File:</code> prefix in <code>\|image=</code>.		* Provide the exact file name, including extension, but do not include the <code>File:</code> prefix in <code>\|image=</code>.
			* If the provided image file does not exist (or is omitted), this template automatically uses <code>work-in-progress-book.jpg</code>.
	* The CSS fixes the card width (150 px) and image area height (180 px). The image is centered and constrained with <code>max-width:100%</code> and <code>max-height:100%</code>.		* The CSS fixes the card width (150 px) and image area height (180 px). The image is centered and constrained with <code>max-width:100%</code> and <code>max-height:100%</code>.
	* For grid layouts, place multiple template calls on the same line or separated by spaces; each card is <code>display:inline-block</code> and will wrap as needed.		* For grid layouts, place multiple template calls on the same line or separated by spaces; each card is <code>display:inline-block</code> and will wrap as needed.

Wikilah admin at 06:39, 13 October 2025

2025-10-13T06:39:34Z

@@ Line 3: / Line 3: @@
 <div class="article-thumb__imgwrap">[[File:{{{image}}}|{{{width|180}}}px|link={{{page|{{BASEPAGENAME}}}}}|alt={{{alt|Thumbnail for {{{page|{{BASEPAGENAME}}}}}}}]]</div>
 <div class="article-thumb__caption">[[{{{page|{{BASEPAGENAME}}}}}]]</div>
-</div>
+</div><noinclude>