Initial commit
This commit is contained in:
113
themes/reveal-hugo/exampleSite/content/hugo-hl-example/_index.md
Normal file
113
themes/reveal-hugo/exampleSite/content/hugo-hl-example/_index.md
Normal file
@ -0,0 +1,113 @@
|
||||
+++
|
||||
title = "Hugo highlighting example"
|
||||
outputs = ["Reveal"]
|
||||
|
||||
[reveal_hugo]
|
||||
theme = "simple"
|
||||
+++
|
||||
|
||||
## Hugo Highlighter Presentation
|
||||
|
||||
This is an example of a presentation using Hugo's compile-time syntax highlighter.
|
||||
|
||||
---
|
||||
|
||||
Reveal.js uses Javascript for syntax highlighting (via Highlight.js). This might slow the presentation down if many slides contain code.
|
||||
|
||||
---
|
||||
|
||||
Hugo has a built-in [compile-time highlighter](https://gohugo.io/content-management/syntax-highlighting/), and it's lightning fast too!
|
||||
|
||||
---
|
||||
|
||||
You can enable it using the `highlight` shortcode.
|
||||
|
||||
{{< highlight go >}}
|
||||
{{</* highlight go */>}}
|
||||
|
||||
package main
|
||||
|
||||
import "fmt"
|
||||
|
||||
func main() {
|
||||
fmt.Println("Hello world!")
|
||||
}
|
||||
|
||||
{{</* /highlight */>}}
|
||||
{{< /highlight >}}
|
||||
|
||||
---
|
||||
|
||||
Several options are supported, check [Hugo's documentation](https://gohugo.io/content-management/syntax-highlighting/).
|
||||
|
||||
{{< highlight go "style=github,linenos=inline,hl_lines=8" >}}
|
||||
{{</* highlight go "style=github,linenos=inline,hl_lines=6" */>}}
|
||||
|
||||
package main
|
||||
|
||||
import "fmt"
|
||||
|
||||
func main() {
|
||||
fmt.Println("Hello world!")
|
||||
}
|
||||
|
||||
{{</* /highlight */>}}
|
||||
{{< / highlight >}}
|
||||
|
||||
---
|
||||
|
||||
You can also use Hugo's highlighter in markdown code fences,
|
||||
by putting this in `config.toml`:
|
||||
|
||||
{{< highlight toml "style=github" >}}
|
||||
|
||||
# use Hugo's hl in markdown (with or without a language tag)
|
||||
[markup.highlight]
|
||||
codeFences = true
|
||||
style = "github"
|
||||
|
||||
{{< /highlight >}}
|
||||
|
||||
(This can only be enabled globally for all presentations.)
|
||||
|
||||
---
|
||||
|
||||
- Highlight.js is automatically disabled in code blocks highlighted by Hugo.
|
||||
- The two highlighters can be even mixed.
|
||||
|
||||
{{< highlight go >}}
|
||||
package main
|
||||
|
||||
import "fmt"
|
||||
|
||||
func main() {
|
||||
fmt.Println("Hello world!")
|
||||
}
|
||||
{{< / highlight >}}
|
||||
|
||||
```go
|
||||
package main
|
||||
|
||||
import "fmt"
|
||||
|
||||
func main() {
|
||||
fmt.Println("Hello world!")
|
||||
}
|
||||
```
|
||||
|
||||
---
|
||||
|
||||
If you don't need highlight.js at all, you can prevent it from loading.
|
||||
|
||||
{{< highlight toml "style=github" >}}
|
||||
|
||||
# This works both in config.toml and a presentation's front
|
||||
# matter. Default plugins include highlight.js, so disable them
|
||||
# and load those that we want manually.
|
||||
|
||||
[params.reveal_hugo]
|
||||
load_default_plugins = false
|
||||
plugins = [
|
||||
"reveal-js/plugin/zoom-js/zoom.js",
|
||||
"reveal-js/plugin/notes/notes.js",
|
||||
]
|
Reference in New Issue
Block a user