hugoのページコンテンツでテンプレートパラメータを使用する方法

Question

Hugoの投稿の内容にテンプレートパラメータを使用することはできますか？例えば。次のパラメータがある場合：

[params.company] 
name = "My Company" 

投稿の内容でこれを行うことはできますか？

This site, {{ .Site.BaseURL }} is operated by {{ params.company.name }} 

私は試しましたが、文字通り変数を補間する代わりに上記を印刷しています。 MDパーサがそれらを取り除くになるので

Answer 1

1.フロントは問題で道

限り、私は承知しているとして、それは以内に値下げファイルの内容を変数を置く*ことはできませんが、それはカスタムを使用してそれを行うことが可能です各.mdコンテンツファイルのfront matterの変数。 Hugoエンジンは、フロントで設定したフィールドを対象とすることができます。フロントマターフィールドはユニークでもあります。

あなたの場合、レンダリングされた.MDファイルを表示するために呼び出されるテンプレートはフロントマターパラメータにアクセスでき、テンプレートの動作を変更することもできます（追加クラス<div>の追加など）パラメータ。

--- 
title: "Post about the front matter" 
<more key pairs> 
nointro: false 
--- 

キーnointro: trueが私の最初の段落は、通常のサイズであることをするだろう：私は私の.mdファイルの例

、。それ以外の場合、キーが存在しないかfalseである場合、最初の段落はより大きなフォントサイズで表示されます。技術的には、<div>にカスタムクラスを追加しています。テンプレートで

、私はカスタムパラメータnointroにこの方法をタップする：前付パラメータを持っているあなたの値下げファイルを示し

親テンプレート、：私はできません

<div class="article-body {{ if .Params.nointro }} no_intro {{ end }}"> 
{{ .Content }} 
</div><!-- .article-body --> 

お知らせ変数を{{ .Content }}に入れてください。ただし、はの外に置くことができます。

これはファイルの内容の一部です（hugo/themes/highlighter/layouts/partials/blog-single-content.html）.1つの投稿のコンテンツの一部です。あなたはあなたが好きなようにあなたの部分を手配することができます。

もちろん、それはBooleanパラメータフラグだが、同じように、それはあなたが直接使用することができ、コンテンツのようになります。トップ

MDファイルの：

--- 
title: "One of our clients" 
<more key pairs> 
companyname: "Code and Send Ltd" 
--- 

Text content is put here. 

その後、に対してこの（余分な保険のようにそれを参照します使用してブランク値IF）：ヒューゴテンプレートファイルAnywhereの

：

{{ if .Params.companyname }}{{ .Params.companyname }}{{ end }} 

---

2.設定を使用する。

今、あなたの例を見て、ほとんどよりグローバルな場所にカスタムフィールドを保証するだろう "このサイトはによって運営され、"（toml/YAML/JSON）、例えば、hugo/config.tomlです。

hugo/config.toml：：私は私のconfigにcompanynameを追加したい場合は、私はこの方法でそれを行うだろう

BaseURL = "_%%WWWPATH%%_" 
languageCode = "en-uk" 
title = "Code and Send" 
pygmentsUseClasses = true 
author = "Roy Reveltas" 
theme = "Highlighter" 
[params] 
    companyname = "" 

それから私は{{ .Site.Params.headercommentblock }}経由でどこでもそれを使うだろう。

クライアントのページをstatic pagesにしたい場合は、単一の場所が最適ではない可能性がありますし、フロントマターを利用したいと思うかもしれません。それ以外の場合は、サイトのフッターの場合は、この方法が優れています。あるいは、このデータをdata filesに配置することもできます。

---

3.カスタムプレースホルダを使用し、ガルプ/ NPMスクリプト経由

を交換し、私は*ことはできないと述べたが、型にはまらない、より危険なものの、それは、可能です。

自分のウェブサイトに2つのビルドが必要な場合は、1）Prodと2）Devのような設定でした。 Prod URLは2つの場所から来ていました：CDNと私のサーバー。 Devは静的フォルダ内の1か所から来なければなりませんでした。なぜなら、画像を見たいと思っていて、列車でオフラインで作業していたからです。

解決するために、すべてのテンプレート（マークダウンコンテンツを含む）に_%%WWWPATH%%_と_%%CDNPATH%%_という2つのカスタム変数を使用しました。私は途中でこの独特のパターンを考え出し、自由にそれを適応させてください。

hugo/config.toml：その後、私のようにhugo/config.tomlにもそれを置く

：

BaseURL = "_%%WWWPATH%%_" 

ヒューゴは喜んでこれらのプレースホルダを持つウェブサイトを生成した後、私はHTMLの使用兵卒タスクを締めくくっ平凡なファイル：

replace: { 
    dev: { 
    options: { 
     patterns: [{ 
     match: /_%%CDNPATH%%_+/g, 
     replacement: function() { 
      return 'http://127.0.0.1:1313/' 
     } 
     }, { 
     match: /_%%WWWPATH%%_+/g, 
     replacement: function() { 
      return 'http://127.0.0.1:1313/' 
     } 
     }... 

私はGulpやnpmのスクリプトを勧めます。私はGruntを避けるでしょう。これはGruntが最高の時代の私の古いコード例です。

あなたがプレースホルダの値が見つからないか、間違ったことが起こり、プレースホルダがプロダクションコードにこぼれてしまった場合、Hugoはエラーにならないので、Hugo paramsより危険です。

キャッチネットの複数のレイヤーを追加する必要があります.Gulp/Grunt/npmの単純なスクリプトステップから、プリコミットフックのプレースホルダーパターンを検索します。特定のパターンを持つコード（たとえば、%%_）。あなたのレポの

package.json：例えば、非常に基本的なレベルでは、あなたがこの方法をコミット許可する前に何を検索するためのHuskyを命令する

"scripts": { 
    "no-spilled-placeholders": "echo \"\n\\033[0;93m* Checking for spilled placeholders:\\033[0m\"; grep -q -r \"%%_\" dist/ && echo \"Placeholders found! Stopping.\n\" && exit 1 || echo \"All OK.\n\"", 
    "precommit": "npm run no-spilled-placeholders" 
}, 

基本的には、パターン%%_と出口とのためgrepエラーコードが見つかった場合。それがJSONなので、コードをエスケープすることを忘れないでください。私はプロダクションで同様の（より高度な）セットアップを使用しています。適切なセットアップでは、%_、_%、%__、__%などを含む、間違ってタイプされたものを創造的に探す必要があります。