There already seems to be some discussion, like here .
In markdown, we may draw a table like this,
| 0 | 1 | 2 | 3 | 4 | 5 | 6 | 7 | 8 | 9 |
|---|---|---|---|---|---|---|---|---|---|
| A | B | C | D | E | F | G | H | I | J |
| K | L | M | N | O | P | Q | U | R | S |
and obtain this.
0
1
2
3
4
5
6
7
8
9
A
B
C
D
E
F
G
H
I
J
K
L
M
N
O
P
Q
U
R
S
The resulting html will look like bellow minus the caption tag .
<table>
<caption>Table 1. Caption the table.</caption>
<thead>
<tr>
<th>0</th><th>1</th><th>2</th><th>3</th><th>4</th><th>5</th><th>6</th><th>7</th><th>8</th><th>9</th>
</tr>
</thead>
<tbody>
<tr>
<td>A</td><td>B</td><td>C</td><td>D</td><td>E</td><td>F</td><td>G</td><td>H</td><td>I</td><td>J</td>
</tr>
<tr>
<td>K</td><td>L</td><td>M</td><td>N</td><td>O</td><td>P</td><td>Q</td><td>U</td><td>R</td><td>S</td>
</tr>
</tbody>
</table>
Is there a way to achieve this with just markdown or something Hugo (I am new) specific? Maybe something like this because I have seen it elsewhere.
| 0 | 1 | 2 | 3 | 4 | 5 | 6 | 7 | 8 | 9 |
|---|---|---|---|---|---|---|---|---|---|
| A | B | C | D | E | F | G | H | I | J |
| K | L | M | N | O | P | Q | U | R | S |
[Table 1. Caption this table.]
Table 1. Caption the table.
0 1 2 3 4 5 6 7 8 9
A B C D E F G H I J
K L M N O P Q U R S
Yes. Use a table render hook. See docs.
I looked at:
I am very new to Hugo and it is not obvious to me what would be the best way. Could you maybe give me an example of how I could get what I want?
See https://gohugo.io/content-management/markdown-attributes/#block-elements .
[markup.goldmark.parser.attribute]
block = true
See https://gohugo.io/render-hooks/tables/#example .
layouts/_markup/render-table.html
<table
{{- range $k, $v := .Attributes }}
{{- if and $v (ne $k "caption") }}
{{- printf " %s=%q" $k $v | safeHTMLAttr }}
{{- end }}
{{- end }}>
{{- with .Attributes.caption }}
<caption>{{ . | $.Page.RenderString }}</caption>
{{- end }}
<thead>
{{- range .THead }}
<tr>
{{- range . }}
<th
{{- with .Alignment }}
{{- printf " style=%q" (printf "text-align: %s" .) | safeHTMLAttr }}
{{- end -}}
>
{{- .Text -}}
</th>
{{- end }}
</tr>
{{- end }}
</thead>
<tbody>
{{- range .TBody }}
<tr>
{{- range . }}
<td
{{- with .Alignment }}
{{- printf " style=%q" (printf "text-align: %s" .) | safeHTMLAttr }}
{{- end -}}
>
{{- .Text -}}
</td>
{{- end }}
</tr>
{{- end }}
</tbody>
</table>
See https://gohugo.io/content-management/markdown-attributes/#usage .
name|type|breed|age
:--|:--|:--|:--
Spot|dog|Collie|3
Rover|dog|Boxer|5
Felix|cat|Malicious|7
{caption="This is the table caption."}
git clone --single-branch -b hugo-forum-topic-55082 https://github.com/jmooring/hugo-testing hugo-forum-topic-55082
cd hugo-forum-topic-55082
hugo server
If you have many tables on a page you might want to consider auto-numbering them. See https://gohugo.io/render-hooks/tables/#ordinal .
Thank you so much!
I am familiar with the latex label and \ref{...} system, is that what you mean? Will it be okay if you showed an example again?
I’ve already given you eveything you need.
I understood about the table captions. I meant how to use ordinals.
If you have many tables on a page you might want to consider auto-numbering them. See Table render hooks .
Put that where though? Say I have this table,
name|type|breed|age
:--|:--|:--|:--
Spot|dog|Collie|3
Rover|dog|Boxer|5
Felix|cat|Malicious|7
{caption="This is the table caption."}
Okay now how do I assign an ordinal to it?
You need to spend some time reading and understanding the documentation.
In the render hook, replace this:
<caption>{{ . | $.Page.RenderString }}</caption>
With something like this:
<caption>
<strong>Table {{ add 1 $.Ordinal }}</strong><br>
{{ . | $.Page.RenderString }}
</caption>
The result will look something like this:
1 Like
I am reading the documentation but it is still a bit new. Okay for example, I see this pattern a lot:
{{- with .Attributes.caption }}
<caption>{{ . | $.Page.RenderString }}</caption>
{{- end }}
Why not just:
<caption>{{ .Attributes.caption | .Page.RenderString }}</caption>
Because you will end up with an empty caption element if the author did not provide a caption.
system
June 20, 2025, 6:49am
13
This topic was automatically closed 2 days after the last reply. New replies are no longer allowed.
