mirror of
https://github.com/thegeeklab/hugo-geekblog.git
synced 2024-11-21 20:50:40 +00:00
docs: add missing documentation for shortcodes (#41)
This commit is contained in:
GitHub
parent
60a16b5b55
commit
243f1f3009
@ -18,3 +18,10 @@ submodule
|
||||
GPL
|
||||
IcoMoon
|
||||
FontAwesome
|
||||
macOS
|
||||
ok
|
||||
toc
|
||||
ToC
|
||||
relref
|
||||
href
|
||||
Emojify
|
||||
|
||||
1
assets/sprites/geekblog.svg
Normal file
1
assets/sprites/geekblog.svg
Normal file
File diff suppressed because one or more lines are too long
|
After Width: | Height: | Size: 12 KiB |
@ -1,5 +1,5 @@
|
||||
---
|
||||
title: "Get in touch"
|
||||
title: Get in touch
|
||||
---
|
||||
|
||||
- **E-Mail:** <!-- spellchecker-disable -->mail [ett] example.com<!-- spellchecker-enable -->
|
||||
|
||||
@ -1,46 +0,0 @@
|
||||
---
|
||||
title: "Emoji Support"
|
||||
date: 2020-07-13T19:00:00+02:00
|
||||
authors:
|
||||
- john-doe
|
||||
- Special User
|
||||
tags:
|
||||
- Documentation
|
||||
---
|
||||
|
||||
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:
|
||||
|
||||
<!-- markdownlint-disable -->
|
||||
<!-- spellchecker-disable -->
|
||||
|
||||
<span class="no-wrap">{{< emojify ":see_no_evil:" >}} <code>:see_no_evil:</code></span>
|
||||
<span class="no-wrap">{{< emojify ":hear_no_evil:" >}} <code>:hear_no_evil:</code></span>
|
||||
<span class="no-wrap">{{< emojify ":speak_no_evil:" >}} <code>:speak_no_evil:</code></span>
|
||||
|
||||
<!-- spellchecker-enable -->
|
||||
<!-- markdownlint-restore -->
|
||||
|
||||
The [Emoji cheat sheet](http://www.emoji-cheat-sheet.com/) is a useful reference for emoji shorthand codes.
|
||||
|
||||
{{< hint info >}}
|
||||
**Info**\
|
||||
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.
|
||||
{{< /hint >}}
|
||||
|
||||
**Example:**
|
||||
|
||||
<!-- spellchecker-disable -->
|
||||
<!-- prettier-ignore -->
|
||||
{{< highlight html "linenos=table" >}}
|
||||
.emoji {
|
||||
font-family: Apple Color Emoji, Segoe UI Emoji, NotoColorEmoji, Segoe UI Symbol, Android Emoji, EmojiSymbols;
|
||||
}
|
||||
{{< /highlight >}}
|
||||
|
||||
<!-- spellchecker-enable -->
|
||||
@ -1,5 +1,5 @@
|
||||
---
|
||||
title: "Getting Started"
|
||||
title: Getting Started
|
||||
date: 2020-07-15T20:00:00+02:00
|
||||
authors:
|
||||
- john-doe
|
||||
@ -497,7 +497,7 @@ my_projcet/
|
||||
│ ├── ...
|
||||
```
|
||||
|
||||
That's it! The theme will auto-load all available SVG sprites provided in the assets folder. To use the icons, you need to lookup the id of the icon. An example would be `thumbs-up` {{< icon "thumbs-up" >}}.
|
||||
That's it! The theme will auto-load all available SVG sprites provided in the assets folder. To use the icons, you need to lookup the id of the icon. An example would be `thumbs-up` {{< icon "thumbs-up" >}}. There is also a [shortcode](/posts/shortcodes/#icon) available
|
||||
|
||||
## Build-in icons
|
||||
|
||||
|
||||
@ -1,5 +1,5 @@
|
||||
---
|
||||
title: "Markdown syntax"
|
||||
title: Markdown syntax
|
||||
date: 2020-07-13T20:00:00+02:00
|
||||
authors:
|
||||
- john-doe
|
||||
|
||||
55
exampleSite/content/posts/mermaid.md
Normal file
55
exampleSite/content/posts/mermaid.md
Normal file
@ -0,0 +1,55 @@
|
||||
---
|
||||
title: Mermaid
|
||||
date: 2021-05-23T20:00:00+01:00
|
||||
authors:
|
||||
- john-doe
|
||||
tags:
|
||||
- Documentation
|
||||
- Shortcodes
|
||||
weight: 10
|
||||
---
|
||||
|
||||
[Mermaid](https://mermaidjs.github.io/) is library for generating SVG charts and diagrams from text.
|
||||
|
||||
<!--more-->
|
||||
|
||||
## Example
|
||||
|
||||
{{< columns >}}
|
||||
|
||||
<!-- prettier-ignore -->
|
||||
```tpl
|
||||
{{</* mermaid class="text-center"*/>}}
|
||||
sequenceDiagram
|
||||
Alice->>Bob: Hello Bob, how are you?
|
||||
alt is sick
|
||||
Bob->>Alice: Not so good :(
|
||||
else is well
|
||||
Bob->>Alice: Feeling fresh like a daisy
|
||||
end
|
||||
opt Extra response
|
||||
Bob->>Alice: Thanks for asking
|
||||
end
|
||||
{{</* /mermaid */>}}
|
||||
```
|
||||
|
||||
<--->
|
||||
|
||||
<!-- spellchecker-disable -->
|
||||
<!-- prettier-ignore -->
|
||||
{{< mermaid class="text-center" >}}
|
||||
sequenceDiagram
|
||||
Alice->>Bob: Hello Bob, how are you?
|
||||
alt is sick
|
||||
Bob->>Alice: Not so good :(
|
||||
else is well
|
||||
Bob->>Alice: Feeling fresh like a daisy
|
||||
end
|
||||
opt Extra response
|
||||
Bob->>Alice: Thanks for asking
|
||||
end
|
||||
{{< /mermaid >}}
|
||||
|
||||
<!-- spellchecker-enable -->
|
||||
|
||||
{{< /columns >}}
|
||||
@ -1,5 +1,5 @@
|
||||
---
|
||||
title: "Short post"
|
||||
title: Short post
|
||||
date: 2020-06-22T20:00:00+02:00
|
||||
authors:
|
||||
- john-doe
|
||||
|
||||
BIN
exampleSite/content/posts/post-with-images/images/forest-1.jpg
Normal file
BIN
exampleSite/content/posts/post-with-images/images/forest-1.jpg
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 715 KiB |
BIN
exampleSite/content/posts/post-with-images/images/forest-2.jpg
Normal file
BIN
exampleSite/content/posts/post-with-images/images/forest-2.jpg
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 463 KiB |
BIN
exampleSite/content/posts/post-with-images/images/forest-3.jpg
Normal file
BIN
exampleSite/content/posts/post-with-images/images/forest-3.jpg
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 484 KiB |
BIN
exampleSite/content/posts/post-with-images/images/forest-4.jpg
Normal file
BIN
exampleSite/content/posts/post-with-images/images/forest-4.jpg
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 472 KiB |
BIN
exampleSite/content/posts/post-with-images/images/forest-5.jpg
Normal file
BIN
exampleSite/content/posts/post-with-images/images/forest-5.jpg
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 406 KiB |
BIN
exampleSite/content/posts/post-with-images/images/forest-6.jpg
Normal file
BIN
exampleSite/content/posts/post-with-images/images/forest-6.jpg
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 415 KiB |
BIN
exampleSite/content/posts/post-with-images/images/forest-7.jpg
Normal file
BIN
exampleSite/content/posts/post-with-images/images/forest-7.jpg
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 183 KiB |
Binary file not shown.
|
Before Width: | Height: | Size: 3.1 MiB |
@ -1,22 +1,52 @@
|
||||
---
|
||||
title: "Post with images"
|
||||
title: Post with images
|
||||
date: 2020-06-22T20:00:00+02:00
|
||||
authors:
|
||||
- richard-roe
|
||||
- john-doe
|
||||
tags:
|
||||
- Open Source
|
||||
- Development
|
||||
- Documentation
|
||||
- Shortcodes
|
||||
weight: 20
|
||||
resources:
|
||||
- name: feature
|
||||
src: "images/feature.jpg"
|
||||
params:
|
||||
credits: "[Angelina Litvin](https://unsplash.com/@linalitvina) on [Unsplash](https://unsplash.com/s/photos/writing)"
|
||||
- name: testimage
|
||||
src: "images/testimage.jpg"
|
||||
title: This is a test image
|
||||
- name: forest-1
|
||||
src: "images/forest-1.jpg"
|
||||
title: Forest (1)
|
||||
params:
|
||||
credits: "[David Pennington](https://unsplash.com/@dtpennington) on [Unsplash](https://unsplash.com/s/photos/test)"
|
||||
credits: "[Jay Mantri](https://unsplash.com/@jaymantri) on [Unsplash](https://unsplash.com/s/photos/forest)"
|
||||
- name: forest-2
|
||||
src: "images/forest-2.jpg"
|
||||
title: Forest (2)
|
||||
params:
|
||||
credits: "[Jay Mantri](https://unsplash.com/@jaymantri) on [Unsplash](https://unsplash.com/s/photos/forest)"
|
||||
- name: forest-3
|
||||
src: "images/forest-3.jpg"
|
||||
title: Forest (3)
|
||||
params:
|
||||
credits: "[Jay Mantri](https://unsplash.com/@jaymantri) on [Unsplash](https://unsplash.com/s/photos/forest)"
|
||||
- name: forest-4
|
||||
src: "images/forest-4.jpg"
|
||||
title: Forest (4)
|
||||
params:
|
||||
credits: "[Jay Mantri](https://unsplash.com/@jaymantri) on [Unsplash](https://unsplash.com/s/photos/forest)"
|
||||
- name: forest-5
|
||||
src: "images/forest-5.jpg"
|
||||
title: Forest (5)
|
||||
params:
|
||||
credits: "[Jay Mantri](https://unsplash.com/@jaymantri) on [Unsplash](https://unsplash.com/s/photos/forest)"
|
||||
- name: forest-6
|
||||
src: "images/forest-6.jpg"
|
||||
title: Forest (6)
|
||||
params:
|
||||
credits: "[Asher Ward](https://unsplash.com/@the_asher_ward) on [Unsplash](https://unsplash.com/s/photos/forest)"
|
||||
- name: forest-7
|
||||
src: "images/forest-7.jpg"
|
||||
title: Forest (7)
|
||||
params:
|
||||
credits: "[Asher Ward](https://unsplash.com/@the_asher_ward) on [Unsplash](https://unsplash.com/s/photos/forest)"
|
||||
---
|
||||
|
||||
If you need more flexibility for your embedded images, you could use the `img` shortcode. It is using Hugo's
|
||||
@ -25,11 +55,11 @@ If you need more flexibility for your embedded images, you could use the `img` s
|
||||
**Attributes:**
|
||||
|
||||
| Name | Usage | default |
|
||||
| ------------- | -------------------------------------------------------------------------------------------------------------- | ----------------- |
|
||||
| ------------- | ------------------------------------------------------------------------------------------------------------- | ----------------- |
|
||||
| name (string) | Name of the image resource defined in your front matter. | empty |
|
||||
| alt (string) | Description for displayed image. | resource `.Title` |
|
||||
| size (string) | Thumbnail size (tiny\|small\|medium\|large). | empty |
|
||||
| lazy (bool) | Enable or disable image lazy loading. Can be controlled globally by site parameter `geekblogImageLazyLoading`. | true |
|
||||
| lazy (bool) | Enable or disable image lazy loading. Can be controlled globally by site parameter `geekdocImageLazyLoading`. | true |
|
||||
|
||||
**Example:**
|
||||
|
||||
@ -40,16 +70,88 @@ Define your resources in the page front matter, custom parameter `params.credits
|
||||
```md
|
||||
---
|
||||
resources:
|
||||
- name: testimage
|
||||
src: "images/testimage.jpg"
|
||||
title: This is a test image
|
||||
- name: forest-1
|
||||
src: "images/forest-1.jpg"
|
||||
title: Forest (1)
|
||||
params:
|
||||
credits: "[David Pennington](https://unsplash.com/@dtpennington) on [Unsplash](https://unsplash.com/s/photos/test)"
|
||||
credits: "[Jay Mantri](https://unsplash.com/@jaymantri) on [Unsplash](https://unsplash.com/s/photos/forest)"
|
||||
---
|
||||
|
||||
{{</* img name="testimage" size="small" lazy=true */>}}
|
||||
{{</* img name="forest-1" size="large" lazy=false */>}}
|
||||
```
|
||||
|
||||
<!-- spellchecker-enable -->
|
||||
|
||||
{{< img name="testimage" size="small" lazy=true >}}
|
||||
**Demo:**
|
||||
|
||||
<!-- spellchecker-disable -->
|
||||
|
||||
{{< img name="forest-1" lazy=false >}}
|
||||
|
||||
<!-- spellchecker-enable -->
|
||||
|
||||
Dolor sit, sumo unique argument um no. Gracie nominal id xiv. Romanesque acclimates
|
||||
investiture. Ornateness bland it ex enc, est yeti am bongo detract re. Pro ad prompts
|
||||
feud gait, quid exercise emeritus bis e. In pro quints consequent, denim fastidious
|
||||
copious quo ad. Stet probates in duo.
|
||||
|
||||
<!-- spellchecker-disable -->
|
||||
|
||||
{{< img name="forest-2" lazy=true >}}
|
||||
|
||||
<!-- spellchecker-enable -->
|
||||
|
||||
Dolor sit, sumo unique argument um no. Gracie nominal id xiv. Romanesque acclimates
|
||||
investiture. Ornateness bland it ex enc, est yeti am bongo detract re. Pro ad prompts
|
||||
feud gait, quid exercise emeritus bis e. In pro quints consequent, denim fastidious
|
||||
copious quo ad. Stet probates in duo.
|
||||
|
||||
<!-- spellchecker-disable -->
|
||||
|
||||
{{< img name="forest-3" lazy=true >}}
|
||||
|
||||
<!-- spellchecker-enable -->
|
||||
|
||||
Dolor sit, sumo unique argument um no. Gracie nominal id xiv. Romanesque acclimates
|
||||
investiture. Ornateness bland it ex enc, est yeti am bongo detract re. Pro ad prompts
|
||||
feud gait, quid exercise emeritus bis e. In pro quints consequent, denim fastidious
|
||||
copious quo ad. Stet probates in duo.
|
||||
|
||||
<!-- spellchecker-disable -->
|
||||
|
||||
{{< img name="forest-4" lazy=true >}}
|
||||
|
||||
<!-- spellchecker-enable -->
|
||||
|
||||
Dolor sit, sumo unique argument um no. Gracie nominal id xiv. Romanesque acclimates
|
||||
investiture. Ornateness bland it ex enc, est yeti am bongo detract re. Pro ad prompts
|
||||
feud gait, quid exercise emeritus bis e. In pro quints consequent, denim fastidious
|
||||
copious quo ad. Stet probates in duo.
|
||||
|
||||
<!-- spellchecker-disable -->
|
||||
|
||||
{{< img name="forest-5" lazy=true >}}
|
||||
|
||||
<!-- spellchecker-enable -->
|
||||
|
||||
Dolor sit, sumo unique argument um no. Gracie nominal id xiv. Romanesque acclimates
|
||||
investiture. Ornateness bland it ex enc, est yeti am bongo detract re. Pro ad prompts
|
||||
feud gait, quid exercise emeritus bis e. In pro quints consequent, denim fastidious
|
||||
copious quo ad. Stet probates in duo.
|
||||
|
||||
<!-- spellchecker-disable -->
|
||||
|
||||
{{< img name="forest-6" lazy=true >}}
|
||||
|
||||
<!-- spellchecker-enable -->
|
||||
|
||||
Dolor sit, sumo unique argument um no. Gracie nominal id xiv. Romanesque acclimates
|
||||
investiture. Ornateness bland it ex enc, est yeti am bongo detract re. Pro ad prompts
|
||||
feud gait, quid exercise emeritus bis e. In pro quints consequent, denim fastidious
|
||||
copious quo ad. Stet probates in duo.
|
||||
|
||||
<!-- spellchecker-disable -->
|
||||
|
||||
{{< img name="forest-7" lazy=true >}}
|
||||
|
||||
<!-- spellchecker-enable -->
|
||||
|
||||
262
exampleSite/content/posts/shortcodes.md
Normal file
262
exampleSite/content/posts/shortcodes.md
Normal file
@ -0,0 +1,262 @@
|
||||
---
|
||||
title: Shortcodes
|
||||
date: 2021-05-23T20:00:00+01:00
|
||||
authors:
|
||||
- john-doe
|
||||
tags:
|
||||
- Documentation
|
||||
- Shortcodes
|
||||
geekblogToC: 1
|
||||
weight: 5
|
||||
---
|
||||
|
||||
<!-- markdownlint-disable MD024 -->
|
||||
|
||||
The theme bundles some handy shortcodes that tries to cover common situations.
|
||||
|
||||
<!--more-->
|
||||
|
||||
{{< toc >}}
|
||||
|
||||
## Buttons
|
||||
|
||||
Buttons are styled links that can lead to local page or external link.
|
||||
|
||||
```tpl
|
||||
{{</* button relref="/" [class="..."] */>}}Get Home{{</* /button */>}}
|
||||
{{</* button href="https://github.com/thegeeklab/hugo-geekdoc" */>}}Contribute{{</* /button */>}}
|
||||
```
|
||||
|
||||
### Example
|
||||
|
||||
{{< button relref="/" >}}Get Home{{< /button >}}
|
||||
{{< button href="https://github.com/thegeeklab/hugo-geekdoc" >}}Contribute{{< /button >}}
|
||||
|
||||
## Columns
|
||||
|
||||
The Columns shortcode can be used to organize content side-by-side (horizontally) for better readability.
|
||||
|
||||
```html
|
||||
{{</* columns */>}} <!-- begin columns block -->
|
||||
# Left Content
|
||||
Dolor sit, sumo unique argument um no ...
|
||||
|
||||
<---> <!-- magic sparator, between columns -->
|
||||
|
||||
# Mid Content
|
||||
Dolor sit, sumo unique argument um no ...
|
||||
|
||||
<---> <!-- magic sparator, between columns -->
|
||||
|
||||
# Right Content
|
||||
Dolor sit, sumo unique argument um no ...
|
||||
{{</* /columns */>}}
|
||||
```
|
||||
|
||||
### Example
|
||||
|
||||
{{< columns >}}
|
||||
|
||||
#### Left
|
||||
|
||||
Dolor sit, sumo unique argument um no. Gracie nominal id xiv. Romanesque acclimates
|
||||
investiture. Ornateness bland it ex enc, est yeti am bongo detract re. Pro ad prompts
|
||||
feud gait, quid exercise emeritus bis e. In pro quints consequent, denim fastidious
|
||||
copious quo ad. Stet probates in duo.
|
||||
|
||||
<--->
|
||||
|
||||
#### Mid Content
|
||||
|
||||
Dolor sit, sumo unique argument um no. Gracie nominal id xiv. Romanesque acclimates
|
||||
investiture. Ornateness bland it ex enc, est yeti am bongo detract re.
|
||||
|
||||
<--->
|
||||
|
||||
#### Right Content
|
||||
|
||||
Dolor sit, sumo unique argument um no. Gracie nominal id xiv. Romanesque acclimates
|
||||
investiture. Ornateness bland it ex enc, est yeti am bongo detract re. Pro ad prompts
|
||||
feud gait, quid exercise emeritus bis e. In pro quints consequent, denim fastidious
|
||||
copious quo ad. Stet probates in duo.
|
||||
{{< /columns >}}
|
||||
|
||||
## Emojify
|
||||
|
||||
Emoji can be enabled in a Hugo project in a number of ways.
|
||||
|
||||
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:
|
||||
|
||||
| Result | Inline | Shortcode |
|
||||
| --------------------------------- | ----------------- | --------------------------------------- |
|
||||
| {{< emojify ":see_no_evil:" >}} | `:see_no_evil:` | `{{</* emojify ":see_no_evil:" */>}}` |
|
||||
| {{< emojify ":hear_no_evil:" >}} | `:hear_no_evil:` | `{{</* emojify ":hear_no_evil:" */>}}` |
|
||||
| {{< emojify ":speak_no_evil:" >}} | `:speak_no_evil:` | `{{</* emojify ":speak_no_evil:" */>}}` |
|
||||
|
||||
The [Emoji cheat sheet](http://www.emoji-cheat-sheet.com/) is a useful reference for emoji shorthand codes.
|
||||
|
||||
{{< hint info >}}
|
||||
**Info**\
|
||||
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.
|
||||
{{< /hint >}}
|
||||
|
||||
**Styling:**
|
||||
|
||||
<!-- prettier-ignore-start -->
|
||||
<!-- spellchecker-disable -->
|
||||
{{< highlight html "linenos=table" >}}
|
||||
.emoji {
|
||||
font-family: Apple Color Emoji, Segoe UI Emoji, NotoColorEmoji, Segoe UI Symbol, Android Emoji, EmojiSymbols;
|
||||
}
|
||||
{{< /highlight >}}
|
||||
<!-- spellchecker-enable -->
|
||||
<!-- prettier-ignore-end -->
|
||||
|
||||
## Expand
|
||||
|
||||
Expand shortcode can help to decrease clutter on screen by hiding part of text. Expand content by clicking on it.
|
||||
|
||||
### Example
|
||||
|
||||
#### Default
|
||||
|
||||
```tpl
|
||||
{{</* expand */>}}
|
||||
## Markdown content
|
||||
Dolor sit, sumo unique ...
|
||||
{{</* /expand */>}}
|
||||
```
|
||||
|
||||
{{< expand >}}
|
||||
|
||||
##### Markdown content
|
||||
|
||||
Dolor sit, sumo unique argument um no. Gracie nominal id xiv. Romanesque acclimates investiture. Ornateness bland it ex enc, est yeti am bongo detract re.
|
||||
{{< /expand >}}
|
||||
|
||||
#### With Custom Label
|
||||
|
||||
```tpl
|
||||
{{</* expand "Custom Label" "..." */>}}
|
||||
## Markdown content
|
||||
Dolor sit, sumo unique ...
|
||||
{{</* /expand */>}}
|
||||
```
|
||||
|
||||
{{< expand "Custom Label" "..." >}}
|
||||
|
||||
##### More markdown
|
||||
|
||||
Dolor sit, sumo unique argument um no. Gracie nominal id xiv. Romanesque acclimates
|
||||
investiture. Ornateness bland it ex enc, est yeti am bongo detract re. Pro ad prompts
|
||||
feud gait, quid exercise emeritus bis e. In pro quints consequent, denim fastidious
|
||||
copious quo ad. Stet probates in duo.
|
||||
{{< /expand >}}
|
||||
|
||||
## Hint
|
||||
|
||||
Hint shortcode can be used as hint/alerts/notification block.
|
||||
There are four colors to choose: `info`, `ok`, `warning` and `danger`.
|
||||
|
||||
```tpl
|
||||
{{</* hint [info|warning|danger] */>}}
|
||||
**Markdown content**\
|
||||
Dolor sit, sumo unique argument um no. Gracie nominal id xiv. Romanesque acclimates investiture.
|
||||
Ornateness bland it ex enc, est yeti am bongo detract re.
|
||||
{{</* /hint */>}}
|
||||
```
|
||||
|
||||
### Example
|
||||
|
||||
{{< hint info >}}
|
||||
**Markdown content**\
|
||||
Dolor sit, sumo unique argument um no. Gracie nominal id xiv. Romanesque acclimates investiture.
|
||||
Ornateness bland it ex enc, est yeti am bongo detract re.
|
||||
{{< /hint >}}
|
||||
|
||||
{{< hint ok >}}
|
||||
**Markdown content**\
|
||||
Dolor sit, sumo unique argument um no. Gracie nominal id xiv. Romanesque acclimates investiture.
|
||||
Ornateness bland it ex enc, est yeti am bongo detract re.
|
||||
{{< /hint >}}
|
||||
|
||||
{{< hint warning >}}
|
||||
**Markdown content**\
|
||||
Dolor sit, sumo unique argument um no. Gracie nominal id xiv. Romanesque acclimates investiture.
|
||||
Ornateness bland it ex enc, est yeti am bongo detract re.
|
||||
{{< /hint >}}
|
||||
|
||||
{{< hint danger >}}
|
||||
**Markdown content**\
|
||||
Dolor sit, sumo unique argument um no. Gracie nominal id xiv. Romanesque acclimates investiture.
|
||||
Ornateness bland it ex enc, est yeti am bongo detract re.
|
||||
{{< /hint >}}
|
||||
|
||||
## Icon
|
||||
|
||||
Simple shortcode to include icons from SVG sprites outside of menus.
|
||||
|
||||
```tpl
|
||||
{{</* icon "thumbs-up" */>}}
|
||||
```
|
||||
|
||||
### Example
|
||||
|
||||
| Result | Usage |
|
||||
| -------------------------- | -------------------------------- |
|
||||
| {{< icon "thumbs-up" >}} | `{{</* icon "thumbs-up" */>}}` |
|
||||
| {{< icon "thumbs-down" >}} | `{{</* icon "thumbs-down" */>}}` |
|
||||
| {{< icon "laugh" >}} | `{{</* icon "laugh" */>}}` |
|
||||
| {{< icon "lemon" >}} | `{{</* icon "lemon" */>}}` |
|
||||
| {{< icon "moon" >}} | `{{</* icon "moon" */>}}` |
|
||||
|
||||
## Tabs
|
||||
|
||||
Tabs let you organize content by context, for example installation instructions for each supported platform.
|
||||
|
||||
```tpl
|
||||
{{</* tabs "uniqueid" */>}}
|
||||
{{</* tab "macOS" */>}} # macOS Content {{</* /tab */>}}
|
||||
{{</* tab "Linux" */>}} # Linux Content {{</* /tab */>}}
|
||||
{{</* tab "Windows" */>}} # Windows Content {{</* /tab */>}}
|
||||
{{</* /tabs */>}}
|
||||
```
|
||||
|
||||
### Example
|
||||
|
||||
{{< tabs "uniqueid" >}}
|
||||
{{< tab "macOS" >}}
|
||||
|
||||
#### macOS
|
||||
|
||||
This is tab **macOS** content.
|
||||
|
||||
Dolor sit, sumo unique argument um no. Gracie nominal id xiv. Romanesque acclimates
|
||||
investiture. Ornateness bland it ex enc, est yeti am bongo detract re. Pro ad
|
||||
prompts feud gait, quid exercise emeritus bis e. In pro quints consequent, denim
|
||||
fastidious copious quo ad. Stet probates in duo.
|
||||
{{< /tab >}}
|
||||
|
||||
{{< tab "Linux" >}}
|
||||
|
||||
#### Linux
|
||||
|
||||
This is tab **Linux** content.
|
||||
|
||||
Dolor sit, sumo unique argument um no. Gracie nominal id xiv. Romanesque acclimates
|
||||
investiture. Ornateness bland it ex enc, est yeti am bongo detract re. Pro ad
|
||||
prompts feud gait, quid exercise emeritus bis e. In pro quints consequent, denim
|
||||
fastidious copious quo ad. Stet probates in duo.
|
||||
{{< /tab >}}
|
||||
|
||||
{{< tab "Windows" >}}
|
||||
|
||||
#### Windows
|
||||
|
||||
This is tab **Windows** content.
|
||||
|
||||
Dolor sit, sumo unique argument um no. Gracie nominal id xiv. Romanesque acclimates
|
||||
investiture. Ornateness bland it ex enc, est yeti am bongo detract re. Pro ad
|
||||
prompts feud gait, quid exercise emeritus bis e. In pro quints consequent.
|
||||
{{< /tab >}}
|
||||
{{< /tabs >}}
|
||||
@ -1,5 +1,5 @@
|
||||
---
|
||||
title: "Simple sticky posts"
|
||||
title: Simple sticky posts
|
||||
weight: 1
|
||||
date: 2020-06-13T00:06:00+02:00
|
||||
authors:
|
||||
|
||||
48
exampleSite/content/posts/toc.md
Normal file
48
exampleSite/content/posts/toc.md
Normal file
@ -0,0 +1,48 @@
|
||||
---
|
||||
title: ToC
|
||||
date: 2021-05-23T20:00:00+01:00
|
||||
authors:
|
||||
- john-doe
|
||||
tags:
|
||||
- Documentation
|
||||
- Shortcodes
|
||||
weight: 10
|
||||
---
|
||||
|
||||
Simple wrapper to generate a page Table of Content from a shortcode.
|
||||
|
||||
```tpl
|
||||
{{</* toc */>}}
|
||||
```
|
||||
|
||||
{{< toc >}}
|
||||
|
||||
## Level 1
|
||||
|
||||
Dolor sit, sumo unique argument um no. Gracie nominal id xiv. Romanesque acclimates investiture. Ornateness bland it ex enc, est yeti am bongo detract re. Pro ad prompts feud gait, quid exercise emeritus bis e. In pro quints consequent, denim fastidious copious quo ad. Stet probates in duo.
|
||||
|
||||
## Level 2
|
||||
|
||||
Amalia id per in minimum facility, quid facet modifier ea ma. Ill um select ma ad, en ferric patine sentient vim. Per expendable foreordained interpretations cu, maxim sole pertinacity in ram.
|
||||
|
||||
### Level 2.1
|
||||
|
||||
Amalia id per in minimum facility, quid facet modifier ea ma. Ill um select ma ad, en ferric patine sentient vim. Per expendable foreordained interpretations cu, maxim sole pertinacity in ram.
|
||||
|
||||
#### Level 2.1.1
|
||||
|
||||
Amalia id per in minimum facility, quid facet modifier ea ma. Ill um select ma ad, en ferric patine sentient vim.
|
||||
|
||||
##### Level 2.1.1.1
|
||||
|
||||
In pro quints consequent, denim fastidious copious quo ad.
|
||||
|
||||
###### Level 2.1.1.1.1
|
||||
|
||||
In pro quints consequent, denim fastidious copious quo ad.
|
||||
|
||||
### Level 2.2
|
||||
|
||||
Dolor sit, sumo unique argument um no. Gracie nominal id xiv. Romanesque acclimates investiture. Ornateness bland it ex enc, est yeti am bongo detract re. Pro ad prompts feud gait, quid exercise emeritus bis e.
|
||||
|
||||
Amalia id per in minimum facility, quid facet modifier ea ma. Ill um select ma ad, en ferric patine sentient vim. Per expendable foreordained interpretations cu, maxim sole pertinacity in ram.
|
||||
31
exampleSite/data/sprites/geekdoc.json
Normal file
31
exampleSite/data/sprites/geekdoc.json
Normal file
@ -0,0 +1,31 @@
|
||||
[
|
||||
"arrow_back",
|
||||
"arrow_left",
|
||||
"arrow_right",
|
||||
"bitbucket",
|
||||
"bookmarks",
|
||||
"clear",
|
||||
"cloud_off",
|
||||
"code",
|
||||
"contacts",
|
||||
"create",
|
||||
"date",
|
||||
"download",
|
||||
"email",
|
||||
"git",
|
||||
"github",
|
||||
"gitlab",
|
||||
"heart",
|
||||
"keyborad_arrow_left",
|
||||
"keyborad_arrow_right",
|
||||
"link",
|
||||
"menu",
|
||||
"notifications",
|
||||
"person",
|
||||
"pin",
|
||||
"rss_feed",
|
||||
"search",
|
||||
"security",
|
||||
"timer",
|
||||
"tree"
|
||||
]
|
||||
@ -16,21 +16,19 @@
|
||||
<div class="flex justify-center">
|
||||
<figure class="gblog-post__figure">
|
||||
<a class="gblog-markdown__link--raw" href="{{ .RelPermalink }}">
|
||||
<picture>
|
||||
<source
|
||||
{{ with $customSize }}
|
||||
srcset="{{ index $size $customSize }}"
|
||||
{{ else }}
|
||||
srcset="{{ $size.small }} 600w,
|
||||
{{ $size.medium }} 1200w"
|
||||
sizes="100vw"
|
||||
{{ end }} />
|
||||
<img
|
||||
{{ if $lazyLoad }}loading="lazy"{{ end }}
|
||||
{{ with $customSize }}
|
||||
src="{{ index $size $customSize }}" alt="{{ $caption }}"
|
||||
{{ else }}
|
||||
srcset="{{ $size.tiny }} 320w,
|
||||
{{ $size.small }} 600w,
|
||||
{{ $size.medium }} 1200w,
|
||||
{{ $size.large }} 2x"
|
||||
sizes="(max-width: 320px) 320w,
|
||||
(max-width: 600px) 600w,
|
||||
(max-width: 1200px) 1200w,
|
||||
2x"
|
||||
src="{{ $size.large }}" alt="{{ $caption }}"
|
||||
{{ end }}/>
|
||||
src="{{ $size.large }}" alt="{{ $caption }}" />
|
||||
</picture>
|
||||
</a>
|
||||
{{ with $caption }}
|
||||
<figcaption>{{ . }}{{ with $source.Params.credits }} ({{ . | $.Page.RenderString }}){{ end }}</figcaption>
|
||||
|
||||
@ -24,7 +24,7 @@
|
||||
"gulp": "4.0.2",
|
||||
"gulp-autoprefixer": "7.0.1",
|
||||
"gulp-clean-css": "4.3.0",
|
||||
"gulp-filelist": "^2.0.5",
|
||||
"gulp-filelist": "2.0.5",
|
||||
"gulp-iconfont": "11.0.0",
|
||||
"gulp-real-favicon": "0.3.2",
|
||||
"gulp-rename": "2.0.0",
|
||||
|
||||
Loading…
Reference in New Issue
Block a user