2024-10-19 Saturday

2024-10-19 (Last Modified: 2024-10-20)

Journal

Page content

今日のhugoさん

HugoのTopPageの記事要約にアイキャッチ画像を表示する

参考

前提

 $ hugo version
hugo v0.128.2-de36c1a95d28595d8243fd8b891665b069ed0850 linux/amd64 BuildDate=2024-07-04T08:13:25Z VendorInfo=gohugoio

使用テーマは Mainroad | Hugo Themes

記事毎にフロントマターで指定

hugo on org-mode

例によってorg-modeの例はなかなか出てこない…。

 #+title: そらこて、ねっ!
 #+date: 2022-09-28T22:49:34+09:00
 #+archives: 2022/09
 #+draft: nil
 #+slug: 202209282249
 #+thumbnail: /images/20241019/241019200837.webp

こんな感じで'#+thumbnail:'に画像位置を指定する

トップページににサムネが入った。

記事の方はこんな感じ。大きめの画像が記事の上に入る。

サイズ違いで同じ画像が入っても嬉しさがない悩

テンプレートをイジって記事に画像入れない設定はできた。自分で指定する方法も、何枚か画像があったりしたときなど良いか？とも思ったが、やっぱり面倒な気がした。

記事内の画像をアイキャッチに使う

ということでいろいろ手を入れる。中身については全く理解してない。ただ試行錯誤してみた結果、動いてるから良いかって感じ。

'#+thumbnail:'指定優先でサムネイル入るようになった。最初の条件分岐がなんかかっこ悪い悩。

2024-10-20 Sunday single.htmlはdefaultに戻す。layouts/_default/からは削除した。

layouts/_default/summary.html

  <article class="list__item post">
  {{- if partial "post_thumbnail.html" (dict "class" "list" "page" .) }}
  {{ partial "post_thumbnail.html" (dict "class" "list" "page" .) }}
  {{- else }}
  {{- $image := index (findRE "<img.*?src=([^>]*)?>" .Content 1) 0 }}
    {{- if $image }}    
    {{- $image_src := index (findRE "src=\"([^\"]*?)\"" $image 1) 0 }}
    <figure class="list__thumbnail thumbnail">
      <a class="thumbnail__link" href="{{ .RelPermalink }}" rel="bookmark">
        {{ print "<img class=&quot;thumbnail__image&quot; " $image_src ">" | safeHTML }}
      </a>
    </figure>
    {{- end }}
    {{- end }}
    <header class="list__header">
      <h2 class="list__title post__title">
		<a href="{{ .RelPermalink }}" rel="bookmark">
		  {{ .Title }}
		</a>
		</h2>
		{{- with .Params.lead }}
		<p class="list__lead post__lead">{{ . }}</p>
		{{- end }}
		{{ with partial "post_meta.html" . -}}
		<div class="list__meta meta">{{ . }}</div>
		{{- end }}
	</header>
	<div class="content list__excerpt post__content clearfix">
		{{ .Summary }}
	</div>
	{{- if .Site.Params.readmore }}
	{{- if .Truncated }}
	<div class="list__footer clearfix">
		<a class="list__footer-readmore btn" href="{{ .RelPermalink }}">{{ T "read_more" }}</a>
	</div>
	{{- end }}
	{{- end }}
</article>

今日のごはん

朝: シチューヨーグルトコーヒートースト
昼: 人参シリシリ味玉鮭フレークのお握らず
晩: 具だくさん味噌汁鶏と水菜の和物ご飯

今日もとりあえず飲まない

故あってしばらく飲まない…（つもり）

223日目