diff options
| author | zeripath <art27@cantab.net> | 2020-01-20 16:14:03 +0000 |
|---|---|---|
| committer | techknowlogick <techknowlogick@gitea.io> | 2020-01-20 11:14:03 -0500 |
| commit | 27c6b8fc07eab2dd579b94cd92136738ace61706 (patch) | |
| tree | e24999771cfbb382a078fb053793742a729901e0 /docs | |
| parent | 1920e5bcafc70dd124dc6f96607d8640e72b8b82 (diff) | |
| download | gitea-27c6b8fc07eab2dd579b94cd92136738ace61706.tar.gz gitea-27c6b8fc07eab2dd579b94cd92136738ace61706.zip | |
Add documentation to add Mermaid.js to Gitea (#9872)
* Add documentation to add mermaid to Gitea
* Update documentation
Co-authored-by: Antoine GIRARD <sapk@users.noreply.github.com>
Diffstat (limited to 'docs')
| -rw-r--r-- | docs/content/doc/advanced/customizing-gitea.en-us.md | 41 |
1 files changed, 39 insertions, 2 deletions
diff --git a/docs/content/doc/advanced/customizing-gitea.en-us.md b/docs/content/doc/advanced/customizing-gitea.en-us.md index 80aa09f5f3..25859851b9 100644 --- a/docs/content/doc/advanced/customizing-gitea.en-us.md +++ b/docs/content/doc/advanced/customizing-gitea.en-us.md @@ -100,6 +100,45 @@ Apart from `extra_links.tmpl` and `extra_tabs.tmpl`, there are other useful temp - `body_outer_post.tmpl`, before the bottom `<footer>` element. - `footer.tmpl`, right before the end of the `<body>` tag, a good place for additional Javascript. +#### Example: Mermaid.js + +If you would like to add [mermaid.js](https://mermaid-js.github.io/) support to Gitea's markdown you simply add: + +```html +{{if .RequireHighlightJS}} +<script src="https://unpkg.com/mermaid@8.4.5/dist/mermaid.min.js"></script> +<!-- or wherever you have placed it --> +<script>mermaid.init(".language-mermaid")</script> +{{end}} +``` + +to `custom/footer.tmpl`. You then can add blocks +like below to your markdown: + + ```mermaid + stateDiagram + [*] --> Active + + state Active { + [*] --> NumLockOff + NumLockOff --> NumLockOn : EvNumLockPressed + NumLockOn --> NumLockOff : EvNumLockPressed + -- + [*] --> CapsLockOff + CapsLockOff --> CapsLockOn : EvCapsLockPressed + CapsLockOn --> CapsLockOff : EvCapsLockPressed + -- + [*] --> ScrollLockOff + ScrollLockOff --> ScrollLockOn : EvCapsLockPressed + ScrollLockOn --> ScrollLockOff : EvCapsLockPressed + } + ``` + +If you want to use Mermaid.js outside of markdown, e.g. in other templates or HTML files, +you would need to remove `{{if .RequireHighlightJS}}` and `{{end}}`. + +Mermaid will detect and use tags with `class="language-mermaid"`. + ## Customizing Gitea mails The `custom/templates/mail` folder allows changing the body of every mail of Gitea. @@ -112,8 +151,6 @@ full path structure matching source. Any statement contained inside `{{` and `}}` are Gitea's template syntax and shouldn't be touched without fully understanding these components. - - ## Adding Analytics to Gitea Google Analytics, Matomo (previously Piwik), and other analytics services can be added to Gitea. To add the tracking code, refer to the `Other additions to the page` section of this document, and add the JavaScript to the `custom/templates/custom/header.tmpl` file. |