このレポジトリは、jsys局旅行のブログとして機能します。
ブログは、zola という SSG(静的サイトジェネレータ)を使用しています。
- 適当に作成するディレクトリ名で branch を切ってから、作業に取りかかってください。
- 記事の追加方法は、以下の「記事の追加方法」を参照してください。
適当なディレクトリをcontent配下に作成し、その中にindex.mdを作成する。
index.mdのテンプレート
+++
title = "タイトル"
date = 2000-01-01
authors = ["執筆者"]
[taxonomies]
tags = ["jsys24", "グルメ"]
+++Warning
タグ名の表記揺れを防ぐために、TAG_LIST.mdを確認して、存在しないタグを付けたい場合は、TAG_LIST.mdにタグ名を追記してください。
※すでに存在しているタグの別名表記を追加するのは、やめてください。
Warning
すでに存在するディレクトリ名は使用できません。
Note
ディレクトリ名が記事の URI を識別する際の名前になります。
Note
画像などは作成したディレクトリに配置してください。
https://www.getzola.org/documentation/content/syntax-highlighting/
```rs
fn main() {
println!("Hello, world!");
}
```
{{ image(path="/image/path") }}
image は、width=int,height=int,caption=Stringをそれぞれオプションで追加できます。(Blog の sample ページを参照)
[!NOTE] >
widthやheightに非常に大きな自然数を入れた場合は、Markdown の結果が表示される DOM の範囲まで大きくなります。(css のレイアウトを壊そうとしても、壊せないようにしているということです。)
{{ image(path="/content/sample/image.jpg", width=1000, height=200, caption="captionの例") }}
Note
画像は自動で webp に変換されるはずなので、画像サイズは気にしなくて良いです。
$$
#この中に数式を書く
$$
$$
\frac{dy}{dx} + p(x) y^2 + q(x) y + r(x) = 0
$$
{% mermaid() %}
#この中に mermaid のコードを書く
{% end %}
{% mermaid() %}
flowchart LR
rdb["PostgreSQL (RDB)"] <--> server["server (main)"]
graphdb["Neo4j (GraphDB)"] <--> server["server (main)"]
meilisearch["Meilisearch (検索エンジン)"] <--> server["server (main)"]
cloudflare["Cloudflare R2 (画像保存)"] <--> image-server["image-server (画像専用)"]
server["server (main)"] <--> client["client"]
image-server["image-server (画像専用)"] <--> client["client"]
{% end %}
{% note() %}
# ここに note の内容を書く
{% end %}
{% note() %}
これは note です。
{% end %}
{% tip() %}
# ここに tip の内容を書く
{% end %}
{% tip() %}
これは tip です。
{% end %}
{% important() %}
# ここに important の内容を書く
{% end %}
{% important() %}
これは important です。
{% end %}
{% warning() %}
# ここに warning の内容を書く
{% end %}
{% warning() %}
これは warning です。
{% end %}
{% caution() %}
# ここに caution の内容を書く
{% end %}
{% caution() %}
これは caution です。
{% end %}
zola 0.19.2
対応済み
以下、疑似 html で表現している
<base.html>
<index.html></index.html>
</base.html>
<base.html>
<blog-template.html></blog-template.html>
</base.html>
<base.html>
<404.html></404.html>
</base.html>
/templates/shortcodes/配下に置いてください
以下を参考に zola をインストールしてください。
https://www.getzola.org/documentation/getting-started/installation/
nix develop -c $SHELLhttps://www.getzola.org/documentation/getting-started/overview/#content
https://swaits.com/adding-mermaid-js-to-zola/
https://sippo.work/blog/20231105-deploy-zola-with-cloudflare-pages/