ブログ投稿をリストとしてレンダリングするhtmlリスト要素があります。
<ul class="posts">
{{ range .Data.Pages -}}
<li>
<span class="postlist_container">
<a href="{{ .Permalink }}">{{ .Title }}</a>
<time class="pull-right post-list" datetime="{{ .Date.Format "2006-01-02T15:04:05Z0700" }}">{{ .Date.Format "Mon, Jan 2, 2006" }}</time> </span>
</li>
{{- end }}
</ul>
ブログ投稿はマークダウン（まあRmarkdown）で書かれていて、リストに表示されるソース画像を指定します。
---
thumbnail: "/post/source/image_tn.jpg"
---
リスト内にタグを追加して、投稿のタイトルと一緒に画像をレンダリングすることができました。
<img src="{{ with .Params.thumbnail }}{{ . }}{{ end }}">
箇条書き、タイトル、日付、画像があるため、これは理想的ではありません。私が欲しいのは、画像が箇条書きに置き換わることです。
これにCSSを使用することについて読んだことがありますが、例では常に1つの画像への絶対パスを使用しています。
.posts {
list-style-image: url("source/image.jpeg");
}
マークダウンファイル内のParam.thumbnailから画像を参照する方法はありますか？
これは機能しませんでした：
.posts {
list-style-image: url("{{ with .Params.thumbnail }}{{ . }}{{ end }}");
}
どんな助けでも大歓迎です。
CSSスタイルシートでマークダウンを使用するには、HTMLテンプレート内にマークダウンを含める必要があります。
挿入一度ルール（s）は、テンプレート内のあなたが最良の内部に挿入することである（その場で更新したい<head>が、どこか他の意志の仕事
<style>
.posts {
list-style-image: url("{{ with .Params.thumbnail }}{{ . }}{{ end }}");
}
</style>
代わりに
<img src="{{ with .Params.thumbnail }}{{ . }}{{ end }}">
blogdownからテンプレートチュートリアルについて読むのが最善です
https://bookdown.org/yihui/blogdown/templates.html#a-minimal-example
部分/ディレクトリは、部分関数を介して他のテンプレートで再利用されるHTMLフラグメントを配置する場所です。このディレクトリの下に4つの部分的なテンプレートがあります。
header.html mainは、
<head>タグとタグ内のナビゲーションメニューを定義します<nav>。
さらに読むと、{{ partial "head_custom.html" . }}が挿入される可能性のあるファイル（head_custom.html）であることがわかります。
<style>
.posts {
list-style-image: url("{{ with .Params.thumbnail }}{{ . }}{{ end }}");
}
</style>
この記事はインターネットから収集されたものであり、転載の際にはソースを示してください。
侵害の場合は、連絡してください[email protected]
コメントを追加