样式自定义指南

安全调整颜色、字体和组件样式,让主题更像你自己。

作者: Liquid Stack

文章来源: https://liquid-stack.pages.dev/zh/p/customizing-liquid-stack-styles/

本指南介绍如何在不破坏主题升级与响应式布局的前提下,调整 Liquid Stack 的视觉风格。

从配置开始

先在 hugo.yaml 修改标题、侧栏简介、头像和颜色方案。内容层的改动应优先放在页面前置数据或 data/ 文件中,而不是直接改主题源文件。

添加局部样式

站点级样式位于 assets/scss/custom.scss。为新组件使用明确的类名,并避免覆盖通用 HTML 标签;这样可以减少对文章、菜单和移动端布局的连带影响。

每次改动都预览

每次修改颜色、间距或字体后,都检查首页、文章、相册、启动台以及深色模式。完成后运行完整 Hugo 构建,确保没有遗漏的资源或模板错误。

隐私政策 网站地图 仪表盘
使用 Hugo 构建 · 主题 Liquid StackJingyuan Zheng 设计