テーブルにシンプルな PureTable : https://purecss.io/tables/ を使っています。 Hugoでカスタム・クラスを簡単に追加できる方法があるのは聞いたことがあったのですが、 まぁ、気になったまま、そのまま放置、面倒だけど直打ちしてました。
別件のタグ関連のことを調べている際に、偶然それらしき解決法を発見！
最近のバージョンだとデフォルト・テンプレートに入ってるのかも？
まずはtomlかyamlの設定ファイルに以下を追加します。 拡張されたMarkdown（GoLangのパーサー）なのかな。
goldmarkの細かい情報は https://github.com/yuin/goldmark にて調べてください。
config.tomlならば、
[markup.goldmark.parser.attribute]
block = true
title = true
config.ymlですと、
markup:
goldmark:
parser:
attribute:
block: true
title: true
マークダウンの最後にクラス{ .custom-class .custom-class2 }を書き加えます。
| x | Phoenix | Breez | Blixt |
|--|-------|--------|------|
| チャンネル開設費 | 1% : 2,000 | 0.4% : 2,000 | 0.15% |
| Send to Breez | 8sat / 2hops | 1sat | 8sat / 5hops |
{ .table .pure-table .pure-table-horizontal .table-striped .table-responsive }
で、こんな形で書き出されます。
<table class="table pure-table pure-table-horizontal table-striped table-responsive">
上のマークダウンの表示はこんなんです、よろし。
| x | Phoenix | Breez | Blixt |
|---|---|---|---|
| チャンネル開設費 | 1% : 2,000 | 0.4% : 2,000 | 0.15% |
| Send to Breez | 8sat / 2hops | 1sat | 8sat / 5hops |
素晴らし。画像とかにもつけられるので重宝するかも、ちょっといじりたかったんよね。。。
参照元： Add custom CSS classes to images with Hugo’s Markdown attributes
