GearO - Furniture Store Ecommerce HTML Template

# 项目简介 GearO 是一款面向办公设备领域的静态电商 HTML 模板，基于 Bootstrap 构建，提供完整的商城页面组合。涵盖商品展示、购物车、结账、用户账户、博客等 40+ 页面，适合快速搭建办公用品或电子产品零售站点。 ## 技术栈 - Bootstrap 5.x（CSS 框架） - Swiper（轮播滑动） - jQuery（交互逻辑） - Animate.css（动画效果） - Fancybox（图片灯箱） - PhotoSwipe（相册） - SCSS（样式预处理） - PHP（联系表单后端） ## 项目结构 ``` gearohtml-10/gearo-package/gearo/ ├── index.html # 首页 ├── shop-*.html # 商品列表页（多种布局） ├── product-*.html # 商品详情页（多种样式） ├── shopping-cart.html # 购物车 ├── checkout.html # 结账 ├── my-account-*.html # 用户中心 ├── blog-*.html # 博客列表/详情 ├── contact.html # 联系页 ├── store-list.html # 门店列表 ├── faqs.html # 常见问题 ├── css/ # 样式文件（含 bootstrap.min.css） ├── js/ │ └── main.js # 核心交互逻辑 ├── scss/ │ └── app.scss # SCSS 入口 └── contact/ └── contact-process.php # 联系表单处理脚本 ``` ## 核心文件说明 - `index.html` — 首页，含顶部公告栏、导航、轮播 banner - `js/main.js` — jQuery 插件封装，包含数量增减、变体选择、滚动置顶等 30+ 功能 - `scss/app.scss` — SCSS 总入口，按模块引入变量、组件和响应式样式 - `css/bootstrap.min.css` — Bootstrap 核心样式 - `contact/contact-process.php` — 联系表单邮件发送脚本（依赖服务器 mail 函数） - `shop-*.html` / `product-*.html` — 商品列表与详情页模板合集，展示不同筛选方式与商品样式 ## 快速开始 模板为纯静态页面，可直接在浏览器打开 `index.html` 预览。 如需本地服务： ```bash # Python 3 python -m http.server 8080 # Node.js (npx) npx serve . ``` 然后访问 `http://localhost:8080/gearo/` 即可。 联系表单功能需部署至支持 PHP 的 Web 服务器并配置邮件服务。 ## 使用建议 - 定制界面主要修改 SCSS 文件中的 `abstracts` 变量和 `css/styles.css`；页面内容直接在对应 HTML 中编辑。 - 所有 JavaScript 交互均依赖 jQuery，确保 `js/main.js` 在 jQuery 之后加载。