Hugo で作ったサイトに Syntax highlighter を導入してみた
ブログの記事などでプログラムのソースコードを貼り付けると、 色付けされた見やすい表示に変換してくれる Syntax highlighter (シンタックスハイライター)を導入してみました。
私が使っているバージョンの Hugo にも Syntax highlighter は入っているのですが、 HTML を生成するタイプのようです。 私はどちらかというと JavaScript で動作するものを使うほうが好みです。 生成された HTML に余分なタグが入ってほしくないからです。
なので、今回は highlight.js を組み込みむことにしました。
この highlight.js は 185 の言語に対応し、 90 のスタイルが準備されています。 マイナー(?) な Elixir や Groovy, Dockerfile にも対応しているので、色々と使えそうです。
Hugo で画像をリサイズしたりトリミングしたりするテンプレートを書いてみる
Drupal をはじめとする一般的な CMS であれば、アップロードした画像ファイルのサイズ調整などを自動で処理する機能が準備されています。
Hugo にも同様の機能 がありましたので、試してみました。
やりたいことは、ブログ一覧に表示されるタイトル画像を縮小すること。そして、ブログの各投稿のページは上下を切り取った画像を表示すること。この 2 点です。
しかし、思った通りに動作しません。調べながら画像ファイルのサイズ調整の仕組みを作っていたのですが、結構はまってしまったのでまとめておこうと思います。
Hugo を初めて使ってみた感想
私たちの事務所「ランディネットワーク」の Web サイトですが、ようやくリニューアル作業を開始しました。
今回のリニューアル作業では大きな変更がありました。 それは、いままで散々お世話になってきたコンテンツ管理システム( CMS )の利用をやめて、 Hugo という静的サイトジェネレータを用いているところです。
サイトジェネレータは素晴らしいです。