Daex - 即将推出的创意模板 preview 1

Daex - 即将推出的创意模板

bookmark

Daex 是一款创意"即将上线"（Coming Soon）页面模板，提供 7 种不同的视觉效果变体，包括视差滑块、Ken Burns 渐变、全屏视频背景（YouTube/Vimeo/HTML5）以及静态图片背景。模板内置倒计时、新闻订阅（MailChimp）、联系表单等服务，适合产品发布、网站维护或活动预热场景。

HTMLanimatedbootstrapcleancoming sooncountdowncreativelanding page

项目简介

Daex 是一款创意"即将上线"（Coming Soon）页面模板，提供 7 种不同的视觉效果变体，包括视差滑块、Ken Burns 渐变、全屏视频背景（YouTube/Vimeo/HTML5）以及静态图片背景。模板内置倒计时、新闻订阅（MailChimp）、联系表单等服务，适合产品发布、网站维护或活动预热场景。

技术栈

  • HTML5 / CSS3（响应式布局）
  • jQuery + jQuery 插件（Slick Slider、Swiper）
  • PHP（联系表单、邮件订阅后端）
  • MailChimp API

项目结构

text
daexhtml-10/
├── Daex-v1-0-Template/
│   ├── index-*.html          # 7 种首页变体
│   ├── contact.php           # 联系表单处理
│   ├── subscribe.php         # MailChimp 订阅
│   ├── css/
│   │   ├── style.css         # 主样式
│   │   └── plugins.css       # 插件样式
│   ├── js/
│   │   ├── daex.js           # 主体交互逻辑
│   │   └── plugins.js        # 第三方插件
│   ├── img/                  # 图片资源
│   └── mailchimp/inc/
│       └── MailChimp.php     # MailChimp SDK
└── Daex-v1-0-Documentation/   # 官方文档

核心文件说明

  • index-*.html — 7 种不同视觉效果的主页（视差、视频背景、Ken Burns 等）
  • contact.php — 处理访客提交的联系表单并发送邮件
  • subscribe.php — 对接 MailChimp API，实现新闻订阅功能
  • css/style.css — 全部 CSS 样式，定义了背景图、动画、按钮等
  • js/daex.js — 倒计时、菜单、订阅面板等交互逻辑
  • mailchimp/inc/MailChimp.php — MailChimp PHP SDK，需配合 subscribe.php 使用

快速开始

  1. 直接在浏览器打开 Daex-v1-0-Template/index-SINGLE-IMAGE.html 预览效果
  2. 或配置本地服务器（如 php -S localhost:8000）以启用联系表单和订阅功能
  3. 修改 contact.php 中的 $myemail 为实际邮箱地址
  4. 修改 subscribe.php 中的 API Key 和 List ID 以连接 MailChimp

使用建议

  • 选择适合的首页变体（视频背景适合创意项目，静态图适合加载速度优先的场景）
  • 生产环境请务必替换所有占位内容（邮箱、API Key、图片、社交链接）
help_outline

常见问题