Rename exampleSite to example

This commit is contained in:
Will Faught
2025-03-05 14:57:35 -08:00
parent d91748c3b9
commit 5fa83107bc
84 changed files with 5 additions and 5 deletions

15
example/README.md Normal file
View File

@@ -0,0 +1,15 @@
# Paige example site
If you move the directory exampleSite out of its parent directory,
you must remove this line from the file exampleSite/go.mod:
```
replace github.com/willfaught/paige => ../
```
and then run this command:
```
$ cd exampleSite
$ hugo mod get github.com/willfaught/paige@latest
```

75
example/content/_index.md Normal file
View File

@@ -0,0 +1,75 @@
+++
keywords = [
"accessibility",
"atom feeds",
"authors",
"blog",
"bootstrap styles and icons",
"breadcrumbs",
"categories",
"code shortcode",
"customizable",
"dark color scheme",
"email shortcode",
"facebook sharing",
"figure shortcode",
"gallery shortcode",
"hugo",
"icon shortcode",
"image pixel densities",
"image shortcode",
"image size breakpoints",
"image thumbnails",
"internationalization",
"landing page",
"light color scheme",
"localizations",
"math typesetting",
"menu",
"minimal design",
"module",
"quote shortcode",
"responsive",
"right-to-left languages",
"rss feeds",
"safari and firefox reader view support",
"search",
"sections",
"seo",
"series",
"single column",
"tab shortcode",
"table of contents",
"tags",
"theme",
"title links",
"twitter sharing",
"validated",
"vimeo shortcode",
"youtube shortcode",
]
[paige.pages]
disable_collections = true
disable_pages = true
disable_sections = true
+++
{{< paige/image alt="Landscape" breakpoints=true class="mt-3 object-fit-cover rounded-4 shadow" fetchpriority="high" height="20rem" loading="eager" process="webp" src="https://images.unsplash.com/photo-1490604001847-b712b0c2f967?w=1296" width="100%" >}}
<h1 class="fw-bold h1 text-center" style="margin-top: 2rem">An advanced Hugo theme</h1>
<div class="container-fluid">
<div class="justify-content-center row">
<div class="col col-auto col-lg-8 px-0">
<p class="lead mb-0 text-center">Paige is designed to put your content front and center, avoiding the typical clutter. The look is seamless and smooth, scalable and readable, portable and efficient. The layout is minimal and responsive, using verticality and white space to delineate and highlight each part of the page. The implementation is flexible and extensible. Its a versatile canvas that serves most needs.</p>
</div>
</div>
</div>
<p class="lead text-center">
<a href="https://github.com/willfaught/paige">Get started!</a>
</p>
<div class="column-gap-3 d-flex display-6 justify-content-center">
{{< paige/icon class="bi bi-github" title="GitHub" url="https://github.com/willfaught/paige" >}}
</div>

View File

@@ -0,0 +1,4 @@
+++
description = "Browse by author."
title = "Authors"
+++

View File

@@ -0,0 +1,8 @@
+++
description = "Demonstration of an author."
title = "Author Demo"
[paige.author]
email = "example@example.com"
name = "Author Demo"
url = "https://example.com"
+++

View File

@@ -0,0 +1,5 @@
+++
description = "Browse by category."
layout = "paige/cloud"
title = "Categories"
+++

View File

@@ -0,0 +1,4 @@
+++
description = "Demonstration of a category."
title = "Paige"
+++

View File

@@ -0,0 +1,4 @@
+++
description = "Demonstrations of content."
title = "Content"
+++

View File

@@ -0,0 +1,19 @@
+++
authors = ["author-demo"]
categories = ["content", "paige"]
description = "An alert."
tags = ["alerts"]
title = "Alert"
[paige.alert]
message = "Get more information <a href=\"#\" class=\"alert-link\">here</a>."
type = "primary"
+++
This page has the following parameters:
```yaml
paige:
alert:
message: "Get more information <a href=\"#\" class=\"alert-link\">here</a>."
type: "primary"
```

View File

