一款极简主义 Typecho 作品集主题,适合设计师和创意工作者。干净的排版、杂志级质感,专注于展示你的作品。
- 置顶焦点区 — 将任意作品置顶,以大尺寸卡片展示在首页顶部
- 分类筛选栏 — 首页一键筛选,按分类浏览作品
- 响应式网格布局 — 自适应多列作品卡片,适配各种屏幕尺寸
- 移动端侧边栏 — 小屏设备上的抽屉式导航菜单
- 滚动渐显动画 — 作品卡片滚动进入视口时自动触发淡入动画
- 页面过渡效果 — 页面间切换时带平滑淡入过渡
- 作品上下篇导航 — 详情页底部上一个 / 下一个作品快捷跳转
- 关于页面 — 专属布局:左侧头像,右侧个人介绍
- 社交链接 — 页脚可配置多个社交平台链接
- 后台可视化配置 — 导航文案、按钮文字、社交链接等全部可在后台自定义
- 下载或克隆本仓库
- 将
PersonalDesignExhibitionTheme文件夹放入 Typecho 安装目录的usr/themes/下 - 登录 Typecho 后台
- 进入 控制台 → 外观,启用本主题
启用主题后,进入 外观 → 设置外观,可配置以下选项:
| 选项 | 说明 | 默认值 |
|---|---|---|
| 首页导航标签 | 首页导航链接文案 | 作品 |
| 关于页 Slug | 触发「关于」专属布局的页面 slug | about |
| 关于页导航标签 | 关于页导航链接文案 | 关于 |
| 详情页返回链接文案 | 单篇文章返回链接文字 | ← 返回作品集 |
| 上一个作品链接文案 | 上一篇作品链接文字 | ← 上一个作品 |
| 下一个作品链接文案 | 下一篇作品链接文字 | 下一个作品 → |
| 筛选栏「全部」按钮文案 | 筛选栏第一个按钮的文字 | 全部 |
| 社交链接 | 页脚社交链接,每行一个,格式:名称|链接地址 |
Instagram / Behance / Dribbble |
在 Typecho 后台将某篇文章设为置顶(sticky),该文章会以焦点大图卡片的形式展示在首页最顶部。
在 Typecho 后台创建一个 slug 为 about 的独立页面(或使用你自定义的 slug)。在正文第一张图片会作为左侧头像显示,正文其余内容会渲染在右侧介绍区域。
PersonalDesignExhibitionTheme/
├── style.css # 全部样式(CSS 变量、重置、组件样式)
├── header.php # 网站头部 + 导航栏
├── footer.php # 页脚 + 脚本加载
├── index.php # 首页:置顶焦点区、筛选栏、作品网格
├── post.php # 单篇作品详情页
├── page.php # 通用页面(关于页布局)
├── functions.php # 主题选项配置与工具函数
├── screenshot.png # 主题预览图
├── assets/
│ ├── js/
│ │ ├── filter.js # 分类筛选逻辑
│ │ ├── hero-orientation.js # 焦点图方向自适应
│ │ ├── mobile-nav.js # 移动端导航切换
│ │ ├── page-transition.js # 页面过渡动画
│ │ └── scroll-reveal.js # 滚动渐显动画
│ └── images/
└── LICENSE
- Typecho 1.2+
- PHP 7.4+
