Float

English

Float 是一款為 Zola 設計的佈景主題。

[[TOC]]

特色

安裝與啟用

在您的 Zola 專案資料夾內:

把 Float 以 Git 子模組的方式加入專案內:

git submodule add https://gitlab.com/float-theme/float.git themes/float

編輯您的 config.toml,指定 Float 作為佈景主題:

theme = "float"

編輯您的 config.toml,加入 tags 作為分類系統:

taxonomies = [
    {name = "tags", paginate_by = 10},
]

複製 float/static/ 的所有子資料夾與檔案到您的 static/:

cp -r themes/float/static/* static/

複製 float/content/ 的所有子資料夾與檔案到您的 content/:

cp -r themes/float/content/* content/

使用 Float

文章與配圖

文章皆以資料夾的方式存在,如下例:

content/
└── blog/
    └── 2020/
        └── 2020-06-15-Zola-Theme-Float/
            ├── index.md
            ├── pic1.png
            ├── pic2.png
            └── qa_report.pdf

文章為 index.md,文內的配圖或其它檔案也是放在文章資料夾內。

Front-matter

Front-matter 請參照下列註解說明:

title = "Float theme for Zola"
description = "Float features and usage guide"
draft = false
[taxonomies]
tags = ["Float", "Zola"]
[extra]
feature_image = "pic1.png" # 卡片圖片。
feature = true # 是否為重點文章,重點文章會以寬版卡片顯示。
link = "" # 指定卡片連結,若有指定則卡片不會連結到文章頁。

客製化

可客製化設定大多可以在 config.toml 的 [extra] 區段做設定:

[extra]
main_section = "blog"

copyright = ""

web_fonts = "<link rel='stylesheet' href='https://fonts.googleapis.com/css2?family=Noto+Serif+TC:wght@500;700&display=swap'>"

google_analytics = false
# google_analytics_id = "UA-XXXXXX-X"

google_adsense = false
# google_adsense_id = "ca-pub-XXXXXXXXXXXXXXXX"

twitter_account = "@xxx"

likecoin = false
# likecoin_name = "xxx"

utterances = false
# utterances_repo = "xxx/xxx"

字體

字體的 CSS 位於 float/sass/font.scss,欲更換字體,把 float/sass/font.scss 複製到自己的 sass/font.scss,並修改之。

已知問題