@@ -0,0 +1,67 @@
+++
authors = ["author-demo"]
categories = ["content", "paige"]
description = "Guide to emoji usage in Hugo."
tags = ["emoji"]
title = "Emoji Support"
+++
<!--
The MIT License (MIT)
Copyright (c) 2014 Steve Francia
Permission is hereby granted, free of charge, to any person obtaining a copy
of this software and associated documentation files (the "Software"), to deal
in the Software without restriction, including without limitation the rights
to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
copies of the Software, and to permit persons to whom the Software is
furnished to do so, subject to the following conditions:
The above copyright notice and this permission notice shall be included in all
copies or substantial portions of the Software.
THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
SOFTWARE.
-->
Emoji can be enabled in a Hugo project in a number of ways.
<!--more-->
The [`emojify`](https://gohugo.io/functions/emojify/) function can be called directly in templates or [Inline Shortcodes](https://gohugo.io/templates/shortcode-templates/#inline-shortcodes).
To enable emoji globally, set `enableEmoji` to `true` in your site's [configuration](https://gohugo.io/getting-started/configuration/) and then you can type emoji shorthand codes directly in content files; e.g.
<p><span class="nowrap"><span class="emojify">🙈</span> <code>:see_no_evil:</code></span> <span class="nowrap"><span class="emojify">🙉</span> <code>:hear_no_evil:</code></span> <span class="nowrap"><span class="emojify">🙊</span> <code>:speak_no_evil:</code></span></p>
The [Emoji cheat sheet](http://www.emoji-cheat-sheet.com/) is a useful reference for emoji shorthand codes.
***
**N.B.** The above steps enable Unicode Standard emoji characters and sequences in Hugo, however the rendering of these glyphs depends on the browser and the platform. To style the emoji you can either use a third party emoji font or a font stack; e.g.
{{< highlight html >}}
.emoji {
font-family: Apple Color Emoji, Segoe UI Emoji, NotoColorEmoji, Segoe UI Symbol, Android Emoji, EmojiSymbols;
}
{{< /highlight >}}
{{< css.inline >}}
<style>
.emojify {
font-family: Apple Color Emoji, Segoe UI Emoji, NotoColorEmoji, Segoe UI Symbol, Android Emoji, EmojiSymbols;
font-size: 2rem;
vertical-align: middle;
}
@media screen and (max-width:650px) {
.nowrap {
display: block;
margin: 25px 0;
}
}
</style>
{{< /css.inline >}}

View File

@@ -0,0 +1,10 @@
+++
authors = ["author-demo"]
categories = ["content", "paige"]
description = "A front matter link."
link = "https://willfaught.com/paige"
tags = ["link"]
title = "Link"
+++
It takes you to the home page.

View File

@@ -0,0 +1,162 @@
+++
authors = ["author-demo"]
categories = ["content", "paige"]
description = "Sample article showcasing basic Markdown syntax and formatting for HTML elements."
tags = ["css", "html", "markdown"]
title = "Markdown Syntax Guide"
+++
<!--
The MIT License (MIT)
Copyright (c) 2014 Steve Francia
Permission is hereby granted, free of charge, to any person obtaining a copy
of this software and associated documentation files (the "Software"), to deal
in the Software without restriction, including without limitation the rights
to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
copies of the Software, and to permit persons to whom the Software is
furnished to do so, subject to the following conditions:
The above copyright notice and this permission notice shall be included in all
copies or substantial portions of the Software.
THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
SOFTWARE.
-->
This article offers a sample of basic Markdown syntax that can be used in Hugo content files, also it shows whether basic HTML elements are decorated with CSS in a Hugo theme.
<!--more-->
## Headings
The following HTML `<h2>``<h6>` elements represent five levels of section headings. `<h2>` is the highest section level while `<h6>` is the lowest.
## H2
### H3
#### H4
##### H5
###### H6
## Paragraph
Xerum, quo qui aut unt expliquam qui dolut labo. Aque venitatiusda cum, voluptionse latur sitiae dolessi aut parist aut dollo enim qui voluptate ma dolestendit peritin re plis aut quas inctum laceat est volestemque commosa as cus endigna tectur, offic to cor sequas etum rerum idem sintibus eiur? Quianimin porecus evelectur, cum que nis nust voloribus ratem aut omnimi, sitatur? Quiatem. Nam, omnis sum am facea corem alique molestrunt et eos evelece arcillit ut aut eos eos nus, sin conecerem erum fuga. Ri oditatquam, ad quibus unda veliamenimin cusam et facea ipsamus es exerum sitate dolores editium rerore eost, temped molorro ratiae volorro te reribus dolorer sperchicium faceata tiustia prat.
Itatur? Quiatae cullecum rem ent aut odis in re eossequodi nonsequ idebis ne sapicia is sinveli squiatum, core et que aut hariosam ex eat.
## Blockquotes
The blockquote element represents content that is quoted from another source, optionally with a citation which must be within a `footer` or `cite` element, and optionally with in-line changes such as annotations and abbreviations.
### Blockquote without attribution
> Tiam, ad mint andaepu dandae nostion secatur sequo quae.
> **Note** that you can use *Markdown syntax* within a blockquote.
### Blockquote with attribution
> Don't communicate by sharing memory, share memory by communicating.<br>
> — <cite>Rob Pike[^1]</cite>
[^1]: The above quote is excerpted from Rob Pike's [talk](https://www.youtube.com/watch?v=PAAkCSZUG1c) during Gopherfest, November 18, 2015.
## Tables
Tables aren't part of the core Markdown spec, but Hugo supports supports them out-of-the-box.
Name | Age
--------|------
Bob | 27
Alice | 23
### Inline Markdown within tables
| Italics | Bold | Code |
| -------- | -------- | ------ |
| *italics* | **bold** | `code` |
## Code Blocks
### Code block with backticks
```html
<!doctype html>
<html lang="en">
<head>
<meta charset="utf-8">
<title>Example HTML5 Document</title>
</head>
<body>
<p>Test</p>
</body>
</html>
```
### Code block indented with four spaces
<!doctype html>
<html lang="en">
<head>
<meta charset="utf-8">
<title>Example HTML5 Document</title>
</head>
<body>
<p>Test</p>
</body>
</html>
### Code block with Hugo's internal highlight shortcode
{{< highlight html >}}
<!doctype html>
<html lang="en">
<head>
<meta charset="utf-8">
<title>Example HTML5 Document</title>
</head>
<body>
<p>Test</p>
</body>
</html>
{{< /highlight >}}
## List Types
### Ordered List
1. First item
2. Second item
3. Third item
### Unordered List
* List item
* Another item
* And another item
### Nested list
* Fruit
* Apple
* Orange
* Banana
* Dairy
* Milk
* Cheese
## Other Elements — abbr, sub, sup, kbd, mark
<abbr title="Graphics Interchange Format">GIF</abbr> is a bitmap image format.
H<sub>2</sub>O
X<sup>n</sup> + Y<sup>n</sup> = Z<sup>n</sup>
Press <kbd><kbd>CTRL</kbd>+<kbd>ALT</kbd>+<kbd>Delete</kbd></kbd> to end the session.
Most <mark>salamanders</mark> are nocturnal, and hunt for insects, worms, and other small creatures.

View File

@@ -0,0 +1,64 @@
+++
authors = ["author-demo"]
categories = ["content", "paige"]
description = "A brief guide to setup KaTeX."
tags = ["katex", "math", "typesetting"]
title = "Math Typesetting"
[paige]
enable_math = true
+++
<!--
The MIT License (MIT)
Copyright (c) 2014 Steve Francia
Permission is hereby granted, free of charge, to any person obtaining a copy
of this software and associated documentation files (the "Software"), to deal
in the Software without restriction, including without limitation the rights
to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
copies of the Software, and to permit persons to whom the Software is
furnished to do so, subject to the following conditions:
The above copyright notice and this permission notice shall be included in all
copies or substantial portions of the Software.
THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
SOFTWARE.
-->
Mathematical notation in a Hugo project can be enabled by using third party JavaScript libraries.
<!--more-->
In this example we will be using [KaTeX](https://katex.org/)
- Create a partial under `/layouts/partials/math.html`
- Within this partial reference the [Auto-render Extension](https://katex.org/docs/autorender.html) or host these scripts locally.
- Include the partial in your templates like so:
```
{{ if or .Params.math .Site.Params.math }}
{{ partial "math.html" . }}
{{ end }}
```
- To enable KaTeX globally set the parameter `math` to `true` in a project's configuration
- To enable KaTeX on a per page basis include the parameter `math: true` in content files
**Note:** Use the online reference of [Supported TeX Functions](https://katex.org/docs/supported.html)
## Examples
<p>
Inline math: \(\varphi = \dfrac{1+\sqrt5}{2}= 1.6180339887…\)
</p>
Block math:
$$
\varphi = 1+\frac{1} {1+\frac{1} {1+\frac{1} {1+\cdots} } }
$$

View File

@@ -0,0 +1,66 @@
+++
authors = ["author-demo"]
categories = ["content", "paige"]
description = "Lorem Ipsum Dolor Si Amet."
tags = ["markdown", "text"]
title = "Placeholder Text"
+++
<!--
The MIT License (MIT)
Copyright (c) 2014 Steve Francia
Permission is hereby granted, free of charge, to any person obtaining a copy
of this software and associated documentation files (the "Software"), to deal
in the Software without restriction, including without limitation the rights
to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
copies of the Software, and to permit persons to whom the Software is
furnished to do so, subject to the following conditions:
The above copyright notice and this permission notice shall be included in all
copies or substantial portions of the Software.
THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
SOFTWARE.
-->
Lorem est tota propiore conpellat pectoribus de pectora summo. <!--more-->Redit teque digerit hominumque toris verebor lumina non cervice subde tollit usus habet Arctonque, furores quas nec ferunt. Quoque montibus nunc caluere tempus inhospita parcite confusaque translucet patri vestro qui optatis lumine cognoscere flos nubis! Fronde ipsamque patulos Dryopen deorum.
1. Exierant elisi ambit vivere dedere
2. Duce pollice
3. Eris modo
4. Spargitque ferrea quos palude
Rursus nulli murmur; hastile inridet ut ab gravi sententia! Nomine potitus silentia flumen, sustinet placuit petis in dilapsa erat sunt. Atria tractus malis.
1. Comas hunc haec pietate fetum procerum dixit
2. Post torum vates letum Tiresia
3. Flumen querellas
4. Arcanaque montibus omnes
5. Quidem et
# Vagus elidunt
<svg class="canon" xmlns="http://www.w3.org/2000/svg" overflow="visible" viewBox="0 0 496 373" height="373" width="496"><g fill="none"><path stroke="#000" stroke-width=".75" d="M.599 372.348L495.263 1.206M.312.633l494.95 370.853M.312 372.633L247.643.92M248.502.92l246.76 370.566M330.828 123.869V1.134M330.396 1.134L165.104 124.515"></path><path stroke="#ED1C24" stroke-width=".75" d="M275.73 41.616h166.224v249.05H275.73zM54.478 41.616h166.225v249.052H54.478z"></path><path stroke="#000" stroke-width=".75" d="M.479.375h495v372h-495zM247.979.875v372"></path><ellipse cx="498.729" cy="177.625" rx=".75" ry="1.25"></ellipse><ellipse cx="247.229" cy="377.375" rx=".75" ry="1.25"></ellipse></g></svg>
[The Van de Graaf Canon](https://en.wikipedia.org/wiki/Canons_of_page_construction#Van_de_Graaf_canon)
## Mane refeci capiebant unda mulcebat
Victa caducifer, malo vulnere contra dicere aurato, ludit regale, voca! Retorsit colit est profanae esse virescere furit nec; iaculi matertera et visa est, viribus. Divesque creatis, tecta novat collumque vulnus est, parvas. **Faces illo pepulere** tempus adest. Tendit flamma, ab opes virum sustinet, sidus sequendo urbis.
Iubar proles corpore raptos vero auctor imperium; sed et huic: manus caeli Lelegas tu lux. Verbis obstitit intus oblectamina fixis linguisque ausus sperare Echionides cornuaque tenent clausit possit. Omnia putatur. Praeteritae refert ausus; ferebant e primus lora nutat, vici quae mea ipse. Et iter nil spectatae vulnus haerentia iuste et exercebat, sui et.
Eurytus Hector, materna ipsumque ut Politen, nec, nate, ignari, vernum cohaesit sequitur. Vel **mitis temploque** vocatus, inque alis, *oculos nomen* non silvis corpore coniunx ne displicet illa. Crescunt non unus, vidit visa quantum inmiti flumina mortis facto sic: undique a alios vincula sunt iactata abdita! Suspenderat ego fuit tendit: luna, ante urbem Propoetides **parte**.
{{< css.inline >}}
<style>
.canon { background: white; width: 100%; height: auto; }
</style>
{{< /css.inline >}}

View File

@@ -0,0 +1,51 @@
+++
authors = ["author-demo"]
categories = ["content", "paige"]
description = "A brief description of Hugo Shortcodes."
tags = ["privacy", "shortcodes"]
title = "Rich Content"
+++
<!--
The MIT License (MIT)
Copyright (c) 2014 Steve Francia
Permission is hereby granted, free of charge, to any person obtaining a copy
of this software and associated documentation files (the "Software"), to deal
in the Software without restriction, including without limitation the rights
to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
copies of the Software, and to permit persons to whom the Software is
furnished to do so, subject to the following conditions:
The above copyright notice and this permission notice shall be included in all
copies or substantial portions of the Software.
THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
SOFTWARE.
-->
Hugo ships with several [Built-in Shortcodes](https://gohugo.io/content-management/shortcodes/#use-hugos-built-in-shortcodes) for rich content, along with a [Privacy Config](https://gohugo.io/about/hugo-and-gdpr/) and a set of Simple Shortcodes that enable static and no-JS versions of various social media embeds.
<!--more-->
---
## YouTube Privacy Enhanced Shortcode
{{< youtube ZJthWmvUzzc >}}
---
## X Shortcode
{{< x user="DesignReviewed" id="1085870671291310081" >}}
---
## Vimeo Simple Shortcode
{{< vimeo_simple 48912912 >}}

View File

@@ -0,0 +1,172 @@
+++
authors = ["author-demo"]
categories = ["customization", "paige"]
description = "Demonstrations of customizations."
series = ["series-demo"]
tags = ["sections"]
title = "Customizations"
[paige.pages]
disable_authors = false
disable_auto_schema = true
disable_date = false
disable_description = false
disable_edit = false
disable_history = false
disable_keywords = false
disable_next = false
disable_prev = false
disable_reading_time = false
disable_series = false
disable_title = false
disable_toc = false
disable_word_count = false
full_width = true
[paige.pages.base_schema]
isAccessibleForFree = true
isFamilyFriendly = true
[paige.pages.base_schema.publisher]
"@type" = "Organization"
name = "Paige"
url = "https://github.com/willfaught/paige"
[paige.pages.microdata]
itemid = "https://willfaught.com/paige/customizations/"
itemscope = ""
itemtype = "https://schema.org/HowTo"
[[paige.pages.schemas]]
"@context" = "https://schema.org"
"@type" = "WebPage"
name = "Customization"
url = "https://willfaught.com/paige/customizations/"
[paige.site]
color = "#df4655"
color_scheme = "dark"
credit = '<a class="link-secondary text-decoration-none" href="https://github.com/willfaught/paige">Paige Theme</a>'
date_format = ":date_full"
description = "Mighty, malleable media mastery"
disable_breadcrumbs = false
disable_credit = false
disable_license = false
edit_url = "https://github.com/willfaught/paige/edit/master/exampleSite/content/%s"
external_link_new_tab = true
history_url = "https://github.com/willfaught/paige/commits/master/exampleSite/content/%s"
keyword_style = "pills"
license = "EUPL License"
menu_style = "tabs"
[paige.site.base_schema]
isAccessibleForFree = true
isFamilyFriendly = true
[paige.site.base_schema.publisher]
"@type" = "Organization"
name = "Paige"
url = "https://github.com/willfaught/paige"
[[paige.site.schemas]]
"@context" = "https://schema.org"
"@type" = "WebSite"
name = "Paige"
url = "https://willfaught.com/paige/"
[paige.subpages]
disable_authors = false
disable_date = false
disable_keywords = false
disable_reading_time = false
disable_series = false
disable_summary = false
disable_word_count = false
+++
This site hides some section page data by default. This page shows it all.
<!--more-->
## Parameters
This page has the following parameters:
```toml
[paige.pages]
disable_authors = false
disable_auto_schema = true
disable_date = false
disable_description = false
disable_edit = false
disable_history = false
disable_keywords = false
disable_next = false
disable_prev = false
disable_reading_time = false
disable_series = false
disable_title = false
disable_toc = false
disable_word_count = false
full_width = true
[paige.pages.base_schema]
isAccessibleForFree = true
isFamilyFriendly = true
[paige.pages.base_schema.publisher]
"@type" = "Organization"
name = "Paige"
url = "https://github.com/willfaught/paige"
[paige.pages.microdata]
itemid = "https://willfaught.com/paige/customizations/"
itemscope = ""
itemtype = "https://schema.org/HowTo"
[[paige.pages.schemas]]
"@context" = "https://schema.org"
"@type" = "WebPage"
name = "Customization"
url = "https://willfaught.com/paige/customizations/"
[paige.site]
color = "#df4655"
color_scheme = "dark"
credit = '<a class="link-secondary text-decoration-none" href="https://github.com/willfaught/paige">Paige Theme</a>'
date_format = ":date_full"
description = "Mighty, malleable media mastery"
disable_breadcrumbs = false
disable_credit = false
disable_license = false
edit_url = "https://github.com/willfaught/paige/edit/master/exampleSite/content/%s"
external_link_new_tab = true
history_url = "https://github.com/willfaught/paige/commits/master/exampleSite/content/%s"
keyword_style = "pills"
license = "EUPL License"
menu_style = "tabs"
[paige.site.base_schema]
isAccessibleForFree = true
isFamilyFriendly = true
[paige.site.base_schema.publisher]
"@type" = "Organization"
name = "Paige"
url = "https://github.com/willfaught/paige"
[[paige.site.schemas]]
"@context" = "https://schema.org"
"@type" = "WebSite"
name = "Paige"
url = "https://willfaught.com/paige/"
[paige.subpages]
disable_authors = false
disable_date = false
disable_keywords = false
disable_reading_time = false
disable_series = false
disable_summary = false
disable_word_count = false
```

View File

@@ -0,0 +1,155 @@
+++
authors = ["author-demo"]
categories = ["customization", "paige"]
date = 2023-09-18T21:21:05-07:00
description = "Demonstration of a customization that shows all data."
series = ["series-demo"]
tags = ["show", "singles"]
title = "Show Data"
[paige.pages]
disable_authors = false
disable_auto_schema = true
disable_date = false
disable_description = false
disable_edit = false
disable_history = false
disable_keywords = false
disable_next = false
disable_prev = false
disable_reading_time = false
disable_series = false
disable_title = false
disable_toc = false
disable_word_count = false
full_width = true
[paige.pages.base_schema]
isAccessibleForFree = true
isFamilyFriendly = true
[paige.pages.base_schema.publisher]
"@type" = "Organization"
name = "Paige"
url = "https://github.com/willfaught/paige"
[paige.pages.microdata]
itemid = "https://willfaught.com/paige/customizations/show/"
itemscope = ""
itemtype = "https://schema.org/HowTo"
[[paige.pages.schemas]]
"@context" = "https://schema.org"
"@type" = "WebPage"
name = "Show"
url = "https://willfaught.com/paige/customizations/show/"
[paige.site]
color = "#df4655"
color_scheme = "dark"
credit = '<a class="link-secondary text-decoration-none" href="https://github.com/willfaught/paige">Paige Theme</a>'
date_format = ":date_full"
description = "Mighty, malleable media mastery"
disable_breadcrumbs = false
disable_credit = false
disable_license = false
edit_url = "https://github.com/willfaught/paige/edit/master/exampleSite/content/%s"
external_link_new_tab = true
history_url = "https://github.com/willfaught/paige/commits/master/exampleSite/content/%s"
keyword_style = "pills"
license = "EUPL License"
menu_style = "tabs"
[paige.site.base_schema]
isAccessibleForFree = true
isFamilyFriendly = true
[paige.site.base_schema.publisher]
"@type" = "Organization"
name = "Paige"
url = "https://github.com/willfaught/paige"
[[paige.site.schemas]]
"@context" = "https://schema.org"
"@type" = "WebSite"
name = "Paige"
url = "https://willfaught.com/paige/"
+++
This page shows some data that the rest of the site hides.
<!--more-->
## Parameters
This page has the following parameters:
```toml
[paige.pages]
disable_authors = false
disable_auto_schema = true
disable_date = false
disable_description = false
disable_edit = false
disable_history = false
disable_keywords = false
disable_next = false
disable_prev = false
disable_reading_time = false
disable_series = false
disable_title = false
disable_toc = false
disable_word_count = false
full_width = true
[paige.pages.base_schema]
isAccessibleForFree = true
isFamilyFriendly = true
[paige.pages.base_schema.publisher]
"@type" = "Organization"
name = "Paige"
url = "https://github.com/willfaught/paige"
[paige.pages.microdata]
itemid = "https://willfaught.com/paige/customizations/show/"
itemscope = ""
itemtype = "https://schema.org/HowTo"
[[paige.pages.schemas]]
"@context" = "https://schema.org"
"@type" = "WebPage"
name = "Show"
url = "https://willfaught.com/paige/customizations/show/"
[paige.site]
color = "#df4655"
color_scheme = "dark"
credit = '<a class="link-secondary text-decoration-none" href="https://github.com/willfaught/paige">Paige Theme</a>'
date_format = ":date_full"
description = "Mighty, malleable media mastery"
disable_breadcrumbs = false
disable_credit = false
disable_license = false
edit_url = "https://github.com/willfaught/paige/edit/master/exampleSite/content/%s"
external_link_new_tab = true
history_url = "https://github.com/willfaught/paige/commits/master/exampleSite/content/%s"
keyword_style = "pills"
license = "EUPL License"
menu_style = "tabs"
[paige.site.base_schema]
isAccessibleForFree = true
isFamilyFriendly = true
[paige.site.base_schema.publisher]
"@type" = "Organization"
name = "Paige"
url = "https://github.com/willfaught/paige"
[[paige.site.schemas]]
"@context" = "https://schema.org"
"@type" = "WebSite"
name = "Paige"
url = "https://willfaught.com/paige/"
```

View File

@@ -0,0 +1,203 @@
+++
authors = ["author-demo"]
categories = ["customization", "paige"]
date = 2023-09-18T20:21:05-07:00
description = "Demonstration of a customization that styles all data."
series = ["series-demo"]
tags = ["singles", "style"]
title = "Style Data"
[paige]
style = """
#paige-page-authors,
#paige-page-content,
#paige-page-date,
#paige-page-description,
#paige-page-file,
#paige-page-keywords,
#paige-page-reading-time,
#paige-page-series,
#paige-page-siblings,
#paige-page-title,
#paige-page-toc,
#paige-site-breadcrumbs,
#paige-site-copyright,
#paige-site-credit,
#paige-site-description,
#paige-site-license,
#paige-site-menu,
#paige-site-title {
font-style: italic;
}
"""
[paige.pages]
disable_authors = false
disable_auto_schema = true
disable_date = false
disable_description = false
disable_edit = false
disable_history = false
disable_keywords = false
disable_next = false
disable_prev = false
disable_reading_time = false
disable_series = false
disable_title = false
disable_toc = false
disable_word_count = false
full_width = true
[paige.pages.base_schema]
isAccessibleForFree = true
isFamilyFriendly = true
[paige.pages.base_schema.publisher]
"@type" = "Organization"
name = "Paige"
url = "https://github.com/willfaught/paige"
[paige.pages.microdata]
itemid = "https://willfaught.com/paige/customizations/style/"
itemscope = ""
itemtype = "https://schema.org/HowTo"
[[paige.pages.schemas]]
"@context" = "https://schema.org"
"@type" = "WebPage"
name = "Style"
url = "https://willfaught.com/paige/customizations/style/"
[paige.site]
color = "#df4655"
color_scheme = "dark"
credit = '<a class="link-secondary text-decoration-none" href="https://github.com/willfaught/paige">Paige Theme</a>'
date_format = ":date_full"
description = "Mighty, malleable media mastery"
disable_breadcrumbs = false
disable_credit = false
disable_license = false
edit_url = "https://github.com/willfaught/paige/edit/master/exampleSite/content/%s"
external_link_new_tab = true
history_url = "https://github.com/willfaught/paige/commits/master/exampleSite/content/%s"
keyword_style = "pills"
license = "EUPL License"
menu_style = "tabs"
[paige.site.base_schema]
isAccessibleForFree = true
isFamilyFriendly = true
[paige.site.base_schema.publisher]
"@type" = "Organization"
name = "Paige"
url = "https://github.com/willfaught/paige"
[[paige.site.schemas]]
"@context" = "https://schema.org"
"@type" = "WebSite"
name = "Paige"
url = "https://willfaught.com/paige/"
+++
This page styles some data differently than the rest of the site.
<!--more-->
## Parameters
This page has the following parameters:
```toml
[paige]
style = """
#paige-page-authors,
#paige-page-content,
#paige-page-date,
#paige-page-description,
#paige-page-file,
#paige-page-keywords,
#paige-page-reading-time,
#paige-page-series,
#paige-page-siblings,
#paige-page-title,
#paige-page-toc,
#paige-site-breadcrumbs,
#paige-site-copyright,
#paige-site-credit,
#paige-site-description,
#paige-site-license,
#paige-site-menu,
#paige-site-title {
font-style: italic;
}
"""
[paige.pages]
disable_authors = false
disable_auto_schema = true
disable_date = false
disable_description = false
disable_edit = false
disable_history = false
disable_keywords = false
disable_next = false
disable_prev = false
disable_reading_time = false
disable_series = false
disable_title = false
disable_toc = false
disable_word_count = false
full_width = true
[paige.pages.base_schema]
isAccessibleForFree = true
isFamilyFriendly = true
[paige.pages.base_schema.publisher]
"@type" = "Organization"
name = "Paige"
url = "https://github.com/willfaught/paige"
[paige.pages.microdata]
itemid = "https://willfaught.com/paige/customizations/"
itemscope = ""
itemtype = "https://schema.org/HowTo"
[[paige.pages.schemas]]
"@context" = "https://schema.org"
"@type" = "WebPage"
name = "Style"
url = "https://willfaught.com/paige/customizations/"
[paige.site]
color = "#df4655"
color_scheme = "dark"
credit = '<a class="link-secondary text-decoration-none" href="https://github.com/willfaught/paige">Paige Theme</a>'
date_format = ":date_full"
description = "Mighty, malleable media mastery"
disable_breadcrumbs = false
disable_credit = false
disable_license = false
edit_url = "https://github.com/willfaught/paige/edit/master/exampleSite/content/%s"
external_link_new_tab = true
history_url = "https://github.com/willfaught/paige/commits/master/exampleSite/content/%s"
keyword_style = "pills"
license = "EUPL License"
menu_style = "tabs"
[paige.site.base_schema]
isAccessibleForFree = true
isFamilyFriendly = true
[paige.site.base_schema.publisher]
"@type" = "Organization"
name = "Paige"
url = "https://github.com/willfaught/paige"
[[paige.site.schemas]]
"@context" = "https://schema.org"
"@type" = "WebSite"
name = "Paige"
url = "https://willfaught.com/paige/"
```

View File

@@ -0,0 +1,4 @@
+++
description = "Demonstrations of layouts."
title = "Layouts"
+++

View File

@@ -0,0 +1,20 @@
+++
authors = ["author-demo"]
categories = ["layouts", "paige"]
description = "Demonstration of the cloud layout."
layout = "paige/cloud"
tags = ["cloud"]
title = "Cloud"
+++
The `paige/cloud` layout displays list page links as a link cloud.
<!--more-->
This page has the following parameters:
```yaml
layout: "paige/cloud"
```
Result:

View File

@@ -0,0 +1,3 @@
+++
title = "Apple"
+++

View File

@@ -0,0 +1,3 @@
+++
title = "Banana"
+++

View File

@@ -0,0 +1,3 @@
+++
title = "Cantaloupe"
+++

View File

@@ -0,0 +1,30 @@
+++
authors = ["author-demo"]
categories = ["layouts", "paige"]
description = "Demonstration of the search layout."
layout = "paige/search"
tags = ["search"]
title = "Search"
+++
The `paige/search` layout provides site search.
<!--more-->
Example `config.yaml`:
```yaml
outputs:
home: ["atom", "html", "paige-search", "rss"]
```
Example `content/layouts/search.md`:
```yaml
---
layout: "paige/search"
title: "Search"
---
```
Result:

View File

@@ -0,0 +1,4 @@
+++
description = "Browse by series."
title = "Series"
+++

View File

@@ -0,0 +1,4 @@
+++
description = "Demonstration of a series."
title = "Series Demo"
+++

View File

@@ -0,0 +1,4 @@
+++
description = "Demonstrations of shortcodes."
title = "Shortcodes"
+++

View File

@@ -0,0 +1,220 @@
+++
authors = ["author-demo"]
categories = ["paige", "shortcodes"]
description = "Demonstration of the code shortcode."
tags = ["code", "figures"]
title = "Code"
+++
The `paige/code` shortcode displays code.
<!--more-->
## Basic
Code:
```go-html-template
{{</* paige/code */>}}
q = 'q = %r; print(q %% q)'; print(q % q)
{{</* /paige/code */>}}
```
Result:
{{< paige/code >}}
q = 'q = %r; print(q %% q)'; print(q % q)
{{< /paige/code >}}
---
Code:
```go-html-template
{{</* paige/code */>}}
---
- --
--( / \ )XXXXXXXXXXXXX
--XXX( O O )XXXXXXXXXXXXXXX-
/XXX( U ) XXXXXXX\
/XXXXX( )-- XXXXXXXXXXX\
/XXXXX/ ( O ) XXXXXX \XXXXX\
XXXXX/ / XXXXXX \ \XXXXX----
XXXXXX / XXXXXX \ ---- -
--- XXX / XXXXXX \ ---
-- -- / /\ XXXXXX / ---=
- / XXXXXX '--- XXXXXX
--\/XXX\ XXXXXX /XXXXX
\XXXXXXXXX /XXXXX/
\XXXXXX /XXXXX/
\XXXXX-- / -- XXXX/
--XXXXXXX--------------- XXXXX--
\XXXXXXXXXXXXXXXXXXXXXXXX-
--XXXXXXXXXXXXXXXXXX-
{{</* /paige/code */>}}
```
Result:
{{< paige/code >}}
---
- --
--( / \ )XXXXXXXXXXXXX
--XXX( O O )XXXXXXXXXXXXXXX-
/XXX( U ) XXXXXXX\
/XXXXX( )-- XXXXXXXXXXX\
/XXXXX/ ( O ) XXXXXX \XXXXX\
XXXXX/ / XXXXXX \ \XXXXX----
XXXXXX / XXXXXX \ ---- -
--- XXX / XXXXXX \ ---
-- -- / /\ XXXXXX / ---=
- / XXXXXX '--- XXXXXX
--\/XXX\ XXXXXX /XXXXX
\XXXXXXXXX /XXXXX/
\XXXXXX /XXXXX/
\XXXXX-- / -- XXXX/
--XXXXXXX--------------- XXXXX--
\XXXXXXXXXXXXXXXXXXXXXXXX-
--XXXXXXXXXXXXXXXXXX-
{{< /paige/code >}}
## Lang parameter
Code:
```go-html-template
{{</* paige/code lang="c" */>}}
float Q_rsqrt( float number )
{
long i;
float x2, y;
const float threehalfs = 1.5F;
x2 = number * 0.5F;
y = number;
i = * ( long * ) &y;
i = 0x5f3759df - ( i >> 1 );
y = * ( float * ) &i;
y = y * ( threehalfs - ( x2 * y * y ) );
return y;
}
{{</* /paige/code */>}}
```
Result:
{{< paige/code lang="c" >}}
float Q_rsqrt( float number )
{
long i;
float x2, y;
const float threehalfs = 1.5F;
x2 = number * 0.5F;
y = number;
i = * ( long * ) &y;
i = 0x5f3759df - ( i >> 1 );
y = * ( float * ) &i;
y = y * ( threehalfs - ( x2 * y * y ) );
return y;
}
{{< /paige/code >}}
## Options parameter
Code:
```go-html-template
{{</* paige/code options="linenos=true,hl_lines=10" */>}}
float Q_rsqrt( float number )
{
long i;
float x2, y;
const float threehalfs = 1.5F;
x2 = number * 0.5F;
y = number;
i = * ( long * ) &y;
i = 0x5f3759df - ( i >> 1 );
y = * ( float * ) &i;
y = y * ( threehalfs - ( x2 * y * y ) );
return y;
}
{{</* /paige/code */>}}
```
Result:
{{< paige/code options="linenos=true,hl_lines=10" >}}
float Q_rsqrt( float number )
{
long i;
float x2, y;
const float threehalfs = 1.5F;
x2 = number * 0.5F;
y = number;
i = * ( long * ) &y;
i = 0x5f3759df - ( i >> 1 );
y = * ( float * ) &i;
y = y * ( threehalfs - ( x2 * y * y ) );
return y;
}
{{< /paige/code >}}
## Unescape parameter
Code:
```go-html-template
{{</* paige/code unescape=false */>}}
{{</* paige/request "[...]" */>}}
{{</* /paige/code */>}}
```
Result:
{{< paige/code unescape=false >}}
{{< paige/request "https://gist.githubusercontent.com/willfaught/fe6f6a8b9715e70112b6894935ecbecd/raw/64f41b7eb47ed5a60172217f8ba3868c23f69d21/qrsqrt.c" >}}
{{< /paige/code >}}
---
Code:
```go-html-template
{{</* paige/code unescape=true */>}}
{{</* paige/request "[...]" */>}}
{{</* /paige/code */>}}
```
Result:
{{< paige/code unescape=true >}}
{{< paige/request "https://gist.githubusercontent.com/willfaught/fe6f6a8b9715e70112b6894935ecbecd/raw/64f41b7eb47ed5a60172217f8ba3868c23f69d21/qrsqrt.c" >}}
{{< /paige/code >}}
## Figure
Code:
```go-html-template
{{</* paige/figure caption="Quine" */>}}
{{</* paige/code lang="python" */>}}
q = 'q = %r; print(q %% q)'; print(q % q)
{{</* /paige/code */>}}
{{</* /paige/figure */>}}
```
Result:
{{< paige/figure caption="Quine" >}}
{{< paige/code lang="python" >}}
q = 'q = %r; print(q %% q)'; print(q % q)
{{< /paige/code >}}
{{< /paige/figure >}}

View File

@@ -0,0 +1,23 @@
+++
authors = ["author-demo"]
categories = ["paige", "shortcodes"]
description = "Demonstration of the email shortcode."
tags = ["email"]
title = "Email"
+++
The `paige/email` shortcode hides e-mail addresses from crawlers.
<!--more-->
## Address parameter
Code:
```go-html-template
{{%/* paige/email address="example@example.com" */%}}E-mail me{{%/* /paige/email */%}}
```
Result:
{{% paige/email address="example@example.com" %}}E-mail me{{% /paige/email %}}

View File

@@ -0,0 +1,559 @@
+++
authors = ["author-demo"]
categories = ["paige", "shortcodes"]
description = "Demonstration of the figure shortcode."
tags = ["figures"]
title = "Figure"
+++
The `paige/figure` shortcode displays content in a figure.
<!--more-->
## Basic
Code:
```go-html-template
{{</* paige/figure */>}}
Hickory dickory dock.<br>
The mouse ran up the clock.<br>
The clock struck one,<br>
The mouse ran down,<br>
Hickory dickory dock.
{{</* /paige/figure */>}}
```
Result:
{{< paige/figure >}}
Hickory dickory dock.<br>
The mouse ran up the clock.<br>
The clock struck one,<br>
The mouse ran down,<br>
Hickory dickory dock.
{{< /paige/figure >}}
## Caption parameter
Code:
```go-html-template
{{</* paige/figure caption="Hickory Dickory Dock" */>}}
Hickory dickory dock.<br>
The mouse ran up the clock.<br>
The clock struck one,<br>
The mouse ran down,<br>
Hickory dickory dock.
{{</* /paige/figure */>}}
```
Result:
{{< paige/figure caption="Hickory Dickory Dock" >}}
Hickory dickory dock.<br>
The mouse ran up the clock.<br>
The clock struck one,<br>
The mouse ran down,<br>
Hickory dickory dock.
{{< /paige/figure >}}
## Float parameter
Code:
```go-html-template
{{</* paige/figure float="start" */>}}
Hickory dickory dock.<br>
The mouse ran up the clock.<br>
The clock struck one,<br>
The mouse ran down,<br>
Hickory dickory dock.
{{</* /paige/figure */>}}
Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Habitant morbi tristique senectus et netus et. Phasellus vestibulum lorem sed risus ultricies tristique nulla aliquet enim. Est lorem ipsum dolor sit amet. Consequat mauris nunc congue nisi. Sodales ut etiam sit amet nisl purus in mollis nunc. Vehicula ipsum a arcu cursus vitae congue. Ultrices eros in cursus turpis massa tincidunt dui. Aliquet bibendum enim facilisis gravida. Eu turpis egestas pretium aenean pharetra magna ac placerat. Sed turpis tincidunt id aliquet risus feugiat. Gravida neque convallis a cras. Cras ornare arcu dui vivamus arcu felis bibendum. Vulputate dignissim suspendisse in est. Iaculis at erat pellentesque adipiscing commodo elit at imperdiet. Amet luctus venenatis lectus magna fringilla urna porttitor rhoncus. Placerat orci nulla pellentesque dignissim enim sit amet venenatis urna. Nisl nisi scelerisque eu ultrices vitae auctor eu. Tortor pretium viverra suspendisse potenti nullam ac. Vitae congue mauris rhoncus aenean vel elit scelerisque mauris pellentesque. Fringilla est ullamcorper eget nulla facilisi etiam dignissim diam quis. Facilisis gravida neque convallis a cras semper auctor neque vitae. In dictum non consectetur a erat nam at lectus urna. Eu lobortis elementum nibh tellus. Interdum varius sit amet mattis vulputate. Quisque id diam vel quam elementum pulvinar etiam non quam. Tellus mauris a diam maecenas sed enim ut. Maecenas accumsan lacus vel facilisis volutpat est velit egestas dui.
```
Result:
{{< paige/figure float="start" >}}
Hickory dickory dock.<br>
The mouse ran up the clock.<br>
The clock struck one,<br>
The mouse ran down,<br>
Hickory dickory dock.
{{< /paige/figure >}}
Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Habitant morbi tristique senectus et netus et. Phasellus vestibulum lorem sed risus ultricies tristique nulla aliquet enim. Est lorem ipsum dolor sit amet. Consequat mauris nunc congue nisi. Sodales ut etiam sit amet nisl purus in mollis nunc. Vehicula ipsum a arcu cursus vitae congue. Ultrices eros in cursus turpis massa tincidunt dui. Aliquet bibendum enim facilisis gravida. Eu turpis egestas pretium aenean pharetra magna ac placerat. Sed turpis tincidunt id aliquet risus feugiat. Gravida neque convallis a cras. Cras ornare arcu dui vivamus arcu felis bibendum. Vulputate dignissim suspendisse in est. Iaculis at erat pellentesque adipiscing commodo elit at imperdiet. Amet luctus venenatis lectus magna fringilla urna porttitor rhoncus. Placerat orci nulla pellentesque dignissim enim sit amet venenatis urna. Nisl nisi scelerisque eu ultrices vitae auctor eu. Tortor pretium viverra suspendisse potenti nullam ac. Vitae congue mauris rhoncus aenean vel elit scelerisque mauris pellentesque. Fringilla est ullamcorper eget nulla facilisi etiam dignissim diam quis. Facilisis gravida neque convallis a cras semper auctor neque vitae. In dictum non consectetur a erat nam at lectus urna. Eu lobortis elementum nibh tellus. Interdum varius sit amet mattis vulputate. Quisque id diam vel quam elementum pulvinar etiam non quam. Tellus mauris a diam maecenas sed enim ut. Maecenas accumsan lacus vel facilisis volutpat est velit egestas dui.
<div class="clearfix"></div>
---
Code:
```go-html-template
{{</* paige/figure float="end" */>}}
Hickory dickory dock.<br>
The mouse ran up the clock.<br>
The clock struck one,<br>
The mouse ran down,<br>
Hickory dickory dock.
{{</* /paige/figure */>}}
Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Habitant morbi tristique senectus et netus et. Phasellus vestibulum lorem sed risus ultricies tristique nulla aliquet enim. Est lorem ipsum dolor sit amet. Consequat mauris nunc congue nisi. Sodales ut etiam sit amet nisl purus in mollis nunc. Vehicula ipsum a arcu cursus vitae congue. Ultrices eros in cursus turpis massa tincidunt dui. Aliquet bibendum enim facilisis gravida. Eu turpis egestas pretium aenean pharetra magna ac placerat. Sed turpis tincidunt id aliquet risus feugiat. Gravida neque convallis a cras. Cras ornare arcu dui vivamus arcu felis bibendum. Vulputate dignissim suspendisse in est. Iaculis at erat pellentesque adipiscing commodo elit at imperdiet. Amet luctus venenatis lectus magna fringilla urna porttitor rhoncus. Placerat orci nulla pellentesque dignissim enim sit amet venenatis urna. Nisl nisi scelerisque eu ultrices vitae auctor eu. Tortor pretium viverra suspendisse potenti nullam ac. Vitae congue mauris rhoncus aenean vel elit scelerisque mauris pellentesque. Fringilla est ullamcorper eget nulla facilisi etiam dignissim diam quis. Facilisis gravida neque convallis a cras semper auctor neque vitae. In dictum non consectetur a erat nam at lectus urna. Eu lobortis elementum nibh tellus. Interdum varius sit amet mattis vulputate. Quisque id diam vel quam elementum pulvinar etiam non quam. Tellus mauris a diam maecenas sed enim ut. Maecenas accumsan lacus vel facilisis volutpat est velit egestas dui.
```
Result:
{{< paige/figure float="end" >}}
Hickory dickory dock.<br>
The mouse ran up the clock.<br>
The clock struck one,<br>
The mouse ran down,<br>
Hickory dickory dock.
{{< /paige/figure >}}
Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Habitant morbi tristique senectus et netus et. Phasellus vestibulum lorem sed risus ultricies tristique nulla aliquet enim. Est lorem ipsum dolor sit amet. Consequat mauris nunc congue nisi. Sodales ut etiam sit amet nisl purus in mollis nunc. Vehicula ipsum a arcu cursus vitae congue. Ultrices eros in cursus turpis massa tincidunt dui. Aliquet bibendum enim facilisis gravida. Eu turpis egestas pretium aenean pharetra magna ac placerat. Sed turpis tincidunt id aliquet risus feugiat. Gravida neque convallis a cras. Cras ornare arcu dui vivamus arcu felis bibendum. Vulputate dignissim suspendisse in est. Iaculis at erat pellentesque adipiscing commodo elit at imperdiet. Amet luctus venenatis lectus magna fringilla urna porttitor rhoncus. Placerat orci nulla pellentesque dignissim enim sit amet venenatis urna. Nisl nisi scelerisque eu ultrices vitae auctor eu. Tortor pretium viverra suspendisse potenti nullam ac. Vitae congue mauris rhoncus aenean vel elit scelerisque mauris pellentesque. Fringilla est ullamcorper eget nulla facilisi etiam dignissim diam quis. Facilisis gravida neque convallis a cras semper auctor neque vitae. In dictum non consectetur a erat nam at lectus urna. Eu lobortis elementum nibh tellus. Interdum varius sit amet mattis vulputate. Quisque id diam vel quam elementum pulvinar etiam non quam. Tellus mauris a diam maecenas sed enim ut. Maecenas accumsan lacus vel facilisis volutpat est velit egestas dui.
<div class="clearfix"></div>
---
Code:
```go-html-template
{{</* paige/figure float="start" */>}}
Hickory dickory dock.<br>
The mouse ran up the clock.<br>
The clock struck one,<br>
The mouse ran down,<br>
Hickory dickory dock.
{{</* /paige/figure */>}}
{{</* paige/figure float="end" */>}}
Hickory dickory dock.<br>
The mouse ran up the clock.<br>
The clock struck one,<br>
The mouse ran down,<br>
Hickory dickory dock.
{{</* /paige/figure */>}}
Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Habitant morbi tristique senectus et netus et. Phasellus vestibulum lorem sed risus ultricies tristique nulla aliquet enim. Est lorem ipsum dolor sit amet. Consequat mauris nunc congue nisi. Sodales ut etiam sit amet nisl purus in mollis nunc. Vehicula ipsum a arcu cursus vitae congue. Ultrices eros in cursus turpis massa tincidunt dui. Aliquet bibendum enim facilisis gravida. Eu turpis egestas pretium aenean pharetra magna ac placerat. Sed turpis tincidunt id aliquet risus feugiat. Gravida neque convallis a cras. Cras ornare arcu dui vivamus arcu felis bibendum. Vulputate dignissim suspendisse in est. Iaculis at erat pellentesque adipiscing commodo elit at imperdiet. Amet luctus venenatis lectus magna fringilla urna porttitor rhoncus. Placerat orci nulla pellentesque dignissim enim sit amet venenatis urna. Nisl nisi scelerisque eu ultrices vitae auctor eu. Tortor pretium viverra suspendisse potenti nullam ac. Vitae congue mauris rhoncus aenean vel elit scelerisque mauris pellentesque. Fringilla est ullamcorper eget nulla facilisi etiam dignissim diam quis. Facilisis gravida neque convallis a cras semper auctor neque vitae. In dictum non consectetur a erat nam at lectus urna. Eu lobortis elementum nibh tellus. Interdum varius sit amet mattis vulputate. Quisque id diam vel quam elementum pulvinar etiam non quam. Tellus mauris a diam maecenas sed enim ut. Maecenas accumsan lacus vel facilisis volutpat est velit egestas dui.
```
Result:
{{< paige/figure float="start" >}}
Hickory dickory dock.<br>
The mouse ran up the clock.<br>
The clock struck one,<br>
The mouse ran down,<br>
Hickory dickory dock.
{{< /paige/figure >}}
{{< paige/figure float="end" >}}
Hickory dickory dock.<br>
The mouse ran up the clock.<br>
The clock struck one,<br>
The mouse ran down,<br>
Hickory dickory dock.
{{< /paige/figure >}}
Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Habitant morbi tristique senectus et netus et. Phasellus vestibulum lorem sed risus ultricies tristique nulla aliquet enim. Est lorem ipsum dolor sit amet. Consequat mauris nunc congue nisi. Sodales ut etiam sit amet nisl purus in mollis nunc. Vehicula ipsum a arcu cursus vitae congue. Ultrices eros in cursus turpis massa tincidunt dui. Aliquet bibendum enim facilisis gravida. Eu turpis egestas pretium aenean pharetra magna ac placerat. Sed turpis tincidunt id aliquet risus feugiat. Gravida neque convallis a cras. Cras ornare arcu dui vivamus arcu felis bibendum. Vulputate dignissim suspendisse in est. Iaculis at erat pellentesque adipiscing commodo elit at imperdiet. Amet luctus venenatis lectus magna fringilla urna porttitor rhoncus. Placerat orci nulla pellentesque dignissim enim sit amet venenatis urna. Nisl nisi scelerisque eu ultrices vitae auctor eu. Tortor pretium viverra suspendisse potenti nullam ac. Vitae congue mauris rhoncus aenean vel elit scelerisque mauris pellentesque. Fringilla est ullamcorper eget nulla facilisi etiam dignissim diam quis. Facilisis gravida neque convallis a cras semper auctor neque vitae. In dictum non consectetur a erat nam at lectus urna. Eu lobortis elementum nibh tellus. Interdum varius sit amet mattis vulputate. Quisque id diam vel quam elementum pulvinar etiam non quam. Tellus mauris a diam maecenas sed enim ut. Maecenas accumsan lacus vel facilisis volutpat est velit egestas dui.
<div class="clearfix"></div>
---
Code:
```go-html-template
{{</* paige/figure float="start" */>}}
{{</* paige/image src="https://images.unsplash.com/photo-1490604001847-b712b0c2f967?w=1296" width="20rem" */>}}
{{</* /paige/figure */>}}
Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Habitant morbi tristique senectus et netus et. Phasellus vestibulum lorem sed risus ultricies tristique nulla aliquet enim. Est lorem ipsum dolor sit amet. Consequat mauris nunc congue nisi. Sodales ut etiam sit amet nisl purus in mollis nunc. Vehicula ipsum a arcu cursus vitae congue. Ultrices eros in cursus turpis massa tincidunt dui. Aliquet bibendum enim facilisis gravida. Eu turpis egestas pretium aenean pharetra magna ac placerat. Sed turpis tincidunt id aliquet risus feugiat. Gravida neque convallis a cras. Cras ornare arcu dui vivamus arcu felis bibendum. Vulputate dignissim suspendisse in est. Iaculis at erat pellentesque adipiscing commodo elit at imperdiet. Amet luctus venenatis lectus magna fringilla urna porttitor rhoncus. Placerat orci nulla pellentesque dignissim enim sit amet venenatis urna. Nisl nisi scelerisque eu ultrices vitae auctor eu. Tortor pretium viverra suspendisse potenti nullam ac. Vitae congue mauris rhoncus aenean vel elit scelerisque mauris pellentesque. Fringilla est ullamcorper eget nulla facilisi etiam dignissim diam quis. Facilisis gravida neque convallis a cras semper auctor neque vitae. In dictum non consectetur a erat nam at lectus urna. Eu lobortis elementum nibh tellus. Interdum varius sit amet mattis vulputate. Quisque id diam vel quam elementum pulvinar etiam non quam. Tellus mauris a diam maecenas sed enim ut. Maecenas accumsan lacus vel facilisis volutpat est velit egestas dui.
```
Result:
{{< paige/figure float="start" >}}
{{< paige/image src="https://images.unsplash.com/photo-1490604001847-b712b0c2f967?w=1296" width="20rem" >}}
{{< /paige/figure >}}
Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Habitant morbi tristique senectus et netus et. Phasellus vestibulum lorem sed risus ultricies tristique nulla aliquet enim. Est lorem ipsum dolor sit amet. Consequat mauris nunc congue nisi. Sodales ut etiam sit amet nisl purus in mollis nunc. Vehicula ipsum a arcu cursus vitae congue. Ultrices eros in cursus turpis massa tincidunt dui. Aliquet bibendum enim facilisis gravida. Eu turpis egestas pretium aenean pharetra magna ac placerat. Sed turpis tincidunt id aliquet risus feugiat. Gravida neque convallis a cras. Cras ornare arcu dui vivamus arcu felis bibendum. Vulputate dignissim suspendisse in est. Iaculis at erat pellentesque adipiscing commodo elit at imperdiet. Amet luctus venenatis lectus magna fringilla urna porttitor rhoncus. Placerat orci nulla pellentesque dignissim enim sit amet venenatis urna. Nisl nisi scelerisque eu ultrices vitae auctor eu. Tortor pretium viverra suspendisse potenti nullam ac. Vitae congue mauris rhoncus aenean vel elit scelerisque mauris pellentesque. Fringilla est ullamcorper eget nulla facilisi etiam dignissim diam quis. Facilisis gravida neque convallis a cras semper auctor neque vitae. In dictum non consectetur a erat nam at lectus urna. Eu lobortis elementum nibh tellus. Interdum varius sit amet mattis vulputate. Quisque id diam vel quam elementum pulvinar etiam non quam. Tellus mauris a diam maecenas sed enim ut. Maecenas accumsan lacus vel facilisis volutpat est velit egestas dui.
<div class="clearfix"></div>
---
Code:
```go-html-template
{{</* paige/figure float="end" */>}}
{{</* paige/image src="https://images.unsplash.com/photo-1490604001847-b712b0c2f967?w=1296" width="20rem" */>}}
{{</* /paige/figure */>}}
Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Habitant morbi tristique senectus et netus et. Phasellus vestibulum lorem sed risus ultricies tristique nulla aliquet enim. Est lorem ipsum dolor sit amet. Consequat mauris nunc congue nisi. Sodales ut etiam sit amet nisl purus in mollis nunc. Vehicula ipsum a arcu cursus vitae congue. Ultrices eros in cursus turpis massa tincidunt dui. Aliquet bibendum enim facilisis gravida. Eu turpis egestas pretium aenean pharetra magna ac placerat. Sed turpis tincidunt id aliquet risus feugiat. Gravida neque convallis a cras. Cras ornare arcu dui vivamus arcu felis bibendum. Vulputate dignissim suspendisse in est. Iaculis at erat pellentesque adipiscing commodo elit at imperdiet. Amet luctus venenatis lectus magna fringilla urna porttitor rhoncus. Placerat orci nulla pellentesque dignissim enim sit amet venenatis urna. Nisl nisi scelerisque eu ultrices vitae auctor eu. Tortor pretium viverra suspendisse potenti nullam ac. Vitae congue mauris rhoncus aenean vel elit scelerisque mauris pellentesque. Fringilla est ullamcorper eget nulla facilisi etiam dignissim diam quis. Facilisis gravida neque convallis a cras semper auctor neque vitae. In dictum non consectetur a erat nam at lectus urna. Eu lobortis elementum nibh tellus. Interdum varius sit amet mattis vulputate. Quisque id diam vel quam elementum pulvinar etiam non quam. Tellus mauris a diam maecenas sed enim ut. Maecenas accumsan lacus vel facilisis volutpat est velit egestas dui.
```
Result:
{{< paige/figure float="end" >}}
{{</* paige/image src="https://images.unsplash.com/photo-1490604001847-b712b0c2f967?w=1296" width="20rem" */>}}
{{< /paige/figure >}}
Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Habitant morbi tristique senectus et netus et. Phasellus vestibulum lorem sed risus ultricies tristique nulla aliquet enim. Est lorem ipsum dolor sit amet. Consequat mauris nunc congue nisi. Sodales ut etiam sit amet nisl purus in mollis nunc. Vehicula ipsum a arcu cursus vitae congue. Ultrices eros in cursus turpis massa tincidunt dui. Aliquet bibendum enim facilisis gravida. Eu turpis egestas pretium aenean pharetra magna ac placerat. Sed turpis tincidunt id aliquet risus feugiat. Gravida neque convallis a cras. Cras ornare arcu dui vivamus arcu felis bibendum. Vulputate dignissim suspendisse in est. Iaculis at erat pellentesque adipiscing commodo elit at imperdiet. Amet luctus venenatis lectus magna fringilla urna porttitor rhoncus. Placerat orci nulla pellentesque dignissim enim sit amet venenatis urna. Nisl nisi scelerisque eu ultrices vitae auctor eu. Tortor pretium viverra suspendisse potenti nullam ac. Vitae congue mauris rhoncus aenean vel elit scelerisque mauris pellentesque. Fringilla est ullamcorper eget nulla facilisi etiam dignissim diam quis. Facilisis gravida neque convallis a cras semper auctor neque vitae. In dictum non consectetur a erat nam at lectus urna. Eu lobortis elementum nibh tellus. Interdum varius sit amet mattis vulputate. Quisque id diam vel quam elementum pulvinar etiam non quam. Tellus mauris a diam maecenas sed enim ut. Maecenas accumsan lacus vel facilisis volutpat est velit egestas dui.
<div class="clearfix"></div>
---
Code:
```go-html-template
{{</* paige/figure float="start" */>}}
{{</* paige/image src="https://images.unsplash.com/photo-1490604001847-b712b0c2f967?w=1296" width="20rem" */>}}
{{</* /paige/figure */>}}
{{</* paige/figure float="end" */>}}
{{</* paige/image src="https://images.unsplash.com/photo-1490604001847-b712b0c2f967?w=1296" width="20rem" */>}}
{{</* /paige/figure */>}}
Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Habitant morbi tristique senectus et netus et. Phasellus vestibulum lorem sed risus ultricies tristique nulla aliquet enim. Est lorem ipsum dolor sit amet. Consequat mauris nunc congue nisi. Sodales ut etiam sit amet nisl purus in mollis nunc. Vehicula ipsum a arcu cursus vitae congue. Ultrices eros in cursus turpis massa tincidunt dui. Aliquet bibendum enim facilisis gravida. Eu turpis egestas pretium aenean pharetra magna ac placerat. Sed turpis tincidunt id aliquet risus feugiat. Gravida neque convallis a cras. Cras ornare arcu dui vivamus arcu felis bibendum. Vulputate dignissim suspendisse in est. Iaculis at erat pellentesque adipiscing commodo elit at imperdiet. Amet luctus venenatis lectus magna fringilla urna porttitor rhoncus. Placerat orci nulla pellentesque dignissim enim sit amet venenatis urna. Nisl nisi scelerisque eu ultrices vitae auctor eu. Tortor pretium viverra suspendisse potenti nullam ac. Vitae congue mauris rhoncus aenean vel elit scelerisque mauris pellentesque. Fringilla est ullamcorper eget nulla facilisi etiam dignissim diam quis. Facilisis gravida neque convallis a cras semper auctor neque vitae. In dictum non consectetur a erat nam at lectus urna. Eu lobortis elementum nibh tellus. Interdum varius sit amet mattis vulputate. Quisque id diam vel quam elementum pulvinar etiam non quam. Tellus mauris a diam maecenas sed enim ut. Maecenas accumsan lacus vel facilisis volutpat est velit egestas dui.
```
Result:
{{< paige/figure float="start" >}}
{{</* paige/image src="https://images.unsplash.com/photo-1490604001847-b712b0c2f967?w=1296" width="20rem" */>}}
{{< /paige/figure >}}
{{< paige/figure float="end" >}}
{{</* paige/image src="https://images.unsplash.com/photo-1490604001847-b712b0c2f967?w=1296" width="20rem" */>}}
{{< /paige/figure >}}
Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Habitant morbi tristique senectus et netus et. Phasellus vestibulum lorem sed risus ultricies tristique nulla aliquet enim. Est lorem ipsum dolor sit amet. Consequat mauris nunc congue nisi. Sodales ut etiam sit amet nisl purus in mollis nunc. Vehicula ipsum a arcu cursus vitae congue. Ultrices eros in cursus turpis massa tincidunt dui. Aliquet bibendum enim facilisis gravida. Eu turpis egestas pretium aenean pharetra magna ac placerat. Sed turpis tincidunt id aliquet risus feugiat. Gravida neque convallis a cras. Cras ornare arcu dui vivamus arcu felis bibendum. Vulputate dignissim suspendisse in est. Iaculis at erat pellentesque adipiscing commodo elit at imperdiet. Amet luctus venenatis lectus magna fringilla urna porttitor rhoncus. Placerat orci nulla pellentesque dignissim enim sit amet venenatis urna. Nisl nisi scelerisque eu ultrices vitae auctor eu. Tortor pretium viverra suspendisse potenti nullam ac. Vitae congue mauris rhoncus aenean vel elit scelerisque mauris pellentesque. Fringilla est ullamcorper eget nulla facilisi etiam dignissim diam quis. Facilisis gravida neque convallis a cras semper auctor neque vitae. In dictum non consectetur a erat nam at lectus urna. Eu lobortis elementum nibh tellus. Interdum varius sit amet mattis vulputate. Quisque id diam vel quam elementum pulvinar etiam non quam. Tellus mauris a diam maecenas sed enim ut. Maecenas accumsan lacus vel facilisis volutpat est velit egestas dui.
<div class="clearfix"></div>
## Horizontal parameter
Code:
```go-html-template
{{</* paige/figure caption="Hickory Dickory Dock" horizontal="start" */>}}
Hickory dickory dock.<br>
The mouse ran up the clock.<br>
The clock struck one,<br>
The mouse ran down,<br>
Hickory dickory dock.
{{</* /paige/figure */>}}
{{</* paige/figure caption="Hickory Dickory Dock" horizontal="center" */>}}
Hickory dickory dock.<br>
The mouse ran up the clock.<br>
The clock struck one,<br>
The mouse ran down,<br>
Hickory dickory dock.
{{</* /paige/figure */>}}
{{</* paige/figure caption="Hickory Dickory Dock" horizontal="end" */>}}
Hickory dickory dock.<br>
The mouse ran up the clock.<br>
The clock struck one,<br>
The mouse ran down,<br>
Hickory dickory dock.
{{</* /paige/figure */>}}
```
Result:
{{< paige/figure caption="Hickory Dickory Dock" horizontal="start" >}}
Hickory dickory dock.<br>
The mouse ran up the clock.<br>
The clock struck one,<br>
The mouse ran down,<br>
Hickory dickory dock.
{{< /paige/figure >}}
{{< paige/figure caption="Hickory Dickory Dock" horizontal="center" >}}
Hickory dickory dock.<br>
The mouse ran up the clock.<br>
The clock struck one,<br>
The mouse ran down,<br>
Hickory dickory dock.
{{< /paige/figure >}}
{{< paige/figure caption="Hickory Dickory Dock" horizontal="end" >}}
Hickory dickory dock.<br>
The mouse ran up the clock.<br>
The clock struck one,<br>
The mouse ran down,<br>
Hickory dickory dock.
{{< /paige/figure >}}
## Maxwidth parameter
Code:
```go-html-template
{{</* paige/figure caption="Hickory Dickory Dock" maxwidth="5rem" */>}}
Hickory dickory dock.<br>
The mouse ran up the clock.<br>
The clock struck one,<br>
The mouse ran down,<br>
Hickory dickory dock.
{{</* /paige/figure */>}}
```
Result:
{{< paige/figure caption="Hickory Dickory Dock" maxwidth="5rem" >}}
Hickory dickory dock.<br>
The mouse ran up the clock.<br>
The clock struck one,<br>
The mouse ran down,<br>
Hickory dickory dock.
{{< /paige/figure >}}
---
Code:
```go-html-template
{{</* paige/figure caption="Hickory Dickory Dock" maxwidth="20rem" */>}}
Hickory dickory dock.<br>
The mouse ran up the clock.<br>
The clock struck one,<br>
The mouse ran down,<br>
Hickory dickory dock.
{{</* /paige/figure */>}}
```
Result:
{{< paige/figure caption="Hickory Dickory Dock" maxwidth="20rem" >}}
Hickory dickory dock.<br>
The mouse ran up the clock.<br>
The clock struck one,<br>
The mouse ran down,<br>
Hickory dickory dock.
{{< /paige/figure >}}
## Number parameter
Code:
```go-html-template
{{</* paige/figure caption="Hickory Dickory Dock" number=7 */>}}
Hickory dickory dock.<br>
The mouse ran up the clock.<br>
The clock struck one,<br>
The mouse ran down,<br>
Hickory dickory dock.
{{</* /paige/figure */>}}
```
Result:
{{< paige/figure caption="Hickory Dickory Dock" number=7 >}}
Hickory dickory dock.<br>
The mouse ran up the clock.<br>
The clock struck one,<br>
The mouse ran down,<br>
Hickory dickory dock.
{{< /paige/figure >}}
---
Code:
```go-html-template
{{</* paige/figure caption="Hickory Dickory Dock" number="G" */>}}
Hickory dickory dock.<br>
The mouse ran up the clock.<br>
The clock struck one,<br>
The mouse ran down,<br>
Hickory dickory dock.
{{</* /paige/figure */>}}
```
Result:
{{< paige/figure caption="Hickory Dickory Dock" number="G" >}}
Hickory dickory dock.<br>
The mouse ran up the clock.<br>
The clock struck one,<br>
The mouse ran down,<br>
Hickory dickory dock.
{{< /paige/figure >}}
## Numbered parameter
Code:
```go-html-template
{{</* paige/figure caption="Hickory Dickory Dock" numbered=true */>}}
Hickory dickory dock.<br>
The mouse ran up the clock.<br>
The clock struck one,<br>
The mouse ran down,<br>
Hickory dickory dock.
{{</* /paige/figure */>}}
{{</* paige/figure caption="Hickory Dickory Dock" number=3 */>}}
Hickory dickory dock.<br>
The mouse ran up the clock.<br>
The clock struck one,<br>
The mouse ran down,<br>
Hickory dickory dock.
{{</* /paige/figure */>}}
{{</* paige/figure caption="Hickory Dickory Dock" numbered=true */>}}
Hickory dickory dock.<br>
The mouse ran up the clock.<br>
The clock struck one,<br>
The mouse ran down,<br>
Hickory dickory dock.
{{</* /paige/figure */>}}
```
Result:
{{< paige/figure caption="Hickory Dickory Dock" numbered=true >}}
Hickory dickory dock.<br>
The mouse ran up the clock.<br>
The clock struck one,<br>
The mouse ran down,<br>
Hickory dickory dock.
{{< /paige/figure >}}
{{< paige/figure caption="Hickory Dickory Dock" number=3 >}}
Hickory dickory dock.<br>
The mouse ran up the clock.<br>
The clock struck one,<br>
The mouse ran down,<br>
Hickory dickory dock.
{{< /paige/figure >}}
{{< paige/figure caption="Hickory Dickory Dock" numbered=true >}}
Hickory dickory dock.<br>
The mouse ran up the clock.<br>
The clock struck one,<br>
The mouse ran down,<br>
Hickory dickory dock.
{{< /paige/figure >}}
## Vertical parameter
Code:
```go-html-template
<div class="column-gap-3 d-flex justify-content-between" style="height: 20rem">
{{</* paige/figure caption="Hickory Dickory Dock" vertical="start" */>}}
Hickory dickory dock.<br>
The mouse ran up the clock.<br>
The clock struck one,<br>
The mouse ran down,<br>
Hickory dickory dock.
{{</* /paige/figure */>}}
{{</* paige/figure caption="Hickory Dickory Dock" vertical="center" */>}}
Hickory dickory dock.<br>
The mouse ran up the clock.<br>
The clock struck one,<br>
The mouse ran down,<br>
Hickory dickory dock.
{{</* /paige/figure */>}}
{{</* paige/figure caption="Hickory Dickory Dock" vertical="end" */>}}
Hickory dickory dock.<br>
The mouse ran up the clock.<br>
The clock struck one,<br>
The mouse ran down,<br>
Hickory dickory dock.
{{</* /paige/figure */>}}
</div>
```
Result:
<div class="column-gap-3 d-flex justify-content-between" style="height: 20rem">
{{< paige/figure caption="Hickory Dickory Dock" vertical="start" >}}
Hickory dickory dock.<br>
The mouse ran up the clock.<br>
The clock struck one,<br>
The mouse ran down,<br>
Hickory dickory dock.
{{< /paige/figure >}}
{{< paige/figure caption="Hickory Dickory Dock" vertical="center" >}}
Hickory dickory dock.<br>
The mouse ran up the clock.<br>
The clock struck one,<br>
The mouse ran down,<br>
Hickory dickory dock.
{{< /paige/figure >}}
{{< paige/figure caption="Hickory Dickory Dock" vertical="end" >}}
Hickory dickory dock.<br>
The mouse ran up the clock.<br>
The clock struck one,<br>
The mouse ran down,<br>
Hickory dickory dock.
{{< /paige/figure >}}
</div>
## Width parameter
Code:
```go-html-template
{{</* paige/figure caption="Hickory Dickory Dock" width="5rem" */>}}
Hickory dickory dock.<br>
The mouse ran up the clock.<br>
The clock struck one,<br>
The mouse ran down,<br>
Hickory dickory dock.
{{</* /paige/figure */>}}
```
Result:
{{< paige/figure caption="Hickory Dickory Dock" width="5rem" >}}
Hickory dickory dock.<br>
The mouse ran up the clock.<br>
The clock struck one,<br>
The mouse ran down,<br>
Hickory dickory dock.
{{< /paige/figure >}}
---
Code:
```go-html-template
{{</* paige/figure caption="Hickory Dickory Dock" width="20rem" */>}}
Hickory dickory dock.<br>
The mouse ran up the clock.<br>
The clock struck one,<br>
The mouse ran down,<br>
Hickory dickory dock.
{{</* /paige/figure */>}}
```
Result:
{{< paige/figure caption="Hickory Dickory Dock" width="20rem" >}}
Hickory dickory dock.<br>
The mouse ran up the clock.<br>
The clock struck one,<br>
The mouse ran down,<br>
Hickory dickory dock.
{{< /paige/figure >}}

Binary file not shown.

After

Width:  |  Height:  |  Size: 31 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 28 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 35 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 14 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 32 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 65 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 87 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 66 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 49 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 41 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 31 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 64 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 45 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 10 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 22 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 57 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 15 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 17 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 48 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 18 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 17 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 8.7 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 32 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 28 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 22 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 20 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 21 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 33 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 35 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 89 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 43 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 42 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 22 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 20 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 42 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 52 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 56 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 13 KiB

View File

@@ -0,0 +1,443 @@
+++
authors = ["author-demo"]
categories = ["paige", "shortcodes"]
description = "Demonstration of the gallery shortcode."
tags = ["figures", "gallery", "images"]
title = "Gallery"
+++
The `paige/gallery` shortcode displays a list of content.
<!--more-->
## Align parameter
Code:
```go-html-template
{{</* paige/gallery align="start" */>}}
{{</* paige/image height="20rem" src="01-2.jpg" */>}}
{{</* paige/image height="10rem" src="02-2.jpg" */>}}
{{</* /paige/gallery */>}}
```
Result:
{{< paige/gallery align="start" >}}
{{< paige/image height="20rem" src="01-2.jpg" >}}
{{< paige/image height="10rem" src="02-2.jpg" >}}
{{< /paige/gallery >}}
---
Code:
```go-html-template
{{</* paige/gallery align="center" */>}}
{{</* paige/image height="20rem" src="01-2.jpg" */>}}
{{</* paige/image height="10rem" src="02-2.jpg" */>}}
{{</* /paige/gallery */>}}
```
Result:
{{< paige/gallery align="center" >}}
{{< paige/image height="20rem" src="01-2.jpg" >}}
{{< paige/image height="10rem" src="02-2.jpg" >}}
{{< /paige/gallery >}}
---
Code:
```go-html-template
{{</* paige/gallery align="end" */>}}
{{</* paige/image height="20rem" src="01-2.jpg" */>}}
{{</* paige/image height="10rem" src="02-2.jpg" */>}}
{{</* /paige/gallery */>}}
```
Result:
{{< paige/gallery align="end" >}}
{{< paige/image height="20rem" src="01-2.jpg" >}}
{{< paige/image height="10rem" src="02-2.jpg" >}}
{{< /paige/gallery >}}
## Breakpoints parameter
Code:
```go-html-template
{{</* paige/gallery breakpoints=true images="large/*.jpg" /*/>}}
```
Result:
{{< paige/gallery breakpoints=true images="large/*.jpg" />}}
## Class parameter
Code:
```go-html-template
{{</* paige/gallery class="rounded-5" images="*-2.jpg" /*/>}}
```
Result:
{{< paige/gallery class="rounded-5" images="*-2.jpg" />}}
## Densities parameter
Code:
```go-html-template
{{</* paige/gallery densities="1x 2x 3x" images="*-2.jpg" /*/>}}
```
Result:
{{< paige/gallery densities="1x 2x 3x" images="*-2.jpg" />}}
## Fetchpriority parameter
Code:
```go-html-template
{{</* paige/gallery fetchpriority="high" images="*-2.jpg" /*/>}}
```
Result:
{{< paige/gallery fetchpriority="high" images="*-2.jpg" />}}
---
Code:
```go-html-template
{{</* paige/gallery fetchpriority="low" images="*-2.jpg" /*/>}}
```
Result:
{{< paige/gallery fetchpriority="low" images="*-2.jpg" />}}
## Height parameter
Code:
```go-html-template
{{</* paige/gallery height="10rem" images="*-2.jpg" /*/>}}
```
Result:
{{< paige/gallery height="10rem" images="*-2.jpg" />}}
---
Code:
```go-html-template
{{</* paige/gallery height="20rem" images="*-2.jpg" /*/>}}
```
Result:
{{< paige/gallery height="20rem" images="*-2.jpg" />}}
## Images parameter
Code:
```go-html-template
{{</* paige/gallery images="1-2.jpg" /*/>}}
```
Result:
{{< paige/gallery images="1-2.jpg" />}}
---
Code:
```go-html-template
{{</* paige/gallery images="*-2.jpg" /*/>}}
```
Result:
{{< paige/gallery images="*-2.jpg" />}}
## Justify parameter
Code:
```go-html-template
{{</* paige/gallery images="*-2.jpg" justify="start" /*/>}}
```
Result:
{{< paige/gallery images="*-2.jpg" justify="start" />}}
---
Code:
```go-html-template
{{</* paige/gallery images="*-2.jpg" justify="center" /*/>}}
```
Result:
{{< paige/gallery images="*-2.jpg" justify="center" />}}
---
Code:
```go-html-template
{{</* paige/gallery images="*-2.jpg" justify="end" /*/>}}
```
Result:
{{< paige/gallery images="*-2.jpg" justify="end" />}}
## Linked parameter
Code:
```go-html-template
{{</* paige/gallery images="*-2.jpg" linked="unprocessed" /*/>}}
```
Result:
{{< paige/gallery images="*-2.jpg" linked="unprocessed" />}}
---
Code:
```go-html-template
{{</* paige/gallery images="*-2.jpg" linked="default" /*/>}}
```
Result:
{{< paige/gallery images="*-2.jpg" linked="default" />}}
---
Code:
```go-html-template
{{</* paige/gallery images="*-2.jpg" linked="r180" /*/>}}
```
Result:
{{< paige/gallery images="*-2.jpg" linked="r180" />}}
## Loading parameter
Code:
```go-html-template
{{</* paige/gallery images="*-2.jpg" loading="eager" /*/>}}
```
Result:
{{< paige/gallery images="*-2.jpg" loading="eager" />}}
---
Code:
```go-html-template
{{</* paige/gallery images="*-2.jpg" loading="lazy" /*/>}}
```
Result:
{{< paige/gallery images="*-2.jpg" loading="lazy" />}}
## Maxheight parameter
Code:
```go-html-template
{{</* paige/gallery images="*-2.jpg" maxheight="10rem" /*/>}}
```
Result:
{{< paige/gallery images="*-2.jpg" maxheight="10rem" />}}
---
Code:
```go-html-template
{{</* paige/gallery images="*-2.jpg" maxheight="20rem" /*/>}}
```
Result:
{{< paige/gallery images="*-2.jpg" maxheight="20rem" />}}
## Maxwidth parameter
Code:
```go-html-template
{{</* paige/gallery images="*-2.jpg" maxwidth="10rem" /*/>}}
```
Result:
{{< paige/gallery images="*-2.jpg" maxwidth="10rem" />}}
---
Code:
```go-html-template
{{</* paige/gallery images="*-2.jpg" maxwidth="20rem" /*/>}}
```
Result:
{{< paige/gallery images="*-2.jpg" maxwidth="20rem" />}}
## Process parameter
Code:
```go-html-template
{{</* paige/gallery images="*-2.jpg" process="default" /*/>}}
```
Result:
{{< paige/gallery images="*-2.jpg" process="default" />}}
---
Code:
```go-html-template
{{</* paige/gallery images="*-2.jpg" process="300x300 center crop lanczos picture r180 webp" /*/>}}
```
Result:
{{< paige/gallery images="*-2.jpg" process="300x300 center crop lanczos picture r180 webp" />}}
## Style parameter
Code:
```go-html-template
{{</* paige/gallery images="*-2.jpg" style="filter: grayscale(100%)" /*/>}}
```
Result:
{{< paige/gallery images="*-2.jpg" style="filter: grayscale(100%)" />}}
## Type
Code:
```go-html-template
{{</* paige/gallery images="*.jpg" type="grid" /*/>}}
```
Result:
{{< paige/gallery images="*.jpg" type="grid" />}}
---
Code:
```go-html-template
{{</* paige/gallery images="*.jpg" maxheight="10rem" type="rows" /*/>}}
```
Result:
{{< paige/gallery images="*.jpg" maxheight="10rem" type="rows" />}}
## Width parameter
Code:
```go-html-template
{{</* paige/gallery images="*-2.jpg" width="10rem" /*/>}}
```
Result:
{{< paige/gallery images="*-2.jpg" width="10rem" />}}
---
Code:
```go-html-template
{{</* paige/gallery images="*-2.jpg" width="20rem" /*/>}}
```
Result:
{{< paige/gallery images="*-2.jpg" width="20rem" />}}
## Figure
Code:
```go-html-template
{{</* paige/figure caption="Gallery" */>}}
{{</* paige/gallery */>}}
{{</* paige/figure caption="Image 1" */>}}
{{</* paige/image src="01-2.jpg" */>}}
{{</* /paige/figure */>}}
{{</* paige/figure caption="Image 2" */>}}
{{</* paige/image src="02-2.jpg" */>}}
{{</* /paige/figure */>}}
{{</* paige/figure caption="Image 3" */>}}
{{</* paige/image src="03.jpg" */>}}
{{</* /paige/figure */>}}
{{</* paige/figure caption="Image 4" */>}}
{{</* paige/image src="04.jpg" */>}}
{{</* /paige/figure */>}}
{{</* /paige/gallery */>}}
{{</* /paige/figure */>}}
```
Result:
{{< paige/figure caption="Gallery" >}}
{{< paige/gallery >}}
{{< paige/figure caption="Image 1" >}}
{{< paige/image src="01-2.jpg" >}}
{{< /paige/figure >}}
{{< paige/figure caption="Image 2" >}}
{{< paige/image src="02-2.jpg" >}}
{{< /paige/figure >}}
{{< paige/figure caption="Image 3" >}}
{{< paige/image src="03.jpg" >}}
{{< /paige/figure >}}
{{< paige/figure caption="Image 4" >}}
{{< paige/image src="04.jpg" >}}
{{< /paige/figure >}}
{{< /paige/gallery >}}
{{< /paige/figure >}}

Binary file not shown.

After

Width:  |  Height:  |  Size: 27 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 45 KiB

View File

@@ -0,0 +1,47 @@
+++
authors = ["author-demo"]
categories = ["paige", "shortcodes"]
description = "Demonstration of the icon shortcode."
tags = ["icon", "web font"]
title = "Icon"
+++
The `paige/icon` shortcode displays a web font icon.
<!--more-->
## Class parameter
Code:
```go-html-template
<p class="display-1">Icon: {{</* paige/icon class="bi bi-github" */>}}</p>
```
Result:
<p class="display-1">Icon: {{< paige/icon class="bi bi-github" >}}</p>
## Title parameter
Code:
```go-html-template
<p class="display-1">Icon: {{</* paige/icon class="bi bi-github" title="GitHub" */>}}</p>
```
Result:
<p class="display-1">Icon: {{< paige/icon class="bi bi-github" title="GitHub" >}}</p>
## Url parameter
Code:
```go-html-template
<p class="display-1">Icon: {{</* paige/icon class="bi bi-github" url="https://github.com/willfaught/paige" */>}}</p>
```
Result:
<p class="display-1">Icon: {{< paige/icon class="bi bi-github" url="https://github.com/willfaught/paige" >}}</p>

View File

@@ -0,0 +1,288 @@
+++
authors = ["author-demo"]
categories = ["paige", "shortcodes"]
description = "Demonstration of the image shortcode."
tags = ["figures", "images"]
title = "Image"
+++
The `paige/image` shortcode displays an image.
<!--more-->
## Alt parameter
Code:
```go-html-template
{{</* paige/image alt="Landscape" src="https://images.unsplash.com/photo-1490604001847-b712b0c2f967?w=1296" */>}}
```
Result:
{{< paige/image alt="Landscape" src="https://images.unsplash.com/photo-1490604001847-b712b0c2f967?w=1296" >}}
## Breakpoints parameter
Code:
```go-html-template
{{</* paige/image breakpoints=true src="https://images.unsplash.com/photo-1490604001847-b712b0c2f967?w=1296" */>}}
```
Result:
{{< paige/image breakpoints=true src="https://images.unsplash.com/photo-1490604001847-b712b0c2f967?w=1296" >}}
## Class parameter
Code:
```go-html-template
{{</* paige/image class="rounded-5" src="https://images.unsplash.com/photo-1490604001847-b712b0c2f967?w=1296" */>}}
```
Result:
{{< paige/image class="rounded-5" src="https://images.unsplash.com/photo-1490604001847-b712b0c2f967?w=1296" >}}
## Densities parameter
Code:
```go-html-template
{{</* paige/image densities="1x 2x 3x" src="https://images.unsplash.com/photo-1490604001847-b712b0c2f967?w=1296" */>}}
```
Result:
{{< paige/image densities="1x 2x 3x" src="https://images.unsplash.com/photo-1490604001847-b712b0c2f967?w=1296" >}}
## Fetchpriority parameter
Code:
```go-html-template
{{</* paige/image fetchpriority="high" src="https://images.unsplash.com/photo-1490604001847-b712b0c2f967?w=1296" */>}}
```
Result:
{{< paige/image fetchpriority="high" src="https://images.unsplash.com/photo-1490604001847-b712b0c2f967?w=1296" >}}
## Height parameter
Code:
```go-html-template
{{</* paige/image height="10rem" src="https://images.unsplash.com/photo-1490604001847-b712b0c2f967?w=1296" */>}}
```
Result:
{{< paige/image height="10rem" src="https://images.unsplash.com/photo-1490604001847-b712b0c2f967?w=1296" >}}
## Link parameter
Code:
```go-html-template
{{</* paige/image link="https://github.com/willfaught/paige" src="https://images.unsplash.com/photo-1490604001847-b712b0c2f967?w=1296" */>}}
```
Result:
{{< paige/image link="https://github.com/willfaught/paige" src="https://images.unsplash.com/photo-1490604001847-b712b0c2f967?w=1296" >}}
## Linked parameter
Code:
```go-html-template
{{</* paige/image linked="unprocessed" src="https://images.unsplash.com/photo-1490604001847-b712b0c2f967?w=1296" */>}}
```
Result:
{{< paige/image linked="unprocessed" src="https://images.unsplash.com/photo-1490604001847-b712b0c2f967?w=1296" >}}
---
Code:
```go-html-template
{{</* paige/image linked="default" src="https://images.unsplash.com/photo-1490604001847-b712b0c2f967?w=1296" */>}}
```
Result:
{{< paige/image linked="default" src="https://images.unsplash.com/photo-1490604001847-b712b0c2f967?w=1296" >}}
---
Code:
```go-html-template
{{</* paige/image linked="r180" src="https://images.unsplash.com/photo-1490604001847-b712b0c2f967?w=1296" */>}}
```
Result:
{{< paige/image linked="r180" src="https://images.unsplash.com/photo-1490604001847-b712b0c2f967?w=1296" >}}
## Loading parameter
Code:
```go-html-template
{{</* paige/image loading="eager" src="https://images.unsplash.com/photo-1490604001847-b712b0c2f967?w=1296" */>}}
```
Result:
{{< paige/image loading="eager" src="https://images.unsplash.com/photo-1490604001847-b712b0c2f967?w=1296" >}}
## Maxheight parameter
Code:
```go-html-template
{{</* paige/image maxheight="10rem" src="https://images.unsplash.com/photo-1490604001847-b712b0c2f967?w=1296" */>}}
```
Result:
{{< paige/image maxheight="10rem" src="https://images.unsplash.com/photo-1490604001847-b712b0c2f967?w=1296" >}}
## Maxwidth parameter
Code:
```go-html-template
{{</* paige/image maxwidth="10rem" src="https://images.unsplash.com/photo-1490604001847-b712b0c2f967?w=1296" */>}}
```
Result:
{{< paige/image maxwidth="10rem" src="https://images.unsplash.com/photo-1490604001847-b712b0c2f967?w=1296" >}}
## Process parameter
Code:
```go-html-template
{{</* paige/image process="default" src="https://images.unsplash.com/photo-1490604001847-b712b0c2f967?w=1296" */>}}
```
Result:
{{< paige/image process="default" src="https://images.unsplash.com/photo-1490604001847-b712b0c2f967?w=1296" >}}
---
Code:
```go-html-template
{{</* paige/image process="550x lanczos picture resize webp" src="https://images.unsplash.com/photo-1490604001847-b712b0c2f967?w=1296" */>}}
```
Result:
{{< paige/image process="550x lanczos picture resize webp" src="https://images.unsplash.com/photo-1490604001847-b712b0c2f967?w=1296" >}}
## Sizes parameter
Code:
```go-html-template
{{</* paige/image
sizes="(max-width: 576px) 550px, (max-width: 992px) 936px, 1296px"
src="https://images.unsplash.com/photo-1490604001847-b712b0c2f967?w=1296" */>}}
```
Result:
{{< paige/image
sizes="(max-width: 576px) 550px, (max-width: 992px) 936px, 1296px"
src="https://images.unsplash.com/photo-1490604001847-b712b0c2f967?w=1296" >}}
## Src parameter
Code:
```go-html-template
{{</* paige/image src="https://images.unsplash.com/photo-1490604001847-b712b0c2f967?w=1296" */>}}
```
Result:
{{< paige/image src="https://images.unsplash.com/photo-1490604001847-b712b0c2f967?w=1296" >}}
## Srcset parameter
Code:
```go-html-template
{{</* paige/image
src="https://images.unsplash.com/photo-1490604001847-b712b0c2f967?w=1296"
srcset="https://images.unsplash.com/photo-1490604001847-b712b0c2f967?w=550 550w,
https://images.unsplash.com/photo-1490604001847-b712b0c2f967?w=936 936w" */>}}
```
Result:
{{< paige/image
src="https://images.unsplash.com/photo-1490604001847-b712b0c2f967?w=1296"
srcset="https://images.unsplash.com/photo-1490604001847-b712b0c2f967?w=550 550w, https://images.unsplash.com/photo-1490604001847-b712b0c2f967?w=936 936w" >}}
## Style parameter
Code:
```go-html-template
{{</* paige/image src="https://images.unsplash.com/photo-1490604001847-b712b0c2f967?w=1296" style="filter: grayscale(100%)" */>}}
```
Result:
{{< paige/image src="https://images.unsplash.com/photo-1490604001847-b712b0c2f967?w=1296" style="filter: grayscale(100%)" >}}
## Title parameter
Code:
```go-html-template
{{</* paige/image src="https://images.unsplash.com/photo-1490604001847-b712b0c2f967?w=1296" title="Landscape" */>}}
```
Result:
{{< paige/image src="https://images.unsplash.com/photo-1490604001847-b712b0c2f967?w=1296" title="Landscape" >}}
## Width parameter
Code:
```go-html-template
{{</* paige/image src="https://images.unsplash.com/photo-1490604001847-b712b0c2f967?w=1296" width="50%" */>}}
```
Result:
{{< paige/image src="https://images.unsplash.com/photo-1490604001847-b712b0c2f967?w=1296" width="50%" >}}
## Figure
Code:
```go-html-template
{{</* paige/figure caption="Landscape" */>}}
{{</* paige/image src="https://images.unsplash.com/photo-1490604001847-b712b0c2f967?w=1296" */>}}
{{</* /paige/figure */>}}
```
Result:
{{< paige/figure caption="Landscape" >}}
{{< paige/image src="https://images.unsplash.com/photo-1490604001847-b712b0c2f967?w=1296" >}}
{{< /paige/figure >}}

View File

@@ -0,0 +1,87 @@
+++
authors = ["author-demo"]
categories = ["paige", "shortcodes"]
description = "Demonstration of the quote shortcode."
tags = ["figures", "quotations"]
title = "Quote"
+++
The `paige/quote` shortcode displays a quotation.
<!--more-->
## Basic
Code:
```go-html-template
{{</* paige/quote */>}}
Hickory dickory dock.<br>
The mouse ran up the clock.<br>
The clock struck one,<br>
The mouse ran down,<br>
Hickory dickory dock.
{{</* /paige/quote */>}}
```
Result:
{{< paige/quote >}}
Hickory dickory dock.<br>
The mouse ran up the clock.<br>
The clock struck one,<br>
The mouse ran down,<br>
Hickory dickory dock.
{{< /paige/quote >}}
## Cite
Code:
```go-html-template
{{</* paige/quote cite="Hickory Dickory Dock" */>}}
Hickory dickory dock.<br>
The mouse ran up the clock.<br>
The clock struck one,<br>
The mouse ran down,<br>
Hickory dickory dock.
{{</* /paige/quote */>}}
```
Result:
{{< paige/quote cite="Hickory Dickory Dock" >}}
Hickory dickory dock.<br>
The mouse ran up the clock.<br>
The clock struck one,<br>
The mouse ran down,<br>
Hickory dickory dock.
{{< /paige/quote >}}
## Figure
Code:
```go-html-template
{{</* paige/figure caption="Hickory Dickory Dock" */>}}
{{</* paige/quote */>}}
Hickory dickory dock.<br>
The mouse ran up the clock.<br>
The clock struck one,<br>
The mouse ran down,<br>
Hickory dickory dock.
{{</* /paige/quote */>}}
{{</* /paige/figure */>}}
```
Result:
{{< paige/figure caption="Hickory Dickory Dock" >}}
{{< paige/quote >}}
Hickory dickory dock.<br>
The mouse ran up the clock.<br>
The clock struck one,<br>
The mouse ran down,<br>
Hickory dickory dock.
{{< /paige/quote >}}
{{< /paige/figure >}}

View File

@@ -0,0 +1,79 @@
+++
authors = ["author-demo"]
categories = ["paige", "shortcodes"]
description = "Demonstration of the request shortcode."
tags = ["request", "figures"]
title = "Request"
+++
The `paige/request` shortcode displays the content for a URL.
<!--more-->
## Basic
Code:
```go-html-template
<pre>
{{</* paige/request "https://raw.githubusercontent.com/willfaught/paige/master/LICENSE" */>}}
</pre>
```
Result:
<pre>
{{< paige/request "https://raw.githubusercontent.com/willfaught/paige/master/LICENSE" >}}
</pre>
## Method parameter
Code:
```go-html-template
<pre>
{{</* paige/request method="get" url="https://raw.githubusercontent.com/willfaught/paige/master/LICENSE" */>}}
</pre>
```
Result:
<pre>
{{< paige/request method="get" url="https://raw.githubusercontent.com/willfaught/paige/master/LICENSE" >}}
</pre>
## Url parameter
Code:
```go-html-template
<pre>
{{</* paige/request url="https://raw.githubusercontent.com/willfaught/paige/master/LICENSE" */>}}
</pre>
```
Result:
<pre>
{{< paige/request url="https://raw.githubusercontent.com/willfaught/paige/master/LICENSE" >}}
</pre>
## Figure
Code:
```go-html-template
{{</* paige/figure caption="License" */>}}
<pre>
{{</* paige/request "https://raw.githubusercontent.com/willfaught/paige/master/LICENSE" */>}}
</pre>
{{</* /paige/figure */>}}
```
Result:
{{< paige/figure caption="License" >}}
<pre>
{{< paige/request "https://raw.githubusercontent.com/willfaught/paige/master/LICENSE" >}}
</pre>
{{< /paige/figure >}}

View File

@@ -0,0 +1,131 @@
+++
authors = ["author-demo"]
categories = ["paige", "shortcodes"]
description = "Demonstration of the tabs shortcodes."
tags = ["figures", "tabs"]
title = "Tabs"
+++
The `paige/tabs` shortcode displays content in tabs.
<!--more-->
## Basic
Code:
```go-html-template
{{</* paige/tabs */>}}
{{</* paige/tabs/buttons */>}}
{{</* paige/tabs/button */>}}JSON{{</* /paige/tabs/button */>}}
{{</* paige/tabs/button */>}}TOML{{</* /paige/tabs/button */>}}
{{</* paige/tabs/button */>}}YAML{{</* /paige/tabs/button */>}}
{{</* /paige/tabs/buttons */>}}
{{</* paige/tabs/panes */>}}
{{</* paige/tabs/pane */>}}
{{</* paige/code lang="json" */>}}
{"foo": 123}
{{</* /paige/code */>}}
{{</* /paige/tabs/pane */>}}
{{</* paige/tabs/pane */>}}
{{</* paige/code lang="toml" */>}}
foo = 123
{{</* /paige/code */>}}
{{</* /paige/tabs/pane */>}}
{{</* paige/tabs/pane */>}}
{{</* paige/code lang="yaml" */>}}
foo: 123
{{</* /paige/code */>}}
{{</* /paige/tabs/pane */>}}
{{</* /paige/tabs/panes */>}}
{{</* /paige/tabs */>}}
```
Result:
{{< paige/tabs >}}
{{< paige/tabs/buttons >}}
{{< paige/tabs/button >}}JSON{{< /paige/tabs/button >}}
{{< paige/tabs/button >}}TOML{{< /paige/tabs/button >}}
{{< paige/tabs/button >}}YAML{{< /paige/tabs/button >}}
{{< /paige/tabs/buttons >}}
{{< paige/tabs/panes >}}
{{< paige/tabs/pane >}}
{{< paige/code lang="json" >}}
{"foo": 123}
{{< /paige/code >}}
{{< /paige/tabs/pane >}}
{{< paige/tabs/pane >}}
{{< paige/code lang="toml" >}}
foo = 123
{{< /paige/code >}}
{{< /paige/tabs/pane >}}
{{< paige/tabs/pane >}}
{{< paige/code lang="yaml" >}}
foo: 123
{{< /paige/code >}}
{{< /paige/tabs/pane >}}
{{< /paige/tabs/panes >}}
{{< /paige/tabs >}}
## Figure
Code:
```go-html-template
{{</* paige/figure caption="Tabs" */>}}
{{</* paige/tabs */>}}
{{</* paige/tabs/buttons */>}}
{{</* paige/tabs/button */>}}JSON{{</* /paige/tabs/button */>}}
{{</* paige/tabs/button */>}}TOML{{</* /paige/tabs/button */>}}
{{</* paige/tabs/button */>}}YAML{{</* /paige/tabs/button */>}}
{{</* /paige/tabs/buttons */>}}
{{</* paige/tabs/panes */>}}
{{</* paige/tabs/pane */>}}
{{</* paige/code lang="json" */>}}
{"foo": 123}
{{</* /paige/code */>}}
{{</* /paige/tabs/pane */>}}
{{</* paige/tabs/pane */>}}
{{</* paige/code lang="toml" */>}}
foo = 123
{{</* /paige/code */>}}
{{</* /paige/tabs/pane */>}}
{{</* paige/tabs/pane */>}}
{{</* paige/code lang="yaml" */>}}
foo: 123
{{</* /paige/code */>}}
{{</* /paige/tabs/pane */>}}
{{</* /paige/tabs/panes */>}}
{{</* /paige/tabs */>}}
{{</* /paige/figure */>}}
```
Result:
{{< paige/figure caption="Tabs" >}}
{{< paige/tabs >}}
{{< paige/tabs/buttons >}}
{{< paige/tabs/button >}}JSON{{< /paige/tabs/button >}}
{{< paige/tabs/button >}}TOML{{< /paige/tabs/button >}}
{{< paige/tabs/button >}}YAML{{< /paige/tabs/button >}}
{{< /paige/tabs/buttons >}}
{{< paige/tabs/panes >}}
{{< paige/tabs/pane >}}
{{< paige/code lang="json" >}}
{"foo": 123}
{{< /paige/code >}}
{{< /paige/tabs/pane >}}
{{< paige/tabs/pane >}}
{{< paige/code lang="toml" >}}
foo = 123
{{< /paige/code >}}
{{< /paige/tabs/pane >}}
{{< paige/tabs/pane >}}
{{< paige/code lang="yaml" >}}
foo: 123
{{< /paige/code >}}
{{< /paige/tabs/pane >}}
{{< /paige/tabs/panes >}}
{{< /paige/tabs >}}
{{< /paige/figure >}}

View File

@@ -0,0 +1,351 @@
+++
authors = ["author-demo"]
categories = ["paige", "shortcodes"]
description = "Demonstration of the Vimeo shortcode."
tags = ["videos", "vimeo"]
title = "Vimeo"
+++
The `paige/vimeo` shortcode plays a Vimeo video.
<!--more-->
## Basic
Code:
```go-html-template
{{</* paige/vimeo "644036051" */>}}
```
Result:
{{< paige/vimeo "644036051" >}}
## Autopause parameter
Code:
```go-html-template
{{</* paige/vimeo autopause=false video="644036051" */>}}
```
Result:
{{< paige/vimeo autopause=false video="644036051" >}}
## Autoplay parameter
Code:
```go-html-template
{{</* paige/vimeo autoplay=true video="644036051" */>}}
```
Result:
{{< paige/vimeo autoplay=true video="644036051" >}}
## Background parameter
Code:
```go-html-template
{{</* paige/vimeo background=true video="644036051" */>}}
```
Result:
{{< paige/vimeo background=true video="644036051" >}}
## Byline parameter
Code:
```go-html-template
{{</* paige/vimeo byline=false video="644036051" */>}}
```
Result:
{{< paige/vimeo byline=false video="644036051" >}}
## Color parameter
Code:
```go-html-template
{{</* paige/vimeo color="ff0000" video="644036051" */>}}
```
Result:
{{< paige/vimeo color="ff0000" video="644036051" >}}
## Controls parameter
Code:
```go-html-template
{{</* paige/vimeo controls=false video="644036051" */>}}
```
Result:
{{< paige/vimeo controls=false video="644036051" >}}
## Description parameter
Code:
```go-html-template
{{</* paige/vimeo description="My description" video="644036051" */>}}
```
Result:
{{< paige/vimeo description="My description" video="644036051" >}}
## DNT parameter
Code:
```go-html-template
{{</* paige/vimeo dnt=true video="644036051" */>}}
```
Result:
{{< paige/vimeo dnt=true video="644036051" >}}
## Fullscreen parameter
Code:
```go-html-template
{{</* paige/vimeo fullscreen=false video="644036051" */>}}
```
Result:
{{< paige/vimeo fullscreen=false video="644036051" >}}
## Height parameter
Code:
```go-html-template
{{</* paige/vimeo height="10rem" video="644036051" */>}}
```
Result:
{{< paige/vimeo height="10rem" video="644036051" >}}
## Keyboard parameter
Code:
```go-html-template
{{</* paige/vimeo keyboard=false video="644036051" */>}}
```
Result:
{{< paige/vimeo keyboard=false video="644036051" >}}
## Loop parameter
Code:
```go-html-template
{{</* paige/vimeo loop=true video="644036051" */>}}
```
Result:
{{< paige/vimeo loop=true video="644036051" >}}
## Maxheight parameter
Code:
```go-html-template
{{</* paige/vimeo maxheight="10rem" video="644036051" */>}}
```
Result:
{{< paige/vimeo maxheight="10rem" video="644036051" >}}
## Maxwidth parameter
Code:
```go-html-template
{{</* paige/vimeo maxwidth="50%" video="644036051" */>}}
```
Result:
{{< paige/vimeo maxwidth="50%" video="644036051" >}}
## Muted parameter
Code:
```go-html-template
{{</* paige/vimeo muted=true video="644036051" */>}}
```
Result:
{{< paige/vimeo muted=true video="644036051" >}}
## PIP parameter
Code:
```go-html-template
{{</* paige/vimeo pip=true video="644036051" */>}}
```
Result:
{{< paige/vimeo pip=true video="644036051" >}}
## Playsinline parameter
Code:
```go-html-template
{{</* paige/vimeo playsinline=false video="644036051" */>}}
```
Result:
{{< paige/vimeo playsinline=false video="644036051" >}}
## Portrait parameter
Code:
```go-html-template
{{</* paige/vimeo portrait=false video="644036051" */>}}
```
Result:
{{< paige/vimeo portrait=false video="644036051" >}}
## Quality parameter
Code:
```go-html-template
{{</* paige/vimeo quality="720p" video="644036051" */>}}
```
Result:
{{< paige/vimeo quality="720p" video="644036051" >}}
## Speed parameter
Code:
```go-html-template
{{</* paige/vimeo speed=true video="644036051" */>}}
```
Result:
{{< paige/vimeo speed=true video="644036051" >}}
## Texttrack parameter
Code:
```go-html-template
{{</* paige/vimeo texttrack=true video="644036051" */>}}
```
Result:
{{< paige/vimeo texttrack=true video="644036051" >}}
## Time parameter
Code:
```go-html-template
{{</* paige/vimeo time="1m2s" video="644036051" */>}}
```
Result:
{{< paige/vimeo time="1m2s" video="644036051" >}}
## Title parameter
Code:
```go-html-template
{{</* paige/vimeo title=false video="644036051" */>}}
```
Result:
{{< paige/vimeo title=false video="644036051" >}}
## Transparent parameter
Code:
```go-html-template
{{</* paige/vimeo transparent=false video="644036051" */>}}
```
Result:
{{< paige/vimeo transparent=false video="644036051" >}}
## Video parameter
Code:
```go-html-template
{{</* paige/vimeo video="644036051" */>}}
```
Result:
{{< paige/vimeo video="644036051" >}}
## Width parameter
Code:
```go-html-template
{{</* paige/vimeo video="644036051" width="50%" */>}}
```
Result:
{{< paige/vimeo video="644036051" width="50%" >}}
## Figure
Code:
```go-html-template
{{</* paige/figure caption="Vimeo" */>}}
{{</* paige/vimeo video="644036051" */>}}
{{</* /paige/figure */>}}
```
Result:
{{< paige/figure caption="Vimeo" >}}
{{< paige/vimeo video="644036051" >}}
{{< /paige/figure >}}

View File

@@ -0,0 +1,207 @@
+++
authors = ["author-demo"]
categories = ["paige", "shortcodes"]
description = "Demonstration of the YouTube shortcode."
tags = ["videos", "youtube"]
title = "YouTube"
+++
The `paige/youtube` shortcode plays a YouTube video.
<!--more-->
## Basic
Code:
```go-html-template
{{</* paige/youtube "dQw4w9WgXcQ" */>}}
```
Result:
{{< paige/youtube "dQw4w9WgXcQ" >}}
## Autoplay parameter
Code:
```go-html-template
{{</* paige/youtube autoplay=true video="dQw4w9WgXcQ" */>}}
```
Result:
{{< paige/youtube autoplay=true video="dQw4w9WgXcQ" >}}
## Controls parameter
Code:
```go-html-template
{{</* paige/youtube controls=true video="dQw4w9WgXcQ" */>}}
```
Result:
{{< paige/youtube controls=true video="dQw4w9WgXcQ" >}}
## Description parameter
Code:
```go-html-template
{{</* paige/youtube description="My title" video="dQw4w9WgXcQ" */>}}
```
Result:
{{< paige/youtube description="My title" video="dQw4w9WgXcQ" >}}
## End parameter
Code:
```go-html-template
{{</* paige/youtube end=20 video="dQw4w9WgXcQ" */>}}
```
Result:
{{< paige/youtube end=20 video="dQw4w9WgXcQ" >}}
## Fullscreen parameter
Code:
```go-html-template
{{</* paige/youtube fullscreen=false video="dQw4w9WgXcQ" */>}}
```
Result:
{{< paige/youtube fullscreen=false video="dQw4w9WgXcQ" >}}
## Height parameter
Code:
```go-html-template
{{</* paige/youtube height="10rem" video="dQw4w9WgXcQ" */>}}
```
Result:
{{< paige/youtube height="10rem" video="dQw4w9WgXcQ" >}}
## List parameter
Code:
```go-html-template
{{</* paige/youtube list="PLOstxpSiJGlClyRnCiubdXJcUvwgHcrVH" video="dQw4w9WgXcQ" */>}}
```
Result:
{{< paige/youtube list="PLOstxpSiJGlClyRnCiubdXJcUvwgHcrVH" video="dQw4w9WgXcQ" >}}
## Loop parameter
Code:
```go-html-template
{{</* paige/youtube loop=true video="dQw4w9WgXcQ" */>}}
```
Result:
{{< paige/youtube loop=true video="dQw4w9WgXcQ" >}}
## Maxheight parameter
Code:
```go-html-template
{{</* paige/youtube maxheight="10rem" video="dQw4w9WgXcQ" */>}}
```
Result:
{{< paige/youtube maxheight="10rem" video="dQw4w9WgXcQ" >}}
## Maxwidth parameter
Code:
```go-html-template
{{</* paige/youtube maxwidth="50%" video="dQw4w9WgXcQ" */>}}
```
Result:
{{< paige/youtube maxwidth="50%" video="dQw4w9WgXcQ" >}}
## Mute parameter
Code:
```go-html-template
{{</* paige/youtube mute=true video="dQw4w9WgXcQ" */>}}
```
Result:
{{< paige/youtube mute=true video="dQw4w9WgXcQ" >}}
## Start parameter
Code:
```go-html-template
{{</* paige/youtube start=10 video="dQw4w9WgXcQ" */>}}
```
Result:
{{< paige/youtube start=10 video="dQw4w9WgXcQ" >}}
## Video parameter
Code:
```go-html-template
{{</* paige/youtube video="dQw4w9WgXcQ" */>}}
```
Result:
{{< paige/youtube video="dQw4w9WgXcQ" >}}
## Width parameter
Code:
```go-html-template
{{</* paige/youtube video="dQw4w9WgXcQ" width="50%" */>}}
```
Result:
{{< paige/youtube video="dQw4w9WgXcQ" width="50%" >}}
## Figure
Code:
```go-html-template
{{</* paige/figure caption="YouTube" */>}}
{{</* paige/youtube video="dQw4w9WgXcQ" */>}}
{{</* /paige/figure */>}}
```
Result:
{{< paige/figure caption="YouTube" >}}
{{< paige/youtube video="dQw4w9WgXcQ" >}}
{{< /paige/figure >}}

View File

@@ -0,0 +1,5 @@
+++
description = "Browse by tag."
layout = "paige/cloud"
title = "Tags"
+++

View File

@@ -0,0 +1,4 @@
+++
description = "Demonstration of a tag."
title = "Sections"
+++

6
example/go.mod Normal file
View File

@@ -0,0 +1,6 @@
module github.com/willfaught/paige/exampleSite
go 1.20
require github.com/willfaught/paige v0.97.0 // indirect
replace github.com/willfaught/paige => ../

14
example/go.sum Normal file
View File

@@ -0,0 +1,14 @@
github.com/willfaught/paige v0.55.0 h1:GAUyER1484ruKKKf/UCst480FQQIiEHiV5OPs0XTO5I=
github.com/willfaught/paige v0.55.0/go.mod h1:0Nt8ifl7UVYQIBaMtpZmg+BrQHHzFNqKcrBoA2Oo4/E=
github.com/willfaught/paige v0.58.0 h1:mH/gFngQVxhd2++cBk6RpJZCRamtGsXXCY6uVbLvNeo=
github.com/willfaught/paige v0.58.0/go.mod h1:0Nt8ifl7UVYQIBaMtpZmg+BrQHHzFNqKcrBoA2Oo4/E=
github.com/willfaught/paige v0.59.0 h1:/RIQnBt/QQZQ4I8/JYuisB8lw5si7nsqoCPUN762DkY=
github.com/willfaught/paige v0.59.0/go.mod h1:0Nt8ifl7UVYQIBaMtpZmg+BrQHHzFNqKcrBoA2Oo4/E=
github.com/willfaught/paige v0.60.0 h1:p5gx602vXPH3mczOFSoFSs+UO/DmKEf05/lk+D8jAR0=
github.com/willfaught/paige v0.60.0/go.mod h1:0Nt8ifl7UVYQIBaMtpZmg+BrQHHzFNqKcrBoA2Oo4/E=
github.com/willfaught/paige v0.61.0 h1:85FU/2sO5/p1wsrCcWmtmz2pw7nOLv8EA4Qaq6ApaGU=
github.com/willfaught/paige v0.61.0/go.mod h1:0Nt8ifl7UVYQIBaMtpZmg+BrQHHzFNqKcrBoA2Oo4/E=
github.com/willfaught/paige v0.61.1 h1:eh5NJcc1a4FdnlP5hqCpLY50YBZ0cQESy6tbZSbG14A=
github.com/willfaught/paige v0.61.1/go.mod h1:0Nt8ifl7UVYQIBaMtpZmg+BrQHHzFNqKcrBoA2Oo4/E=
github.com/willfaught/paige v0.62.0 h1:gFO4eF+oTXTRBjKsiAavDx5JwoGvYRkqdeCABJKKfSs=
github.com/willfaught/paige v0.62.0/go.mod h1:0Nt8ifl7UVYQIBaMtpZmg+BrQHHzFNqKcrBoA2Oo4/E=

82
example/hugo.toml Normal file
View File

@@ -0,0 +1,82 @@
baseurl = "https://example.com"
enablerobotstxt = true
timezone = "America/Los_Angeles"
titlecasestyle = "Go"
[languages.en]
copyright = "© Will Faught"
languagecode = "en-us"
languagedirection = "ltr"
languagename = "English"
title = "Paige"
weight = 10
[languages.en.params.paige.site]
description = "Powerful, pliable pixel perfection"
[markup.goldmark.renderer]
unsafe = true
[markup.highlight]
noclasses = false
style = "github"
[markup.tableofcontents]
endlevel = 6
ordered = true
startlevel = 2
[[module.imports]]
path = "github.com/willfaught/paige"
[outputs]
home = ["atom", "html", "paige-search", "rss"]
section = ["atom", "html", "rss"]
taxonomy = ["atom", "html", "rss"]
term = ["atom", "html", "rss"]
[pagination]
pagersize = 50
[[params.paige.feeds.atom.authors]]
email = "example@example.com"
name = "John Doe"
url = "https://example.com"
[params.paige.feeds.rss]
managing_editor = "example@example.com (John Doe)"
web_master = "example@example.com (John Doe)"
[params.paige.pages]
disable_authors = true
disable_date = true
disable_keywords = true
disable_next = true
disable_prev = true
disable_reading_time = true
disable_series = true
disable_toc = true
disable_word_count = true
[paige.pages.base_schema]
isAccessibleForFree = true
isFamilyFriendly = true
[params.paige.site]
disable_breadcrumbs = true
disable_credit = true
[params.paige.subpages]
disable_authors = true
disable_date = true
disable_keywords = true
disable_reading_time = true
disable_series = true
disable_summary = true
disable_word_count = true
[taxonomies]
author = "authors"
category = "categories"
series = "series"
tag = "tags"