项目简介
Jovenca 是一套现代珠宝电商 HTML 模板,适合搭建在线首饰商店。包含完整的首页、商品列表/详情、购物车、结账、博客、FAQ 等页面模板,基于 Bootstrap 5 构建,响应式布局,开箱即用。
技术栈
- Bootstrap v5.3.1
- SCSS(源码有 scss/ 目录)
- jQuery(通过 Google CDN 引入)
- 字体:Jost(本地 TTF 字体,完整字重覆盖)
项目结构
text
jovencahtml-10/
├── Documentation/ # 官方文档
│ ├── index.html
│ └── assets/css/js/
├── Jovenca/ # 主模板目录
│ ├── home.html # 首页
│ ├── shop-accordion.html # 手风琴式商品页
│ ├── shop-right-sidebar.html # 右侧边栏商品页
│ ├── blog-grid.html
│ ├── blog-single.html
│ ├── cart-page.html
│ ├── checkout-page.html
│ ├── contact-us.html
│ ├── about-us.html
│ ├── faq.html
│ ├── style.css # 主样式
│ ├── css/ # Bootstrap 及插件样式
│ ├── js/
│ ├── fonts/ # Jost & icomoon 字体
│ ├── images/
│ └── scss/ # SCSS 源码(可选)
核心文件说明
Jovenca/home.html— 商城首页入口Jovenca/shop-accordion.html— 手风琴布局商品展示页Jovenca/cart-page.html— 购物车页面Jovenca/checkout-page.html— 结账流程页面Jovenca/style.css— 主题主样式,含 Jost 字体定义与全局配色(#222 深色主题)Jovenca/css/bootstrap.css— Bootstrap 5 框架样式
快速开始
直接用浏览器打开 Jovenca/home.html 即可预览完整模板。如需本地服务器,可使用任意静态服务器:
bash
# Python
python -m http.server 8000
# Node.js (npx)
npx serve Jovenca
使用建议
该模板已包含完整的 SCSS 源码(scss/ 目录),如需修改主题色或样式,推荐编辑 SCSS 后重新编译,而非直接改动 style.css,以提高维护效率。
