视频加载失败

Firefly 主题模版

返回项目列表
Firefly 主题模版
已发布
Astro/Svelte/TailwindCSS/Typescript

一款清新美观且现代化个人博客主题模板,专为技术爱好者和内容创作者设计。该主题融合了现代 Web 技术栈,提供了丰富的功能模块和高度可定制的界面,让您能够轻松打造出专业且美观的个人博客网站。

Firefly 主题模版

功能特性#

⚡ 静态站点生成: 基于 Astro 的超快加载速度和 SEO 优化

🎨 现代化设计: 简洁美观的界面,支持自定义主题色

📱 移动友好: 完美的响应式体验,移动端专项优化

🔧 高度可配置: 大部分功能模块均可通过配置文件自定义

核心功能#

  • Astro + Tailwind CSS - 基于现代技术栈的超快静态站点生成
  • 流畅动画 - Swup 页面过渡动画,提供丝滑的浏览体验
  • 响应式设计 - 完美适配桌面端、平板和移动设备
  • 多语言支持 - i18n 国际化,UI 支持简体中文、繁体中文、英文、日文、俄语、韩文
  • 全文搜索 - 基于 Pagefind 的客户端搜索,支持文章内容索引

个性化#

  • 动态侧边栏 - 支持配置单侧边栏、双侧边栏
  • 文章布局 - 支持配置(单列)列表、网格(多列/瀑布流)布局
  • 字体管理 - 支持自定义字体,丰富的字体选择器
  • 页脚配置 - HTML 内容注入,完全自定义
  • 亮暗色模式 - 支持亮色/暗色/跟随系统三种模式
  • 导航栏自定义 - Logo、标题、链接全面自定义
  • 壁纸模式切换 - 横幅壁纸、全屏壁纸、全屏透明壁纸、纯色背景
  • 主题色自定义 - 360° 色相调节

如果你有好用的功能和优化,请提交 Pull Request

快速开始#

环境要求#

  • Node.js ≥ 22
  • pnpm ≥ 11

本地开发部署#

  1. 克隆仓库:

    Terminal window
    git clone https://github.com/Cuteleaf/Firefly.git
    cd Firefly

    Fork 到自己仓库再克隆(推荐),记得先点 Star 再 Fork 哦!

    Terminal window
    git clone https://github.com/you-github-name/Firefly.git
    cd Firefly
  2. 安装依赖:

    Terminal window
    # 如果没有安装 pnpm,先安装
    npm install -g pnpm
    # 安装项目依赖
    pnpm install
  3. 配置博客:

    • 编辑 src/config/ 目录下的配置文件自定义博客设置
  4. 启动开发服务器:

    Terminal window
    pnpm dev

    博客将在 http://localhost:4321 可用

平台托管部署#

  • 参考官方指南将博客部署至 Vercel, Netlify, Cloudflare Pages, EdgeOne Pages 等。

  • VercelNetlify 等主流平台自动部署,会根据环境自动选择适配器。

    框架预设: Astro

    根目录: ./

    输出目录: dist

    构建命令: pnpm run build

    安装命令: pnpm install

Profile Image of the Author
phyy
Born in 2006, graduated from Hengshui High School and is currently pursuing a bachelor’s degree in Software Engineering at Hebei Normal University, conducting research on view clustering.
WELCOME TO MY PAGE
This is my first announcement, hope you like it
分类
标签
最新动态
站点统计
文章
13
分类
2
标签
19
总字数
16,246
运行时长
0
最后活动
0 天前
站点信息
构建平台
Vercel
博客版本
Firefly v6.16.8
文章许可
CC BY-NC-SA 4.0
文章目录