mirror of
https://github.com/McShelby/hugo-theme-relearn.git
synced 2024-11-23 07:47:54 +00:00
add english documentation content
This commit is contained in:
matcornic
parent
1e46e6b5f8
commit
aff3307ff5
40 changed files with 773 additions and 249 deletions
|
|
@ -17,7 +17,6 @@ defaultContentLanguageInSubdir= true
|
|||
[outputs]
|
||||
home = [ "HTML", "RSS", "JSON"]
|
||||
|
||||
|
||||
[Languages]
|
||||
[Languages.en]
|
||||
title = "Documentation for Hugo Learn Theme"
|
||||
|
|
@ -27,12 +26,12 @@ languageName = "English"
|
|||
[[Languages.en.menu.shortcuts]]
|
||||
name = "<i class='fa fa-github'></i> Github repo"
|
||||
identifier = "ds"
|
||||
url = "https://github.com/vjeantet/hugo-theme-docdock"
|
||||
url = "https://github.com/matcornic/hugo-theme-learn"
|
||||
weight = 10
|
||||
|
||||
[[Languages.en.menu.shortcuts]]
|
||||
name = "<i class='fa fa-camera'></i> Showcases"
|
||||
url = "/en/showcase"
|
||||
url = "showcase"
|
||||
weight = 11
|
||||
|
||||
[[Languages.en.menu.shortcuts]]
|
||||
|
|
@ -43,7 +42,7 @@ weight = 20
|
|||
|
||||
[[Languages.en.menu.shortcuts]]
|
||||
name = "<i class='fa fa-bullhorn'></i> Credits"
|
||||
url = "/en/credits"
|
||||
url = "/credits"
|
||||
weight = 30
|
||||
|
||||
[Languages.fr]
|
||||
|
|
@ -59,7 +58,7 @@ weight = 10
|
|||
|
||||
[[Languages.fr.menu.shortcuts]]
|
||||
name = "<i class='fa fa-camera'></i> Vitrine"
|
||||
url = "/fr/showcase"
|
||||
url = "/showcase"
|
||||
weight = 11
|
||||
|
||||
[[Languages.fr.menu.shortcuts]]
|
||||
|
|
@ -70,5 +69,5 @@ weight = 20
|
|||
|
||||
[[Languages.fr.menu.shortcuts]]
|
||||
name = "<i class='fa fa-bullhorn'></i> Crédits"
|
||||
url = "/fr/credits"
|
||||
url = "/credits"
|
||||
weight = 30
|
||||
|
|
@ -4,28 +4,27 @@ title: "Learn Theme for Hugo"
|
|||
|
||||
# Hugo learn theme
|
||||
|
||||
[Hugo-theme-learn](http://github.com/matcornic/hugo-theme-learn) is a theme for [Hugo](https://gohugo.io/), a fast and modern static website engine written in Go. Where Hugo is often used for blogs, this theme is **fully designed for documentation**.
|
||||
[Hugo-theme-learn](http://github.com/matcornic/hugo-theme-learn) is a theme for [Hugo](https://gohugo.io/), a fast and modern static website engine written in Go. Where Hugo is often used for blogs, this multilingual-ready theme is **fully designed for documentation**.
|
||||
|
||||
This theme is a partial porting of the [Learn theme](http://learn.getgrav.org/) of [Grav](https://getgrav.org/), a modern flat-file CMS written in PHP.
|
||||
|
||||
{{% notice tip %}}Learn theme works with a _page tree structure_ to organize content : All contents are pages, which belong to other pages. [read more about this]({{%relref "content-organisation/_index.md"%}})
|
||||
{{% notice tip %}}Learn theme works with a _page tree structure_ to organize content : All contents are pages, which belong to other pages. [read more about this]({{%relref "cont/pages/_index.md"%}})
|
||||
{{% /notice %}}
|
||||
|
||||
|
||||
|
||||
## Main features
|
||||
|
||||
* [Automatic Search]({{%relref "search/_index.md" %}})
|
||||
* [Multi languages]()
|
||||
* [Automatic Search]({{%relref "basics/configuration/_index.md" %}})
|
||||
* [Multilingual mode]({{%relref "cont/i18n/_index.md" %}})
|
||||
* **Unlimited menu levels**
|
||||
* Automatic next/prev buttons to navigate through menu entries
|
||||
* [Image resizing, shadow...]({{%relref "shortcodes/image.md" %}})
|
||||
* **Automatic next/prev buttons to navigate through menu entries**
|
||||
* [Image resizing, shadow...]({{%relref "cont/markdown.md#images" %}})
|
||||
* [Attachments files]({{%relref "shortcodes/attachments.md" %}})
|
||||
* [List child pages]({{%relref "shortcodes/children/_index.md" %}})
|
||||
* [Mermaid diagram]({{%relref "shortcodes/mermaid.md" %}}) (flowchart, sequence, gantt)
|
||||
* [Customizable look and feel and themes variants]({{%relref "basics/configuration/_index.md"%}})
|
||||
* [Buttons]({{%relref "shortcodes/button.md" %}}), [Tip/Note/Info/Warning boxes]({{%relref "shortcodes/notice.md" %}}), [Expand]({{%relref "shortcodes/expand.md" %}})
|
||||
* [customizable look and feel]({{%relref "content-organisation/customize-style/_index.md"%}}), [theme variants]({{%relref "content-organisation/customize-style/theme-variants.md"%}})
|
||||
|
||||
|
||||
|
||||
## Contribute to this documentation
|
||||
Feel free to update this content, just click the **Edit this page** link displayed on top right of each page, and pullrequest it
|
||||
|
|
|
|||
|
|
@ -31,6 +31,8 @@ Note that some of these parameters are explained in details in other sections of
|
|||
disableInlineCopyToClipBoard = false
|
||||
# A title for shortcuts in menu is set by default. Set this to true to disable it.
|
||||
disableShortcutsTitle = false
|
||||
# When using mulitlingual website, disable the switch language button.
|
||||
disableLanguageSwitchingButton = false
|
||||
# Order sections in menu by "weight" or "title". Default to "weight"
|
||||
ordersectionsby = "weight"
|
||||
# Change default color scheme with a variant one. Can be "red", "blue", "green".
|
||||
|
|
@ -67,7 +69,7 @@ This theme defines the following partials :
|
|||
- *favicon*: the favicon
|
||||
- *logo*: the logo, on top left hand corner.
|
||||
- *meta*: HTML meta tags, if you want to change default behavior
|
||||
- *menu*: left menu
|
||||
- *menu*: left menu. _Not meant to be overridden_
|
||||
- *menu-footer*: footer of the the left menu
|
||||
- *search*: search box
|
||||
- *toc*: table of contents
|
||||
|
|
@ -91,7 +93,7 @@ If you need to change this default behavior, create a new file in `layouts/parti
|
|||
<link rel="shortcut icon" href="/images/favicon.png" type="image/x-icon" />
|
||||
```
|
||||
|
||||
### Change default colors
|
||||
### Change default colors {#theme-variant}
|
||||
|
||||
**Hugo Learn theme** let you choose between 3 native color scheme variants, but feel free to add one yourself ! Default color scheme is based on [Grav Learn Theme](https://learn.getgrav.org/).
|
||||
|
||||
|
|
|
|||
|
|
@ -1,6 +1,6 @@
|
|||
---
|
||||
title: Archetypes
|
||||
weight: 20
|
||||
weight: 10
|
||||
---
|
||||
|
||||
Using the command: `hugo new [relative new content path]`, you can start a content file with the date and title automatically set. While this is a welcome feature, active writers need more : [archetypes](https://gohugo.io/content/archetypes/).
|
||||
|
|
@ -17,19 +17,21 @@ hugo new --kind chapter <name>/_index.md
|
|||
|
||||
It will create a page with predefined Front-Matter:
|
||||
|
||||
---
|
||||
date: 2016-04-10T23:17:49+02:00
|
||||
icon: <b>X. </b>
|
||||
title: index
|
||||
weight: 0
|
||||
---
|
||||
```markdown
|
||||
+++
|
||||
title = "{{ replace .TranslationBaseName "-" " " | title }}"
|
||||
date = {{ .Date }}
|
||||
weight = 5
|
||||
chapter = true
|
||||
pre = "<b>X. </b>"
|
||||
+++
|
||||
|
||||
### Chapter X
|
||||
|
||||
# Some Chapter title
|
||||
|
||||
Lorem ipsum
|
||||
|
||||
Lorem Ipsum.
|
||||
```
|
||||
|
||||
## Default
|
||||
|
||||
|
|
@ -37,20 +39,19 @@ To create a default page, run either one of the following commands
|
|||
|
||||
```
|
||||
# Either
|
||||
hugo new <chapter>/<name>/index.md
|
||||
hugo new <chapter>/<name>/_index.md
|
||||
# Or
|
||||
hugo new <chapter>/<name>.md
|
||||
```
|
||||
|
||||
It will create a page with predefined Front-Matter:
|
||||
|
||||
---
|
||||
date: 2016-04-09T17:51:50+02:00
|
||||
title: index
|
||||
toc: true
|
||||
weight: 5
|
||||
---
|
||||
```markdown
|
||||
+++
|
||||
title = "{{ replace .TranslationBaseName "-" " " | title }}"
|
||||
date = {{ .Date }}
|
||||
weight = 5
|
||||
+++
|
||||
|
||||
Lorem Ipsum
|
||||
|
||||
*Don't forget that Hugo-theme-learn supports only one level under a chapter*
|
||||
Lorem Ipsum.
|
||||
```
|
||||
|
|
@ -1,5 +0,0 @@
|
|||
---
|
||||
date: 2016-04-09T16:50:16+02:00
|
||||
title: Multi-languages - i18n
|
||||
weight: 100
|
||||
---
|
||||
76
exampleSite/content/cont/i18n/_index.md
Normal file
76
exampleSite/content/cont/i18n/_index.md
Normal file
|
|
@ -0,0 +1,76 @@
|
|||
---
|
||||
date: 2016-04-09T16:50:16+02:00
|
||||
title: Multilingual and i18n
|
||||
weight: 30
|
||||
---
|
||||
|
||||
**Learn theme** is fully compatible with Hugo multilingual mode.
|
||||
|
||||
It provides:
|
||||
|
||||
- Translation strings for default values (English and French). Feel free to contribute !
|
||||
- Automatic menu generation from multilingual content
|
||||
- In-browser language switching
|
||||
|
||||
|
||||
|
||||
## Basic configuration
|
||||
|
||||
After learning [how Hugo handle multilingual websites](https://gohugo.io/content-management/multilingual), define your languages in your `config.toml` file.
|
||||
|
||||
For example with current French and English website.
|
||||
|
||||
```toml
|
||||
# English is the default language
|
||||
defaultContentLanguage = "en"
|
||||
# Force to have /en/my-page and /fr/my-page routes, even for default language.
|
||||
defaultContentLanguageInSubdir= true
|
||||
|
||||
[Languages]
|
||||
[Languages.en]
|
||||
title = "Documentation for Hugo Learn Theme"
|
||||
weight = 1
|
||||
languageName = "English"
|
||||
|
||||
[Languages.fr]
|
||||
title = "Documentation du thème Hugo Learn"
|
||||
weight = 2
|
||||
languageName = "Français"
|
||||
```
|
||||
|
||||
Then, for each new page, append the *id* of the language to the file.
|
||||
|
||||
- Single file `my-page.md` is split in two files:
|
||||
- in English: `my-page.en.md`
|
||||
- in French: `my-page.fr.md`
|
||||
- Single file `_index.md` is split in two files:
|
||||
- in English: `_index.en.md`
|
||||
- in French: `_index.fr.md`
|
||||
|
||||
{{% notice info %}}
|
||||
Be aware that only translated pages are displayed in menu. It's not replaced with default language content.
|
||||
{{% /notice %}}
|
||||
|
||||
{{% notice tip %}}
|
||||
Use [slug](https://gohugo.io/content-management/multilingual/#translate-your-content) Front Matter parameter to translate urls too.
|
||||
{{% /notice %}}
|
||||
|
||||
## Override translation strings
|
||||
|
||||
Translations strings are used for common default values used in the theme (*Edit this page* button, *Search placeholder* and so on). Translations are available in french and english but you may use another language or want to override default values.
|
||||
|
||||
To override these values, create a new file in your local i18n folder `i18n/<idlanguage>.toml` and inspire yourself from the theme `themes/hugo-theme-learn/i18n/en.toml`
|
||||
|
||||
By the way, as these translations could be used by other people, please take the time to propose a translation by [making a PR](https://github.com/matcornic/hugo-theme-learn/pulls) to the theme !
|
||||
|
||||
## Disable language switching
|
||||
|
||||
Switching the language in the browser is a great feature, but for some reasons you may want to disable it.
|
||||
|
||||
Just set `disableLanguageSwitchingButton=true` in your `config.toml`
|
||||
|
||||
```toml
|
||||
[params]
|
||||
# When using mulitlingual website, disable the switch language button.
|
||||
disableLanguageSwitchingButton = true
|
||||
```
|
||||
BIN
exampleSite/content/cont/i18n/images/i18n-menu.gif
Normal file
BIN
exampleSite/content/cont/i18n/images/i18n-menu.gif
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 24 KiB |
|
|
@ -1,7 +1,7 @@
|
|||
---
|
||||
date: 2016-04-09T16:50:16+02:00
|
||||
title: Markdown syntax
|
||||
weight: 10
|
||||
weight: 15
|
||||
---
|
||||
|
||||
{{% notice note %}}
|
||||
|
|
@ -593,7 +593,7 @@ Content for chapter one.
|
|||
**NOTE** that specific placement of the anchor tag seems to be arbitrary. They are placed inline here since it seems to be unobtrusive, and it works.
|
||||
|
||||
|
||||
## Images
|
||||
## Images {#images}
|
||||
Images have a similar syntax to links but include a preceding exclamation point.
|
||||
|
||||
```markdown
|
||||
|
|
|
|||
109
exampleSite/content/cont/menushortcuts.md
Normal file
109
exampleSite/content/cont/menushortcuts.md
Normal file
|
|
@ -0,0 +1,109 @@
|
|||
---
|
||||
date: 2016-04-09T16:50:16+02:00
|
||||
title: Menu extra shortcuts
|
||||
weight: 25
|
||||
---
|
||||
|
||||
You can define additional menu entries or shortcuts in the navigation menu without any link to content.
|
||||
|
||||
## Basic configuration
|
||||
|
||||
Edit the website configuration `config.toml` and add a `[[menu.shortcuts]]` entry for each link your want to add.
|
||||
|
||||
Example from the current website:
|
||||
|
||||
[[menu.shortcuts]]
|
||||
name = "<i class='fa fa-github'></i> Github repo"
|
||||
identifier = "ds"
|
||||
url = "https://github.com/matcornic/hugo-theme-learn"
|
||||
weight = 10
|
||||
|
||||
[[menu.shortcuts]]
|
||||
name = "<i class='fa fa-camera'></i> Showcases"
|
||||
url = "/showcase"
|
||||
weight = 11
|
||||
|
||||
[[menu.shortcuts]]
|
||||
name = "<i class='fa fa-bookmark'></i> Hugo Documentation"
|
||||
identifier = "hugodoc"
|
||||
url = "https://gohugo.io/"
|
||||
weight = 20
|
||||
|
||||
[[menu.shortcuts]]
|
||||
name = "<i class='fa fa-bullhorn'></i> Credits"
|
||||
url = "/credits"
|
||||
weight = 30
|
||||
|
||||
By default, shortcuts are preceded by a title. This title can be disabled by setting `disableShortcutsTitle=true`.
|
||||
However, if you want to keep the title but change its value, it can be overriden by changing your local i18n translation string configuration.
|
||||
|
||||
For example, in your local `i18n/en.toml` file, add the following content
|
||||
|
||||
[Shortcuts-Title]
|
||||
other = "<Your value>"
|
||||
|
||||
Read more about [hugo menu](https://gohugo.io/extras/menus/) and [hugo i18n translation strings](https://gohugo.io/content-management/multilingual/#translation-of-strings)
|
||||
|
||||
## Configuration for Multilingual mode {#i18n}
|
||||
|
||||
When using a multilingual website, you can set different menus for each language. In the `config.toml` file, prefix your menu configuration by `Languages.<language-id>`.
|
||||
|
||||
|
||||
Example from the current website:
|
||||
|
||||
[Languages]
|
||||
[Languages.en]
|
||||
title = "Documentation for Hugo Learn Theme"
|
||||
weight = 1
|
||||
languageName = "English"
|
||||
|
||||
[[Languages.en.menu.shortcuts]]
|
||||
name = "<i class='fa fa-github'></i> Github repo"
|
||||
identifier = "ds"
|
||||
url = "https://github.com/matcornic/hugo-theme-learn"
|
||||
weight = 10
|
||||
|
||||
[[Languages.en.menu.shortcuts]]
|
||||
name = "<i class='fa fa-camera'></i> Showcases"
|
||||
url = "/showcase"
|
||||
weight = 11
|
||||
|
||||
[[Languages.en.menu.shortcuts]]
|
||||
name = "<i class='fa fa-bookmark'></i> Hugo Documentation"
|
||||
identifier = "hugodoc"
|
||||
url = "https://gohugo.io/"
|
||||
weight = 20
|
||||
|
||||
[[Languages.en.menu.shortcuts]]
|
||||
name = "<i class='fa fa-bullhorn'></i> Credits"
|
||||
url = "/credits"
|
||||
weight = 30
|
||||
|
||||
[Languages.fr]
|
||||
title = "Documentation du thème Hugo Learn"
|
||||
weight = 2
|
||||
languageName = "Français"
|
||||
|
||||
[[Languages.fr.menu.shortcuts]]
|
||||
name = "<i class='fa fa-github'></i> Repo Github"
|
||||
identifier = "ds"
|
||||
url = "https://github.com/matcornic/hugo-theme-learn"
|
||||
weight = 10
|
||||
|
||||
[[Languages.fr.menu.shortcuts]]
|
||||
name = "<i class='fa fa-camera'></i> Vitrine"
|
||||
url = "/showcase"
|
||||
weight = 11
|
||||
|
||||
[[Languages.fr.menu.shortcuts]]
|
||||
name = "<i class='fa fa-bookmark'></i> Documentation Hugo"
|
||||
identifier = "hugodoc"
|
||||
url = "https://gohugo.io/"
|
||||
weight = 20
|
||||
|
||||
[[Languages.fr.menu.shortcuts]]
|
||||
name = "<i class='fa fa-bullhorn'></i> Crédits"
|
||||
url = "/credits"
|
||||
weight = 30
|
||||
|
||||
Read more about [hugo menu](https://gohugo.io/extras/menus/) and [hugo multilingual menus](https://gohugo.io/content-management/multilingual/#menus)
|
||||
|
|
@ -4,123 +4,145 @@ title: Pages organization
|
|||
weight: 5
|
||||
---
|
||||
|
||||
{{%/* children */%}}
|
||||
|
||||
{{%children %}}
|
||||
|
||||
{{%/* children description="true" */%}}
|
||||
|
||||
{{%children description="true" %}}
|
||||
|
||||
{{%/* children depth="3" showhidden="true" */%}}
|
||||
|
||||
{{% children depth="3" showhidden="true" %}}
|
||||
|
||||
{{%/* children style="h2" depth="3" description="true" */%}}
|
||||
|
||||
{{% children style="h2" depth="3" description="true" %}}
|
||||
|
||||
{{%/* children style="div" depth="999" */%}}
|
||||
|
||||
{{% children style="div" depth="999" %}}
|
||||
|
||||
In **Hugo**, pages are the core of your site. Once it is configure, pages are definitely the added value to your documentation site.
|
||||
In **Hugo**, pages are the core of your site. Once it is configured, pages are definitely the added value to your documentation site.
|
||||
|
||||
## Folders
|
||||
|
||||
Organize your site like [any other Hugo project](https://gohugo.io/content/organization/). Typically, you will have a *content* folder with all your pages.
|
||||
|
||||
.
|
||||
└── content
|
||||
├── brace
|
||||
| ├── yourselves.md <- http://example.com/brace/yourselves/
|
||||
| ├── winter
|
||||
| | └── index.md <- http://example.com/brace/winter/
|
||||
| └── index.md <- http://example.com/brace/
|
||||
├── is
|
||||
| ├── coming.md <- http://example.com/is/comming/
|
||||
| └── index.md <- http://example.com/is/
|
||||
└── ned-stark.md <- http://example.com/ned-stark/
|
||||
content
|
||||
├── level-one
|
||||
│ ├── level-two
|
||||
│ │ ├── level-three
|
||||
│ │ │ ├── level-four
|
||||
│ │ │ │ ├── _index.md <-- /level-one/level-two/level-three/level-four
|
||||
│ │ │ │ ├── page-4-a.md <-- /level-one/level-two/level-three/level-four/page-4-a
|
||||
│ │ │ │ ├── page-4-b.md <-- /level-one/level-two/level-three/level-four/page-4-b
|
||||
│ │ │ │ └── page-4-c.md <-- /level-one/level-two/level-three/level-four/page-4-c
|
||||
│ │ │ ├── _index.md <-- /level-one/level-two/level-three
|
||||
│ │ │ ├── page-3-a.md <-- /level-one/level-two/level-three/page-3-a
|
||||
│ │ │ ├── page-3-b.md <-- /level-one/level-two/level-three/page-3-b
|
||||
│ │ │ └── page-3-c.md <-- /level-one/level-two/level-three/page-3-c
|
||||
│ │ ├── _index.md <-- /level-one/level-two
|
||||
│ │ ├── page-2-a.md <-- /level-one/level-two/page-2-a
|
||||
│ │ ├── page-2-b.md <-- /level-one/level-two/page-2-b
|
||||
│ │ └── page-2-c.md <-- /level-one/level-two/page-2-c
|
||||
│ ├── _index.md <-- /level-one
|
||||
│ ├── page-1-a.md <-- /level-one/page-1-a
|
||||
│ ├── page-1-b.md <-- /level-one/page-1-b
|
||||
│ └── page-1-c.md <-- /level-one/page-1-c
|
||||
├── _index.md <-- /
|
||||
└── page-top.md <-- /page-top
|
||||
|
||||
{{% notice warning %}}
|
||||
At that time, **Hugo-theme-learn** supports **only one level** inside a chapter. So you **can't** have http://example.com/chapter1/chapter1.1/page
|
||||
{{% notice note %}}
|
||||
`_index.md` is required in each folder, it’s your “folder home page”
|
||||
{{% /notice %}}
|
||||
|
||||
## Types
|
||||
|
||||
**Hugo-theme-learn** defines two types of pages. *Default* and *Chapter*.
|
||||
**Hugo-theme-learn** defines two types of pages. *Default* and *Chapter*. Both can be used at any level of the documentation, the only difference being layout display.
|
||||
|
||||
A *Chapter* is a page that contains another page. Commonly, it contains a simple title and a catch line to define content that can be found under it.
|
||||
A **Chapter** displays a page meant to be used as introduction for a set of child pages. Commonly, it contains a simple title and a catch line to define content that can be found under it.
|
||||
You can define any HTML as prefix for the menu. In the example below, it's just a number but that could be an [icon](https://fortawesome.github.io/Font-Awesome/).
|
||||
|
||||
|
||||
|
||||
|
||||
---
|
||||
title: Basics
|
||||
chapter: true
|
||||
weight: 0
|
||||
icon: "<b>1. </b>"
|
||||
---
|
||||
```markdown
|
||||
+++
|
||||
title = "Basics"
|
||||
chapter = true
|
||||
weight = 5
|
||||
pre = "<b>1. </b>"
|
||||
+++
|
||||
|
||||
### Chapter 1
|
||||
|
||||
# Basics
|
||||
|
||||
Discover what this Hugo theme is all about and the core-concepts behind it.
|
||||
```
|
||||
|
||||
A **Default** page is any other content page.
|
||||
|
||||
A *Default* page is any other content page.
|
||||
|
||||
|
||||
|
||||
---
|
||||
title: What is this Hugo theme ?
|
||||
weight: 5
|
||||
---
|
||||
|
||||
**Hugo-theme-learn** is a theme for [Hugo](https://gohugo.io/), a fast and modern static website engine written in Go. Where Hugo is often used for blogs, this theme is fully designed for **technical documentation**.
|
||||
|
||||
This theme is a partial porting of the [Learn theme](http://learn.getgrav.org/) of [Grav](https://getgrav.org/), a modern flat-file CMS written in PHP.
|
||||
|
||||
This current documentation has been statically generated with Hugo with a simple command : `hugo -t hugo-theme-learn`
|
||||
|
||||
|
||||
|
||||
To tell **Hugo-theme-learn** to consider a page as a chapter, just the name of your file as `_index.md`.
|
||||
|
||||
**Hugo-theme-learn** provides [archetypes]({{< relref "cont/archetypes.md" >}}) to help you create this kind of pages.
|
||||
|
||||
## Front Matter
|
||||
|
||||
Each Hugo page has to define a [Front Matter](https://gohugo.io/content/front-matter/) in *yaml*, *toml* or *json*.
|
||||
|
||||
**Hugo-theme-learn** uses the following parameters on top of the existing ones :
|
||||
|
||||
|
||||
```toml
|
||||
+++
|
||||
# Set to true, it automatically generates a table of contents, available in the top of the screen.
|
||||
toc = "false"
|
||||
# Override path to previous page. This theme automatically generates previous arrows
|
||||
prev = ""
|
||||
# Override path to next page. This theme automatically generates next arrows
|
||||
next = ""
|
||||
# Set HTML in this parameter. The chapter title in the menu will be prefixed by this. Useful for icons.
|
||||
icon: ""
|
||||
title = "Installation"
|
||||
weight = 15
|
||||
+++
|
||||
```
|
||||
|
||||
## Ordering
|
||||
The following steps are here to help you initialize your new website. If you don't know Hugo at all, we strongly suggest you to train by following this [great documentation for beginners](https://gohugo.io/overview/quickstart/).
|
||||
|
||||
## Create your project
|
||||
|
||||
Hugo provides a `new` command to create a new website.
|
||||
|
||||
```
|
||||
hugo new site <new_project>
|
||||
```
|
||||
|
||||
To tell **Hugo-theme-learn** to consider a page as a chapter, set `chapter=true` in the Front Matter of the page.
|
||||
|
||||
**Hugo-theme-learn** provides [archetypes]({{< relref "cont/archetypes.md" >}}) to help you create this kind of pages.
|
||||
|
||||
## Front Matter configuration
|
||||
|
||||
Each Hugo page has to define a [Front Matter](https://gohugo.io/content/front-matter/) in *yaml*, *toml* or *json*.
|
||||
|
||||
**Hugo-theme-learn** uses the following parameters on top of Hugo ones :
|
||||
|
||||
```toml
|
||||
+++
|
||||
# Table of content (toc) is enabled by default. Set this parameter to true to disable it.
|
||||
# Note: Toc is always disabled for chapter pages
|
||||
disableToc = "false"
|
||||
# The title of the page in menu will be prefixed by this HTML content
|
||||
pre = ""
|
||||
# The title of the page in menu will be postfixed by this HTML content
|
||||
post = ""
|
||||
# Set the page as a chapter, changing the way it's displayed
|
||||
chapter = false
|
||||
# Hide a menu entry by setting this to true
|
||||
hidden = false
|
||||
# Display name of this page modifier. If set, it will be displayed in the footer.
|
||||
LastModifierDisplayName = ""
|
||||
# Email of this page modifier. If set with LastModifierDisplayName, it will be displayed in the footer
|
||||
LastModifierEmail = ""
|
||||
+++
|
||||
```
|
||||
|
||||
### Add icon to a menu entry
|
||||
|
||||
In the page frontmatter, add a `pre` param to insert any HTML code before the menu label. The example below uses the Github icon.
|
||||
|
||||
```toml
|
||||
+++
|
||||
title = "Github repo"
|
||||
pre = "<i class='fa fa-github'></i> "
|
||||
+++
|
||||
```
|
||||
|
||||
|
||||
|
||||
### Ordering sibling menu/page entries
|
||||
|
||||
Hugo provides a [flexible way](https://gohugo.io/content/ordering/) to handle order for your pages.
|
||||
|
||||
The simplest way is to use `weight` parameter in the front matter of your page.
|
||||
The simplest way is to set `weight` parameter to a number.
|
||||
|
||||
```toml
|
||||
+++
|
||||
title = "My page"
|
||||
weight = 5
|
||||
+++
|
||||
```
|
||||
|
||||
{{% notice tip %}}
|
||||
Be aware that weight are applied separately for each kind of page (Chapter and Default). It means that if you mix chapter pages and default pages at the same level, the order won't be displayed as expected.
|
||||
## Homepage
|
||||
|
||||
{{% /notice %}}
|
||||
To configure your home page, you basically have three choices:
|
||||
|
||||
The workaround is to override page type by adding `chapter: false` in the front matter of your Chapter page (identified as `_index.md` file).
|
||||
|
||||
For example, with 5 chapters page and 1 default page at the same level, rename the default page as `_index.md` and add `chapter: false` in the front-matter. It will then be considered as chapter for weight order computing, but content will be displayed as a default page.
|
||||
1. Create an `_index.md` document in `content` folder and fill the file with *Markdown content*
|
||||
2. Create an `index.html` file in the `static` folder and fill the file with *HTML content*
|
||||
3. Configure your server to automatically redirect home page to one your documentation page
|
||||
|
|
|
|||
|
|
@ -1,7 +0,0 @@
|
|||
---
|
||||
title: First Child Page
|
||||
weight: 5
|
||||
disableToc: true
|
||||
---
|
||||
|
||||
ergergerg
|
||||
BIN
exampleSite/content/cont/pages/images/frontmatter-icon.png
Normal file
BIN
exampleSite/content/cont/pages/images/frontmatter-icon.png
Normal file
Binary file not shown.
|
After Width: | Height: | Size: 5.7 KiB |
Binary file not shown.
|
Before Width: | Height: | Size: 252 KiB After Width: | Height: | Size: 243 KiB |
Binary file not shown.
|
Before Width: | Height: | Size: 596 KiB After Width: | Height: | Size: 311 KiB |
|
|
@ -1,7 +0,0 @@
|
|||
---
|
||||
title: Second child pafe
|
||||
weight: 10
|
||||
disableToc: true
|
||||
---
|
||||
|
||||
trrg
|
||||
|
|
@ -1,7 +0,0 @@
|
|||
---
|
||||
title: First child of the second child pafe
|
||||
weight: 10
|
||||
disableToc: true
|
||||
---
|
||||
|
||||
trrregergg
|
||||
|
|
@ -1,95 +0,0 @@
|
|||
---
|
||||
date: 2016-04-09T16:50:16+02:00
|
||||
title: Shortcodes
|
||||
weight: 15
|
||||
---
|
||||
|
||||
Hugo uses Markdown for its simple content format. However, there are a lot of things that Markdown doesn’t support well. You could use pure HTML to expand possibilities.
|
||||
|
||||
But this happens to be a bad idea. Everyone uses Markdown because it's pure and simple to read even non-rendered. You should avoid HTML to keep it as simple as possible.
|
||||
|
||||
To avoid this limitations, Hugo created [shortcodes](https://gohugo.io/extras/shortcodes/). A shortcode is a simple snippet inside a page.
|
||||
|
||||
**Hugo-theme-learn** provides multiple shortcodes on top of existing ones.
|
||||
|
||||
## Attachments
|
||||
|
||||
{{% attachments style="orange" /%}}
|
||||
{{% attachments style="grey" /%}}
|
||||
{{% attachments style="blue" /%}}
|
||||
{{% attachments style="green" /%}}
|
||||
{{% attachments /%}}
|
||||
|
||||
## Notice
|
||||
|
||||
The notice shortcode shows 4 types of disclaimers to help you structure your page.
|
||||
|
||||
### Note
|
||||
|
||||
```
|
||||
{{%/* notice note */%}}
|
||||
A notice disclaimer
|
||||
{{%/* /notice */%}}
|
||||
```
|
||||
|
||||
renders as
|
||||
|
||||
{{% notice note %}}
|
||||
A notice disclaimer
|
||||
{{% /notice %}}
|
||||
|
||||
### Info
|
||||
|
||||
```
|
||||
{{%/* notice info */%}}
|
||||
An information disclaimer
|
||||
{{%/* /notice */%}}
|
||||
```
|
||||
|
||||
renders as
|
||||
|
||||
{{% notice info %}}
|
||||
An information disclaimer
|
||||
{{% /notice %}}
|
||||
|
||||
### Tip
|
||||
|
||||
```
|
||||
{{%/* notice tip */%}}
|
||||
A tip disclaimer
|
||||
{{%/* /notice */%}}
|
||||
```
|
||||
|
||||
renders as
|
||||
|
||||
{{% notice tip %}}
|
||||
A tip disclaimer
|
||||
{{% /notice %}}
|
||||
|
||||
### Warning
|
||||
|
||||
```
|
||||
{{%/* notice warning */%}}
|
||||
An warning disclaimer
|
||||
{{%/* /notice */%}}
|
||||
```
|
||||
|
||||
renders as
|
||||
|
||||
{{% notice warning %}}
|
||||
A warning disclaimer
|
||||
{{% /notice %}}
|
||||
|
||||
## Button
|
||||
|
||||
Button is a just a clickable button with optional icon.
|
||||
|
||||
```
|
||||
{{%/* button href="https://getgrav.org/" */%}}Get Grav{{%/* /button */%}}
|
||||
{{%/* button href="https://getgrav.org/" icon="fa fa-play" */%}}Get Grav with icon{{%/* /button */%}}
|
||||
{{%/* button href="https://getgrav.org/" icon="fa fa-share" icon-position="right" */%}}Get Grav with icon right{{%/* /button */%}}
|
||||
```
|
||||
|
||||
{{% button href="https://getgrav.org/" %}}Get Grav{{% /button %}}
|
||||
{{% button href="https://getgrav.org/" icon="fa fa-play" %}}Get Grav with icon{{% /button %}}
|
||||
{{% button href="https://getgrav.org/" icon="fa fa-share" icon-position="right" %}}Get Grav with icon right{{% /button %}}
|
||||
16
exampleSite/content/shortcodes/_index.md
Normal file
16
exampleSite/content/shortcodes/_index.md
Normal file
|
|
@ -0,0 +1,16 @@
|
|||
---
|
||||
date: 2016-04-09T16:50:16+02:00
|
||||
title: Shortcodes
|
||||
pre: "<b>3. </b>"
|
||||
weight: 15
|
||||
---
|
||||
|
||||
Hugo uses Markdown for its simple content format. However, there are a lot of things that Markdown doesn’t support well. You could use pure HTML to expand possibilities.
|
||||
|
||||
But this happens to be a bad idea. Everyone uses Markdown because it's pure and simple to read even non-rendered. You should avoid HTML to keep it as simple as possible.
|
||||
|
||||
To avoid this limitations, Hugo created [shortcodes](https://gohugo.io/extras/shortcodes/). A shortcode is a simple snippet inside a page.
|
||||
|
||||
**Hugo-theme-learn** provides multiple shortcodes on top of existing ones.
|
||||
|
||||
{{%children style="h2" description="true" %}}
|
||||
|
Before Width: | Height: | Size: 18 KiB After Width: | Height: | Size: 18 KiB |
83
exampleSite/content/shortcodes/attachments.md
Normal file
83
exampleSite/content/shortcodes/attachments.md
Normal file
|
|
@ -0,0 +1,83 @@
|
|||
---
|
||||
title: Attachments
|
||||
description : "The Attachments shortcode displays a list of files attached to a page."
|
||||
---
|
||||
|
||||
The Attachments shortcode displays a list of files attached to a page.
|
||||
|
||||
{{% attachments /%}}
|
||||
|
||||
## Usage
|
||||
|
||||
The shortcurt lists files found in a **specific folder**.
|
||||
Currently, it support two implementations for pages
|
||||
|
||||
1. If your page is a markdown file, attachements must be place in a **folder** named like your page and ending with **.files**.
|
||||
|
||||
> * content
|
||||
> * _index.md
|
||||
> * page.files
|
||||
> * attachment.pdf
|
||||
> * page.md
|
||||
|
||||
2. If your page is a **folder**, attachements must be place in a nested **'files'** folder.
|
||||
|
||||
> * content
|
||||
> * _index.md
|
||||
> * page
|
||||
> * index.md
|
||||
> * files
|
||||
> * attachment.pdf
|
||||
|
||||
That's all !
|
||||
|
||||
### Parameters
|
||||
|
||||
| Parameter | Default | Description |
|
||||
|:--|:--|:--|
|
||||
| title | "Attachments" | List's title |
|
||||
| style | "" | Choose between "orange", "grey", "blue" and "green" for nice style |
|
||||
| pattern | ".*" | A regular expressions, used to filter the attachments by file name. <br/><br/>The **pattern** parameter value must be [regular expressions](https://en.wikipedia.org/wiki/Regular_expression).
|
||||
|
||||
For example:
|
||||
|
||||
* To match a file suffix of 'jpg', use **.*jpg** (not *.jpg).
|
||||
* To match file names ending in 'jpg' or 'png', use **.*(jpg|png)**
|
||||
|
||||
### Examples
|
||||
|
||||
#### List of attachments ending in pdf or mp4
|
||||
|
||||
|
||||
{{%/*attachments title="Related files" pattern=".*(pdf|mp4)"/*/%}}
|
||||
|
||||
renders as
|
||||
|
||||
{{%attachments title="Related files" pattern=".*(pdf|mp4)"/%}}
|
||||
|
||||
#### Colored styled box
|
||||
|
||||
{{%/*attachments style="orange" /*/%}}
|
||||
|
||||
renders as
|
||||
|
||||
{{% attachments style="orange" /%}}
|
||||
|
||||
|
||||
{{%/*attachments style="grey" /*/%}}
|
||||
|
||||
renders as
|
||||
|
||||
{{% attachments style="grey" /%}}
|
||||
|
||||
{{%/*attachments style="blue" /*/%}}
|
||||
|
||||
renders as
|
||||
|
||||
{{% attachments style="blue" /%}}
|
||||
|
||||
{{%/*attachments style="green" /*/%}}
|
||||
|
||||
renders as
|
||||
|
||||
{{% attachments style="green" /%}}
|
||||
16
exampleSite/content/shortcodes/button.md
Normal file
16
exampleSite/content/shortcodes/button.md
Normal file
|
|
@ -0,0 +1,16 @@
|
|||
---
|
||||
title: Button
|
||||
description : "Nice buttons on your page."
|
||||
---
|
||||
|
||||
A button is a just a clickable button with optional icon.
|
||||
|
||||
```
|
||||
{{%/* button href="https://getgrav.org/" */%}}Get Grav{{%/* /button */%}}
|
||||
{{%/* button href="https://getgrav.org/" icon="fa fa-play" */%}}Get Grav with icon{{%/* /button */%}}
|
||||
{{%/* button href="https://getgrav.org/" icon="fa fa-share" icon-position="right" */%}}Get Grav with icon right{{%/* /button */%}}
|
||||
```
|
||||
|
||||
{{% button href="https://getgrav.org/" %}}Get Grav{{% /button %}}
|
||||
{{% button href="https://getgrav.org/" icon="fa fa-play" %}}Get Grav with icon{{% /button %}}
|
||||
{{% button href="https://getgrav.org/" icon="fa fa-share" icon-position="right" %}}Get Grav with icon right{{% /button %}}
|
||||
45
exampleSite/content/shortcodes/children/_index.md
Normal file
45
exampleSite/content/shortcodes/children/_index.md
Normal file
|
|
@ -0,0 +1,45 @@
|
|||
---
|
||||
title : Children
|
||||
description : List the child pages of a page
|
||||
---
|
||||
|
||||
Use the children shortcode to list the child pages of a page and the further descendants (children's children). By default, the shortcode displays links to the child pages.
|
||||
|
||||
## Usage
|
||||
|
||||
| Parameter | Default | Description |
|
||||
|:--|:--|:--|
|
||||
| page | _current_ | Specify the page name (section name) to display children for |
|
||||
| style | "li" | Choose the style used to display descendants. It could be any HTML tag name |
|
||||
| showhidden | "false" | When true, child pages hidden from the menu will be displayed |
|
||||
| description | "false" | Allows you to include a short text under each page in the list.<br/>when no description exists for the page, children shortcode takes the first 70 words of your content. [read more info about summaries on gohugo.io](https://gohugo.io/content/summaries/) |
|
||||
| depth | 1 | Enter a number to specify the depth of descendants to display. For example, if the value is 2, the shortcode will display 2 levels of child pages. <br/> **Tips:** set 999 to get all descendants|
|
||||
| sort | none | Sort Children By<br><li><strong>Weight</strong> - to sort on menu order</li><li><strong>Name</strong> - to sort alphabetically on menu label</li><li><strong>Identifier</strong> - to sort alphabetically on identifier set in frontmatter</li><li><strong>URL</strong> - URL</li> |
|
||||
|
||||
## Demo
|
||||
|
||||
{{%/* children */%}}
|
||||
|
||||
{{% children %}}
|
||||
|
||||
{{%/* children description="true" */%}}
|
||||
|
||||
{{%children description="true" %}}
|
||||
|
||||
{{%/* children depth="3" showhidden="true" */%}}
|
||||
|
||||
{{% children depth="3" showhidden="true" %}}
|
||||
|
||||
{{%/* children style="h2" depth="3" description="true" */%}}
|
||||
|
||||
{{% children style="h2" depth="3" description="true" %}}
|
||||
|
||||
{{%/* children style="div" depth="999" */%}}
|
||||
|
||||
{{% children style="div" depth="999" %}}
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
|
@ -0,0 +1,6 @@
|
|||
+++
|
||||
title = "page 1"
|
||||
description = "This is a demo child page"
|
||||
+++
|
||||
|
||||
This is a demo child page
|
||||
|
|
@ -0,0 +1,6 @@
|
|||
+++
|
||||
title = "page 1-1"
|
||||
description = "This is a demo child page"
|
||||
+++
|
||||
|
||||
This is a demo child page
|
||||
|
|
@ -0,0 +1,6 @@
|
|||
+++
|
||||
title = "page 1-1-1"
|
||||
description = "This is a demo child page"
|
||||
+++
|
||||
|
||||
This is a demo child page
|
||||
|
|
@ -0,0 +1,6 @@
|
|||
+++
|
||||
title = "page 1-1-1-1"
|
||||
description = "This is a demo child page"
|
||||
+++
|
||||
|
||||
This is a demo child page
|
||||
|
|
@ -0,0 +1,6 @@
|
|||
+++
|
||||
title = "page 1-1-1-1-1"
|
||||
description = "This is a demo child page"
|
||||
+++
|
||||
|
||||
This is a demo child page
|
||||
11
exampleSite/content/shortcodes/children/children-2/_index.md
Normal file
11
exampleSite/content/shortcodes/children/children-2/_index.md
Normal file
|
|
@ -0,0 +1,11 @@
|
|||
+++
|
||||
title = "page 2"
|
||||
description = ""
|
||||
+++
|
||||
|
||||
Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod
|
||||
tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam,
|
||||
quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo
|
||||
consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse
|
||||
cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non
|
||||
proident, sunt in culpa qui officia deserunt mollit anim id est laborum.
|
||||
|
|
@ -0,0 +1,6 @@
|
|||
+++
|
||||
title = "page test 3"
|
||||
description = "This is a page test"
|
||||
+++
|
||||
|
||||
This is a test 3 demo child page
|
||||
|
|
@ -0,0 +1,6 @@
|
|||
+++
|
||||
title = "page 3"
|
||||
description = "This is a demo child page"
|
||||
+++
|
||||
|
||||
This is a demo child page
|
||||
|
|
@ -0,0 +1,7 @@
|
|||
+++
|
||||
title = "page 4"
|
||||
description = "This is a demo child page"
|
||||
hidden=true
|
||||
+++
|
||||
|
||||
This is a demo child page, not displayed in the menu
|
||||
6
exampleSite/content/shortcodes/children/test.md
Normal file
6
exampleSite/content/shortcodes/children/test.md
Normal file
|
|
@ -0,0 +1,6 @@
|
|||
+++
|
||||
title = "page test"
|
||||
description = "This is a page test"
|
||||
+++
|
||||
|
||||
This is a test demo child page
|
||||
45
exampleSite/content/shortcodes/expand.md
Normal file
45
exampleSite/content/shortcodes/expand.md
Normal file
|
|
@ -0,0 +1,45 @@
|
|||
---
|
||||
title : Expand
|
||||
description : "Displays an expandable/collapsible section of text on your page"
|
||||
---
|
||||
|
||||
The Expand shortcode displays an expandable/collapsible section of text on your page.
|
||||
Here is an example
|
||||
|
||||
{{%expand%}}
|
||||
Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod
|
||||
tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam,
|
||||
quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo
|
||||
consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse
|
||||
cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non
|
||||
proident, sunt in culpa qui officia deserunt mollit anim id est laborum.
|
||||
{{%/expand%}}
|
||||
|
||||
|
||||
## Usage
|
||||
|
||||
|
||||
this shortcode takes exactly one optional parameter to define the text that appears next to the expand/collapse icon. (default is "Expand me...")
|
||||
|
||||
{{%/*expand "Is this docdock theme rocks ?" */%}}Yes !.{{%/* /expand*/%}}
|
||||
|
||||
{{%expand "Is this docdock theme rocks ?" %}}Yes !{{% /expand%}}
|
||||
|
||||
# Demo
|
||||
|
||||
{{%/*expand*/%}}
|
||||
Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod
|
||||
tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam,
|
||||
quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo
|
||||
consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse
|
||||
cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non
|
||||
proident, sunt in culpa qui officia deserunt mollit anim id est laborum.
|
||||
{{%/* /expand*/%}}
|
||||
|
||||
|
||||
{{%expand%}}Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod
|
||||
tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam,
|
||||
quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo
|
||||
consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse
|
||||
cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non
|
||||
proident, sunt in culpa qui officia deserunt mollit anim id est laborum.{{% /expand%}}
|
||||
103
exampleSite/content/shortcodes/mermaid.md
Normal file
103
exampleSite/content/shortcodes/mermaid.md
Normal file
|
|
@ -0,0 +1,103 @@
|
|||
---
|
||||
title : "Mermaid"
|
||||
description : "Generation of diagram and flowchart from text in a similar manner as markdown"
|
||||
---
|
||||
|
||||
[Mermaid](https://mermaidjs.github.io/) is a library helping you to generate diagram and flowcharts from text, in a similar manner as Markdown.
|
||||
|
||||
Just insert your mermaid code in the `mermaid` shortcode and that's it.
|
||||
|
||||
## Flowchart example
|
||||
{{</*mermaid align="left"*/>}}
|
||||
graph LR;
|
||||
A[Hard edge] -->|Link text| B(Round edge)
|
||||
B --> C{Decision}
|
||||
C -->|One| D[Result one]
|
||||
C -->|Two| E[Result two]
|
||||
{{</* /mermaid */>}}
|
||||
|
||||
renders as
|
||||
|
||||
{{<mermaid align="left">}}
|
||||
graph LR;
|
||||
A[Hard edge] -->|Link text| B(Round edge)
|
||||
B --> C{Decision}
|
||||
C -->|One| D[Result one]
|
||||
C -->|Two| E[Result two]
|
||||
{{< /mermaid >}}
|
||||
|
||||
## Sequence example
|
||||
|
||||
{{</*mermaid*/>}}
|
||||
sequenceDiagram
|
||||
participant Alice
|
||||
participant Bob
|
||||
Alice->>John: Hello John, how are you?
|
||||
loop Healthcheck
|
||||
John->John: Fight against hypochondria
|
||||
end
|
||||
Note right of John: Rational thoughts <br/>prevail...
|
||||
John-->Alice: Great!
|
||||
John->Bob: How about you?
|
||||
Bob-->John: Jolly good!
|
||||
{{</* /mermaid */>}}
|
||||
|
||||
renders as
|
||||
|
||||
{{<mermaid>}}
|
||||
sequenceDiagram
|
||||
participant Alice
|
||||
participant Bob
|
||||
Alice->>John: Hello John, how are you?
|
||||
loop Healthcheck
|
||||
John->John: Fight against hypochondria
|
||||
end
|
||||
Note right of John: Rational thoughts <br/>prevail...
|
||||
John-->Alice: Great!
|
||||
John->Bob: How about you?
|
||||
Bob-->John: Jolly good!
|
||||
{{< /mermaid >}}
|
||||
|
||||
## GANTT Example
|
||||
|
||||
{{</*mermaid*/>}}
|
||||
gantt
|
||||
dateFormat YYYY-MM-DD
|
||||
title Adding GANTT diagram functionality to mermaid
|
||||
section A section
|
||||
Completed task :done, des1, 2014-01-06,2014-01-08
|
||||
Active task :active, des2, 2014-01-09, 3d
|
||||
Future task : des3, after des2, 5d
|
||||
Future task2 : des4, after des3, 5d
|
||||
section Critical tasks
|
||||
Completed task in the critical line :crit, done, 2014-01-06,24h
|
||||
Implement parser and jison :crit, done, after des1, 2d
|
||||
Create tests for parser :crit, active, 3d
|
||||
Future task in critical line :crit, 5d
|
||||
Create tests for renderer :2d
|
||||
Add to mermaid :1d
|
||||
{{</* /mermaid */>}}
|
||||
|
||||
|
||||
render as
|
||||
|
||||
{{<mermaid>}}
|
||||
gantt
|
||||
dateFormat YYYY-MM-DD
|
||||
title Adding GANTT diagram functionality to mermaid
|
||||
section A section
|
||||
Completed task :done, des1, 2014-01-06,2014-01-08
|
||||
Active task :active, des2, 2014-01-09, 3d
|
||||
Future task : des3, after des2, 5d
|
||||
Future task2 : des4, after des3, 5d
|
||||
section Critical tasks
|
||||
Completed task in the critical line :crit, done, 2014-01-06,24h
|
||||
Implement parser and jison :crit, done, after des1, 2d
|
||||
Create tests for parser :crit, active, 3d
|
||||
Future task in critical line :crit, 5d
|
||||
Create tests for renderer :2d
|
||||
Add to mermaid :1d
|
||||
{{</mermaid>}}
|
||||
|
||||
|
||||
|
||||
62
exampleSite/content/shortcodes/notice.md
Normal file
62
exampleSite/content/shortcodes/notice.md
Normal file
|
|
@ -0,0 +1,62 @@
|
|||
---
|
||||
title: Notice
|
||||
description : "Disclaimers to help you structure your page"
|
||||
---
|
||||
|
||||
The notice shortcode shows 4 types of disclaimers to help you structure your page.
|
||||
|
||||
### Note
|
||||
|
||||
```
|
||||
{{%/* notice note */%}}
|
||||
A notice disclaimer
|
||||
{{%/* /notice */%}}
|
||||
```
|
||||
|
||||
renders as
|
||||
|
||||
{{% notice note %}}
|
||||
A notice disclaimer
|
||||
{{% /notice %}}
|
||||
|
||||
### Info
|
||||
|
||||
```
|
||||
{{%/* notice info */%}}
|
||||
An information disclaimer
|
||||
{{%/* /notice */%}}
|
||||
```
|
||||
|
||||
renders as
|
||||
|
||||
{{% notice info %}}
|
||||
An information disclaimer
|
||||
{{% /notice %}}
|
||||
|
||||
### Tip
|
||||
|
||||
```
|
||||
{{%/* notice tip */%}}
|
||||
A tip disclaimer
|
||||
{{%/* /notice */%}}
|
||||
```
|
||||
|
||||
renders as
|
||||
|
||||
{{% notice tip %}}
|
||||
A tip disclaimer
|
||||
{{% /notice %}}
|
||||
|
||||
### Warning
|
||||
|
||||
```
|
||||
{{%/* notice warning */%}}
|
||||
An warning disclaimer
|
||||
{{%/* /notice */%}}
|
||||
```
|
||||
|
||||
renders as
|
||||
|
||||
{{% notice warning %}}
|
||||
A warning disclaimer
|
||||
{{% /notice %}}
|
||||
|
|
@ -1,6 +1,7 @@
|
|||
---
|
||||
title: Vitrine
|
||||
disableToc: true
|
||||
slug: vitrine
|
||||
---
|
||||
|
||||
#### [TAT](https://ovh.github.io/tat/overview/) par OVH
|
||||
|
|
|
|||
Loading…
Reference in a new issue