Shiloh/githaven
Shiloh/githaven
1
0
Fork 1
Code Issues Pull Requests Actions 1 Packages Projects Releases Wiki Activity

Add documentation to add Mermaid.js to Gitea (#9872)

Browse Source 
* Add documentation to add mermaid to Gitea

* Update documentation

Co-authored-by: Antoine GIRARD <sapk@users.noreply.github.com>
This commit is contained in:
zeripath 2020-01-20 16:14:03 +00:00 committed by techknowlogick
parent 1920e5bcaf
commit 27c6b8fc07
1 changed files with 39 additions and 2 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

41
docs/content/doc/advanced/customizing-gitea.en-us.md
View File

@ -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. - `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. - `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 ## Customizing Gitea mails
The `custom/templates/mail` folder allows changing the body of every mail of Gitea. 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 Any statement contained inside `{{` and `}}` are Gitea's template
syntax and shouldn't be touched without fully understanding these components. syntax and shouldn't be touched without fully understanding these components.
## Adding Analytics to Gitea ## 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. 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.