Hugo のコードハイライト
当ブログでは Hugo のコードハイライトを使っています。
コードハイライトは
1$book = new Book();
2$book->title = $request->input('title');
3$book->summary = $request->input('summary');
4$book->save();
を
1$book = new Book();
2$book->title = $request->input('title');
3$book->summary = $request->input('summary');
4$book->save();
のようにカラーリングしてくれて、とても便利ですよね。
先日書いた記事で、行番号カウントを途中から出したい、というところがあって調べたらかんたんにできました。
Hugo コードハイライトのオプション
ドキュメントはこちらです。
Hugo
Content Management > Syntax Highlighting
https://gohugo.io/content-management/syntax-highlighting/
Content Management > Syntax Highlighting
https://gohugo.io/content-management/syntax-highlighting/
行をハイライト
``` {linenos=table,hl_lines=[4]}
$book = new Book();
$book->title = $request->input('title');
$book->summary = $request->input('summary');
$book->save();
```
|
|
4 行目の $book->save();
背景が赤黒くハイライトされています。
コードの補足を入れる時にわかりやすいですよね。
ハイライトは、一度に複数の指定を入れることができます。
複数行を指定したり、
1hl_lines=[10 20]
範囲を指定したり、
1hl_lines=["5-10"]
組み合わせたり、
1hl_lines=["5-10" 20]
という感じです。
開始行を指定する
``` {linenos=table,linenostart=10}
$book = new Book();
$book->title = $request->input('title');
$book->summary = $request->input('summary');
$book->save();
```
|
|
通常、行番号は 1 から連番が振られますが、 linenostart
をつけてあげると 指定の数字からスタートします。
長いコードの部分を示す時に便利ですね。
Hugo 0.60.0 以前の書き方
上記に掲載した書き方は Hugo v 0.60.0
以降で使えるようになったものです。
1$ hugo version
して、これよりも古いバージョンを使っている場合は古い書き方をするか、Hugo 本体のバージョンを上げると良いですね。
古い書き方は
``` {linenos=table,linenostart=10}
〜
```
だと
{{< highlight "linenos=table,linenostart=10" >}}
〜
{{< / highlight >}}
という感じになります。
Markdown の ```
と比べると、ちょっと冗長ですよね。
なお、 Hugo 本体を更新する場合は次をご覧ください。