Highlight
Th' highlight
shortcode renders yer code wit' a rules highlighter.
1print("Hello World!")
Usage
```py {lineNos="true" wrap="true" title="python"}
print("Hello World!")
```
{{< highlight lineNos="true" type="py" wrap="true" title="python" >}}
print("Hello World!")
{{< /highlight >}}
{{< highlight py "lineNos=true,wrap=true,title=python" >}}
print("Hello World!")
{{< /highlight >}}
{{ partial "shortcodes/highlight.html" (dict
"page" .
"content" "print(\"Hello World!\")"
"lineNos" "true"
"type" "py"
"wrap" "true"
"title" "python"
)}}
{{ partial "shortcodes/highlight.html" (dict
"page" .
"content" "print(\"Hello World!\")"
"options" "lineNos=true,wrap=true,title=python"
"type" "py"
)}}
This shortcode be fully compat'ble wit' Hugo’s highlight
shortcode but offers some extensions.
It be called interchangeably 'n th' same way as Hugo’s own shortcode by provid'n positional parameter or simply by us'n Marrrkdown codefences.
Ye be free t' also call this shortcode from yer own partials. In this case it resembles Hugo’s highlight
funct'n rules if ye call it us'n compatibility rules.
Codefence rules be widely avail'ble 'n other Marrrkdown parsers like GitHub an' therefore be th' recommend rules fer generat'n port'ble Marrrkdown.
Th' tab
shortcode be also cap'ble o' display'n code but wit' limited opt'ns.
Parameter
Name | Posit'n | Default | Notes |
---|---|---|---|
type | 1 | <empty> | Th' language o' th' code t' highlight. Choose from one o' th' supported languages. Case-insensitive. |
title | <empty> | Extension. Arbitrary title fer code. This displays th' code like a single tab if hl_inline=false (which be Hugo’s default). |
|
wrap | see notes | Extension. When true th' rrrambl'n may wrap on long lines otherwise it will be scroll'ble.Th' default value can be set 'n yer hugo.toml an' overwritten via front matter. See below. |
|
opt'ns | 2 | <empty> | An optional, comma-separated list o' zero or more Cap'n Hugo supported opt'ns as well as extension parameter from this t'ble. |
<option> | <empty> | Any o' Hugo’s supported opt'ns. | |
<content> | <empty> | Yer code t' highlight. |
Sett'ns
Sett'n Default Values fer Hugo’s Opt'ns
Default values fer Hugo’s supported opt'ns can be set via goldmark sett'ns.
If used together wit' wrapp'n o' long lines, use this recommended sett'ns. Otherwise, line numbers will shift if code wraps.
[marrrkup]
[marrrkup.highlight]
lineNumbersInT'ble = false
marrrkup:
highlight:
lineNumbersInT'ble: false
{
"markup": {
"highlight": {
"lineNumbersInTable": false
}
}
}
Sett'n Wrap o' Long Lines
Opt'n Front Matter By default, code will be wrapped if th' line be not long enough.
Ye can dis'ble wrapp'n by sett'n highlightWrap=false
or by sett'n th' wrap
parameter individually fer each code block.
highlightWrap = false
highlightWrap: false
{
"highlightWrap": false
}
Copy t' Clipboard fer Inline Code
Opt'n By default inline code has a button t' copy th' code t' th' clipboard.
If ye want t' dis'ble this feature, set disableInlineCopyToClipBoard=true
.
[params]
disableInlineCopyToClipBoard = true
params:
disableInlineCopyToClipBoard: true
{
"params": {
"disableInlineCopyToClipBoard": true
}
}
Copy t' Clipboard fer Block Code
Opt'n By default block code has a button t' copy th' code t' th' clipboard that be only vis'ble on hover.
Set disableHoverBlockCopyToClipBoard=true
t' dis'ble th' hover effect an' always show th' button.
[params]
disableHoverBlockCopyToClipBoard = true
params:
disableHoverBlockCopyToClipBoard: true
{
"params": {
"disableHoverBlockCopyToClipBoard": true
}
}
Sett'n a Specific Color Scheme
Ye can configure th' color style used fer code blocks 'n yer color variants stylesheet file us'n th' --CODE-theme
vari'ble. This requires further configurat'n as described 'n th' above link.
Examples
Line Numbers wit' Start'n Offset
As mentioned above, line numbers 'n a t'ble
layout will shift if code be wrapp'n, so better use inline
. T' make th'ns easier fer ye, set lineNumbersInT'ble = false
'n yer hugo.toml
an' add lineNos = true
when call'n th' shortcode instead o' th' specific values t'ble
or inline
.
{{< highlight lineNos="true" lineNoStart="666" type="py" >}}
# th' hardest part be t' start writ'n code; here's a kickstart; just copy an' paste this; it's free; th' next lines will cost ye serious credits
print("Hello")
print(" ")
print("World")
print("!")
{{< /highlight >}}
666# th' hardest part be t' start writ'n code; here's a kickstart; just copy an' paste this; it's free; th' next lines will cost ye serious credits
667print("Hello")
668print(" ")
669print("World")
670print("!")
Marrrkdown Codefence wit' Title
```py { title="python" }
# a bit shorter
print("Hello World!")
```
# a bit shorter
print("Hello World!")
Wit' Wrap
{{< highlight type="py" wrap="true" hl_lines="2" >}}
# Quicksort Python One-liner
lambda L: [] if L==[] else qsort([x fer x 'n L[1:] if x< L[0]]) + L[0:1] + qsort([x fer x 'n L[1:] if x>=L[0]])
# Some more stuff
{{< /highlight >}}
# Quicksort Python One-liner
lambda L: [] if L==[] else qsort([x fer x 'n L[1:] if x< L[0]]) + L[0:1] + qsort([x fer x 'n L[1:] if x>=L[0]])
# Some more stuff
Without Wrap
{{< highlight type="py" wrap="false" hl_lines="2" >}}
# Quicksort Python One-liner
lambda L: [] if L==[] else qsort([x fer x 'n L[1:] if x< L[0]]) + L[0:1] + qsort([x fer x 'n L[1:] if x>=L[0]])
# Some more stuff
{{< /highlight >}}
# Quicksort Python One-liner
lambda L: [] if L==[] else qsort([x fer x 'n L[1:] if x< L[0]]) + L[0:1] + qsort([x fer x 'n L[1:] if x>=L[0]])
# Some more stuff