Sultana - 最小个人作品集 HTML 模板 preview 1

Sultana - 最小个人作品集 HTML 模板

bookmark

Sultana 是一款极简个人作品集 / 博客 HTML 模板,由 Frenify 开发。包含完整的前台页面(首页、文章详情、作者、标签、作品展示等)及会员注册登录功能,支持亮色/暗色主题切换,适合搭建个人品牌网站或内容创作平台。

HTML

项目简介

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 环境)

快速开始

  1. 直接在浏览器打开 sultanahtml-10/mainpack/html/index.html,或部署到本地服务器(如 XAMPP / Live Server)
  2. 文档建议本地打开 mainpack/doc/index.html 参考定制指南

使用建议

模板中 SVG 图标依赖本地服务器环境运行,建议使用 XAMPP 或 VS Code Live Server 打开;暗色模式状态保存在 localStorage,可通过修改 data-site-skin 属性全局切换主题。

help_outline

常见问题