Blog格纸主题 v1.0.0
Blog格纸主题首次发布
2026-11-09 更新日志

内容介绍

「Blog格纸主题」是一套格纸手账风格的博客主题:米白渐变底色、白色卡片、几乎看不见的格线背景、虚线分割与
「窗口式」侧栏小工具(标题右侧三颗圆点),整体安静耐读,适合技术笔记、随笔与摄影类个人博客。
主题采用「主栏文章卡片 + 右侧小工具栏」的两栏布局,覆盖博客全部前台页面——首页(卡片由标题、虚线元信息、
格纸摘要组成,含分页)、列表页(分类 / 关键词搜索、子分类快捷筛选、面包屑与分页)、详情页(格纸正文排版:
彩色竖条小标题、引用块、代码块与表格,标签、本文链接与版权声明、上下篇与评论区)、关于本站、留言本、标签云、
文章归档与访问密码页;页脚含页脚导航(后台「导航」位置 foot)、版权与声明、备案号与域名。

产品介绍

  • 适合谁用:技术笔记、随笔与摄影类个人博客;需要完整博客页面、栏目与文章全部后台维护的站点。
  • 核心卖点:格纸手账的视觉语言(格线背景、虚线分割、窗口式小工具栏)、彩色竖条小标题与安静的阅读节奏。
  • 开箱即用:所有内容读取博客系统数据,页脚导航取后台「导航」位置 foot;副标题、博主信息、小工具标题与声明文案

可在后台「模板设置 → Blog格纸主题配置」调整。

Blog格纸主题

Blog格纸主题

模块介绍

「Blog格纸主题」是一套格纸手账风格的博客主题:米白渐变底色、白色卡片、几乎看不见的格线背景、
虚线分割与「窗口式」侧栏小工具(标题右侧三颗圆点),整体安静耐读,适合技术笔记、随笔与摄影类个人博客。

主题覆盖博客系统全部前台页面,采用「主栏文章卡片 + 右侧小工具栏」的两栏布局:

  • 首页:最新文章卡片流与分页(卡片由标题、虚线元信息、格纸摘要组成)
  • 列表页:分类 / 关键词搜索、子分类快捷筛选、面包屑与分页
  • 详情页:面包屑、标题与元信息、格纸正文排版(彩色竖条小标题、引用块、代码块、表格)、

标签、本文链接与版权声明、上下篇、评论区

  • 汇总页:关于本站、留言本、标签云、文章归档、访问密码页
  • 页脚:页脚导航(后台「导航」位置 foot)、版权与声明、备案号与域名

功能特性

  • 格纸背景:列表摘要与文章正文使用淡格线背景,模拟练习本的横竖线
  • 窗口式小工具:每个侧栏卡片标题右侧带三颗圆点装饰,标题上方有强调色短条
  • 站内搜索、控制面板、最近发表、最近留言、标签列表、友情链接六类侧栏小工具
  • 夜间模式:右下角一键切换,状态存在浏览器本地,刷新后保持
  • 全站响应式:窄屏单栏、导航收进汉堡菜单;导航项较多时单行横向滚动,不会挤压品牌区
  • 动效克制:卡片滚动入场、悬停轻微抬升,支持系统「减少动态效果」

使用场景

  • 适合技术笔记、随笔与摄影类个人博客。
  • 需要一套完整博客页面(首页 / 列表 / 详情 / 关于 / 留言 / 标签 / 归档)、栏目与文章全部后台维护的站点。

安装说明

  1. 安装主题模块
  2. 后台 → 系统设置 → 基本设置,将网站主题切换为「Blog格纸主题」
  3. 后台 → 博客设置,填写博客名称、标语、头像与「介绍内容」(关于页展示)
  4. 后台 → 博客管理,创建分类与文章(填写标签效果更佳,标签会显示在侧栏与标签云)
  5. 后台 → 导航,维护顶部导航(位置 head)与页脚导航(位置 foot)
  6. 后台 → 友情链接,位置选择 Blog 的链接会显示在侧栏「友情链接」
  7. 后台 → 功能设置 → 模板设置 → Blog格纸主题配置,按需调整副标题、博主信息、小工具标题与声明文案
本主题不携带演示数据:安装后请先录入分类与文章,首页与侧栏才有内容。
仓库内的测试种子脚本仅用于开发与演示环境,请勿在正式站点执行。

模块结构

Blog格纸主题
    BlogThemeLedger
        Admin         后台主题配置表单与路由
        Asset         样式 / 脚本 / 配图(安装后发布到 public/vendor/BlogThemeLedger)
        Core          站点模板 Provider、主题默认配置、视图数据辅助
        View/pc       框架页、头尾与全部博客页面视图
        Docs          模块介绍与更新日志
  • 顶部导航:后台「导航」位置 head
  • 页脚导航:后台「导航」位置 foot
  • 友情链接:后台「友情链接」位置 Blog

设计思路

格纸手账风格
├── 底色   米白渐变(冷蓝 + 暖黄极淡洗色)
├── 卡片   白底 + 细边 + 柔和投影,圆角只到 4px
├── 文字   墨色标题 / 深灰正文 / 暖灰次要信息
├── 强调   单一蓝色(短条、按钮、链接悬停)
└── 细节   格线背景、虚线元信息、窗口式小工具三圆点

后台菜单

  • 功能设置
  • 功能设置 → 模板设置
  • 功能设置 → 模板设置 → Blog格纸主题配置
QQ
微信
客服