Ekomart - 电子商务 HTML 模板 + RTL preview 1

Ekomart - 电子商务 HTML 模板 + RTL

bookmark

Ekomart 是一套完整的电商杂货商城 HTML 模板，包含前端商城页面和管理员/商家后台面板两部分。支持多首页风格、产品多属性展示、博客、购物车、结账等完整购物流程，适合快速搭建线上杂货超市或电商平台。

HTMLecommerceecommerce dashboardecommerce themefood marketgrocerygrocery marketgrocery shop

项目简介

Ekomart 是一套完整的电商杂货商城 HTML 模板，包含前端商城页面和管理员/商家后台面板两部分。支持多首页风格、产品多属性展示、博客、购物车、结账等完整购物流程，适合快速搭建线上杂货超市或电商平台。

技术栈

  • HTML5 / CSS3（SCSS 源码结构）
  • JavaScript（jQuery）
  • Bootstrap 5
  • FontAwesome 6（图标）
  • Google Fonts（Barlow / Roboto）
  • Swiper（轮播）
  • DataTables（后台数据表格）

项目结构

text
ekomarthtml-10/
├── ekomart-html/          # 前台商城页面
│   ├── assets/
│   ├── index.html        # 首页
│   ├── shop-*.html        # 商品列表（多种布局）
│   ├── cart.html          # 购物车
│   ├── checkout.html      # 结账
│   ├── blog*.html         # 博客页面
│   └── *.html             # 其它页面（联系、FAQ等）
├── ekomart-dashboard/     # 后台管理面板
│   ├── assets/
│   ├── index.html         # 仪表盘首页
│   ├── order.html         # 订单管理
│   ├── product-list.html  # 商品列表
│   ├── vendor-*.html      # 商家管理
│   └── profile-setting.html
├── documentation/         # 官方文档
│   ├── index.html
│   └── assets/
└── figma.txt              # Figma 设计稿链接

核心文件说明

  • ekomart-html/index.html — 商城首页，支持多个首页变体
  • ekomart-html/shop-details-*.html — 商品详情页，支持可变商品、分组商品等
  • ekomart-dashboard/index.html — 后台仪表盘，统计概览
  • ekomart-dashboard/assets/css/style.css — 后台主题样式，定义了绿色主色调（#629D23）
  • ekomart-html/assets/css/ — 前台商城样式及响应式布局
  • documentation/index.html — 模板官方使用文档

快速开始

纯静态模板，无需构建步骤：

  1. 直接在浏览器中打开 ekomart-html/index.html 可预览前台商城
  2. 打开 ekomart-dashboard/index.html 可预览后台管理界面
  3. 也可通过任意本地服务器访问（如 npx serve . 或 VS Code Live Server 插件）

使用建议

模板为纯前端静态页面，所有表单提交和业务逻辑均为模拟实现，开发时需自行对接后端接口。后台面板适合作为商家入驻型电商平台的管理后台原型参考。

help_outline

常见问题