最終更新日:2020年11月5日

hugoにソースコードを掲載するためのショートコードを作成した

記事内に商品プロモーションを含む場合があります。

コードを記事に載せるとき、実行可能なファイルの内容を記事にしたほうがメンテナンスしやすいなと思い、作ってみました。

使い方

{{< code python “./path/to/hello.py” >}}

※hugo の記事に shortcode の呼び出しコードを書くの難しいなぁ。

コード

shortcode の中身は次のようになります。

ソースファイルを読み込んだあとは、もともと用意されている highlight を使ってシンタックスハイライトを行うようにしています。

なので、highlight に対応するパラメータを渡すようにしています。

ファイルは./layouts/shortcodes/code.htmlという名前にしました。

{{ $type := .Get 0  }}
{{ $file := .Get 1 }}
{{ $opt := .Get 2 }}
{{ $code := readFile $file }}
{{ highlight $code $type $opt }}
hugoにソースコードを掲載するためのショートコードを作成したの商品をアマゾンで調べる。
hugoで目次(tableOfContents)を表示する方法
sect: Hugoes | lastmod: 2020-01-10 | pv: 99
hugoのコードブロックをハイライトする方法
sect: Hugoes | lastmod: 2020-01-10 | pv: 5
hugoのsummaryで出力される文字数を指定した値にする方法
sect: Hugoes | lastmod: 2019-08-01 | pv: 52
HUGOで必要最低限なサイトマップを作る
sect: Hugoes | lastmod: 2019-03-31 | pv: 56
hugoで生成した静的ページをCircleCIでさくらのレンタルサーバへ自動アップ
sect: Hugoes | lastmod: 2019-02-23 | pv: 43