入門記事のブログです。日々学んだ事や情報収集したIT系の記事も書いています。管理者はフロントエンド、バックエンドを開発しているソフトウェアエンジニアです。概要Hugoの特徴Goldmarkの設定コンテンツ管理コンテンツ管理の概要Hugoのコンテンツ管理Markdownと同じディレクトリにファイルを置きたい場合に使用するページリソースを解説Hugoのメニュー機能を解説HugoModulesとはテンプレートテンプレートの概要Hugoのテンプレートを作成する為の基礎知識テンプレートの種類とマッチングテンプレートで変数の出力について詳しく解説MarkdownRenderHooks-リンクや画像のテンプレートを作成する仕組みテンプレート関数テンプレート関数の概要Hugoのテンプレート関数について解説.RenderString|Markdownの文字列をHTMLに変換する.Scratch|スコープを超えて変数を扱うdict|マップ型の値を定義するeq|値が等しいか比較するif|値を比較するwhere|配列を条件でフィルターするブログのテンプレート作成チュートリアルブログのテンプレート作成チュートリアルの概要シンプルなブログのテンプレートを作成するbaseof.htmlの作成その1baseof.htmlの作成その2resources.Getとページリソース、キャッシュ戦略解説baseof.htmlの作成その3メニュー機能の解説baseof.htmlの作成その4階層型カテゴリーを実装する方法baseof.htmlの作成その5とまとめlist.htmlの作成アーカイブとページネーション、パンくずリストの解説single.htmlの作成Markdownを表示するAMP対応テンプレートを作成するHugoテーマHugoテーマの概要Hugoテーマの公開BasicDesignPersonalBlogshortcodeshortcodeの概要ショートコード作成の解説ampimgタグで画像の遅延読み込みの対応とショートコード作成Hugoでブログカードに対応するTipsTipsの概要パンくずリストを表示するHugoで階層型カテゴリーを実現するHugoServer動作時にMarkdownをVSCodeで開くリンクを表示するDeveloperToolsのコンソールにHugoの変数をダンプするMeCabで良い感じにタイトルを改行するMarkdownRenderHooks-リンクや画像のテンプレートを作成する仕組み2019.12.25こんにちはnasustです。Hooksがサポートされました。Markdownの記法でリンクと画像を指定する書式があります。それらのテンプレートを指定する事が出来ます。HugoのMarkdownエンジンがGoldmarkを使用している場合で有効です。下記の場所にテンプレートを作成します。画像であれば、render-image.htmlをリンクであればrender-linkです。render-link.htmlbash変数Page.Page変数です。DestinationURLです。Titleタイトルです。Textリンクのテキストです。PlainText画像の場合はalt属性のテキストです。dockercomment:iOS、Android、Web、APIサーバーなどのフロントエンド・バックエンドを開発するソフトウェアエンジニアです。UI/UXが好きです。かっこいいUIやWebデザインを眺めるのが趣味です。このブログはソフトウェア開発関係の内容を記事にしています。