项目简介
Sultana 是一款极简个人作品集 / 博客 HTML 模板,由 Frenify 开发。包含完整的前台页面(首页、文章详情、作者、标签、作品展示等)及会员注册登录功能,支持亮色/暗色主题切换,适合搭建个人品牌网站或内容创作平台。
技术栈
- HTML5 — 语义化结构
- CSS3 — 自定义属性(CSS Variables)、Flexbox/Grid 布局
- JavaScript — jQuery、GSAP 动画库
- SVG — 图标系统
- 第三方库 — Owl Carousel、Waypoints
项目结构
text
sultanahtml-10/mainpack/
├── doc/ # 模板使用文档
│ ├── index.html
│ ├── css/ # 文档样式
│ ├── js/ # 文档脚本
│ └── img/ # 文档配图
└── html/ # 实际使用的模板文件
├── index.html # 首页
├── about.html # 关于页
├── contact.html # 联系页
├── membership.html # 会员页
├── projects.html # 作品集页
├── single.html # 文章详情页
├── author.html # 作者详情页
├── tag.html # 标签详情页
├── authors.html # 作者列表页
├── tags.html # 标签列表页
├── account.html # 账户页
├── sign-in.html # 登录页
├── sign-up.html # 注册页
├── 404.html # 错误页
├── css/ # 主样式文件
├── js/ # 交互脚本
└── img/ # 静态图片资源
核心文件说明
html/index.html— 网站首页,含导航、精选文章列表、页脚html/css/style.css— 主样式表,定义全局变量、布局、亮/暗主题html/css/base.css— 重置样式与基础排版html/js/init.js— 页面初始化脚本,处理主题切换等交互doc/index.html— 模板官方文档,包含安装说明与定制指引html/modal/contact.php— 联系表单后端处理(需配合 PHP 环境)
快速开始
- 直接在浏览器打开
sultanahtml-10/mainpack/html/index.html,或部署到本地服务器(如 XAMPP / Live Server) - 文档建议本地打开
mainpack/doc/index.html参考定制指南
使用建议
模板中 SVG 图标依赖本地服务器环境运行,建议使用 XAMPP 或 VS Code Live Server 打开;暗色模式状态保存在 localStorage,可通过修改 data-site-skin 属性全局切换主题。
