org-modeでhugoする
Page content
hugoを使ってorg-modeをhtmlとかにするってことだが、いまいち良くわからない。画像とかリンクとかをなんとかしたいだけなのにいちいち悩む。調べて、やってみたことを記す。参考は こちら(ショートコード | Hugo)とか。
以下、あまり自信なし。
ショートコード
{{% shortcodename arguments %}}
ショートコードネームと引数との区切り(前後も含め)スペース必須
ショートコードをそのまま表示する
リンク
外部リンク
普通にorg-modeのリンクの書き方でOK。
[[https://gohugo.io/content-management/shortcodes/][ショートコード | Hugo]]
画像
hugo 標準のディレクトリ構成で "~/blog/static/images" に画像ファイルを置いた場合。例はこの前のラーメン写真。
{{<figure src="/images/20240601/DSC_0384.JPG" alt="今日のお昼">}}
"<"、">"をエスケープしています。そのまんま表示する方法がわからない(泣)。
脚注とかもわからない(泣)。
/* */で括ってみた。↓
{{<figure src="/images/20240601/DSC_0384.JPG" alt="今日のお昼">}}
できた!
{{< twitter user="tsut" id="1821132124923285653" >}}
両ボランチが1点ずつ。素晴らしい。#albirex
— tsut (@tsut) August 7, 2024
highlite
{{< highlight go-html-template >}}
{{ range .Pages }}
<h2><ahref="{{ .RelPermalink }}">{{ .LinTitle }}</a></h2>
{{ end }}
{{< /highlight >}}
{{ range .Pages }}
<h2><ahref="{{ .RelPermalink }}">{{ .LinTitle }}</a></h2>
{{ end }}
org-mode
目次の設定2
- config.toml で サイト全体のdefault設定
toc = true (or false)
- ページごとに目次を付けるかどうかを設定
#+toc: false (or true)
脚注(footnote)
* サイト内アンカーへのリンク[fn:1]
[fn:1] 2024-06-12 追記
水平線
5つ以上の '-'
-----
html をそのまま適用する
"#+begin_export html"と"#+end_export"で括る。
#+begin_export html
<div class="iframely-embed"><div class="iframely-responsive" style="height: 140px; padding-bottom: 0;"><a href="https://blog.sorakote.net/" data-iframely-url="//iframely.net/Xfn3lsC"></a></div></div><script async src="//iframely.net/embed.js"></script>
#+end_export
Embeds codes for today's Internet - Iframely
Iframelyで取得したコードを上のように"#+begin_export html"で括ると、下のようになる。余りふさわしい例ではないけど例示。