ARTICLE DETAIL

资讯详情

深耕郑州网站建设与运营推广的一线实战洞察。

如何用 Zola 主题 kirifuji 快速搭一个紫色极简博客:3 步上手指南

如何用 Zola 主题 kirifuji 快速搭一个紫色极简博客:3 步上手指南 如何用 Zola 主题 kirifuji 快速搭一个紫色极简博客3 步上手指南【免费下载链接】zolaA fast static site generator in a single binary with everything built-in. https://www.getzola.org项目地址: https://gitcode.com/GitHub_Trending/zo/zola是不是也受够了层层嵌套、处处是块的花哨模板只想要一块干净的阅读区如果答案是的不妨试试 kirifuji——一个专为 Zola 静态站点生成器打造的「简单整洁」博客主题。这篇手把手教程带你从安装、激活到导航菜单定制一步步搭出这个紫色极简站。先睹为快kirifuji 紫色极简效果长这样这一节先让你看到「装完之后的结果」心里有个预期再动手。从截图中能提取出 4 个视觉特征极简垂直居中布局纯白背景、大量留白正文集中在页面中央几乎没有任何装饰元素深紫色主色站点名「Kirifuji」与标题都使用接近#40246b的深紫浅蓝色辅助色正文超链接统一用浅蓝和紫色形成对比顶部水平导航左侧是站点名右侧依次排列log、fun、contact、misc.几个文字链接居中页脚版权行「2025 by Yukari」加一行「Powered by Zola and Kirifuji」署名。装前 30 秒自检安装 Zola 主题前确认这 2 件事这一节帮你用 30 秒排除环境障碍避免装到一半才发现缺条件。对照下面的清单打勾即可Zola 版本达标主题元数据声明minimum_version 0.4.0即需要 Zola 0.4.0 及以上。这是比较早期的版本现在的安装基本都满足主题目录约定Zola 要求主题放在站点根目录的themes/文件夹里目录名就是后续配置里的主题名。目录不存在时安装命令会自动帮你创建配置文件就绪站点根目录有config.toml没有zola.toml时Zola 会自动回退读它。两项都打勾就可以进入安装了。两条安装路线对比git clone 与 submodule 怎么选这一节把两种并列的安装方式并排放你对着场景挑一条就行。路线适用场景命令后续更新方式直接克隆一次性装好操作简单git clone https://codeberg.org/yukari/kirifuji-zola themes/kirifuji手动进主题目录拉取新代码Git 子模块想把主题版本纳入站点仓库、随上游持续同步git submodule add https://codeberg.org/yukari/kirifuji-zola.git themes/kirifuji通过子模块版本指针管理更新直接克隆就一条命令git clone https://codeberg.org/yukari/kirifuji-zola themes/kirifuji子模块路线多一步前提——站点本身得是 Git 仓库没有的话先初始化git init # 如果还没有初始化 Git 仓库 git submodule add https://codeberg.org/yukari/kirifuji-zola.git themes/kirifuji两者差异一句话概括克隆是「一次性快照」升级靠手动子模块则把主题以指针形式记录在站点仓库里别人克隆你的站点后执行git submodule update --init就能还原出同款主题。一行激活主题theme 配置放错地方会怎样主题落位后接下来一行配置就能点亮它。打开站点根目录的config.toml加入theme kirifuji这里有个高频坑这一行必须写在 TOML 文件的顶层main 区段不能塞进[extra]、[markdown]之类的小节里否则解析不到主题静默失效。另一个容易漏的点——值必须与themes下的文件夹名逐字一致比如你克隆时目录叫kirifuji-zola却写了kirifuji同样不会生效。激活后 Zola 的查找顺序也顺带说明下构建时优先从themes/kirifuji/templates/找模板、从themes/kirifuji/static/供静态资源站点自身同名文件优先级更高不会被主题覆盖。导航菜单与页脚 DIY[extra] 配置项逐项讲解这一节解决「顶部那排菜单从哪来、页脚署名怎么关」的问题。[extra]区段是给主题塞自定义数据的地方模板里通过config.extra.xxx读取其中的键值。kirifuji 用到两个键语义如下配置键类型作用默认值hideThemeName布尔值是否隐藏页脚「Powered by Zola and Kirifuji」署名false显示署名navigationMenu对象数组每项含name与path渲染顶部水平导航栏的菜单项未配置不显示导航最小可运行示例追加到config.toml[extra] # to hide Powered by Zola and Kirifuji footer texts # hideThemeName true # navigation menu setup navigationMenu [ { name log, path /log}, { name fun, path /fun}, { name contact, path /contact}, { name misc., path /misc} ]逐项拆解navigationMenu数组里每个{ name, path }对象就是一个菜单项name是显示文字、path是链接目标既可以是站内相对路径如/log也可以是完整 URL增删数组元素就等于增删导航项。hideThemeName默认注释状态即不隐藏想让署名消失就取消注释设为true想保留对主题作者的致谢就维持现状。深度换装 4 法不动主题源码也能改这一节按「想改什么 → 改哪里 → 怎么写」组织覆盖机制核心原则是站点的同名文件永远优先于主题文件。想改什么改哪里怎么写整页模板如首页站点templates/新建templates/index.html与主题模板同路径同名直接覆盖themes/kirifuji/templates/index.html模板里某一个区块站点templates/新模板先写{% extends kirifuji/templates/index.html %}再重写目标 block其余部分原样继承CSS、字体等静态文件站点static/放同名文件即可覆盖主题static/里的对应文件主题预置的默认值站点config.toml在[extra]里重新赋值如navigationMenu、hideThemeName⚠️ 务必记住不要直接改themes/kirifuji/目录内的文件。虽然当时也能生效但主题一升级你的改动就被冲掉而且这些改动不会触发 live reload。详细的覆盖规则可以读 extending-a-theme.md。常见翻车点主题不生效与导航栏消失这一节把两个最高频的翻车场景按「现象 → 原因 → 解决」列清楚。翻车一配完theme kirifuji后页面还是默认样子现象构建不报错但页面完全没有紫色样式等于主题没加载原因theme行被写进了某个小节内部如[extra]之下TOML 会把它当作小节的字段而非顶层配置或者值与themes下文件夹名不完全一致解决把theme kirifuji挪到文件最顶层并核对themes/里的目录名是否逐字匹配。翻车二激活了主题顶部导航栏却是空的现象正文和页脚正常但顶部只有站点名没有log、fun等链接原因[extra]里根本没配navigationMenu它默认就不显示导航或数组 TOML 语法写错——比如{ name log, path /log }这类对象写法与素材示例不一致解决对照上一节的示例逐项抄一遍navigationMenu数组保存后重新构建。许可与署名0BSD 与字体授权两句话说清这一节帮你合规收尾。kirifuji 主题本身采用0BSD许可几乎不受限制地使用、修改与再分发内置的Alan Sans 字体依据OFL-1.1SIL Open Font License 1.1授权两者对个人博客和商业站点都友好。如果站点公开上线建议在页脚或 README 里保留这两项许可说明也顺手保留了hideThemeName注释里的主题署名。收尾3 步回顾 延伸阅读其实就三步克隆或子模块添加主题到themes/kirifuji顶层写theme kirifuji在[extra]配好navigationMenu和可选的hideThemeName需要深度换装时用站点同路径模板 / 静态文件 /[extra]覆盖不碰主题源码。延伸阅读均为仓库内文档主题安装与使用installing-and-using-themes.md主题扩展机制extending-a-theme.md完整配置参考configuration.md【免费下载链接】zolaA fast static site generator in a single binary with everything built-in. https://www.getzola.org项目地址: https://gitcode.com/GitHub_Trending/zo/zola创作声明:本文部分内容由AI辅助生成(AIGC),仅供参考
返回列表