项目简介link

WowTube 是一套基于 Bootstrap 5 的 OTT 视频流媒体平台 HTML 模板，提供电影、剧集、综艺等多种内容展示页面，适用于快速搭建在线影视平台或视频点播网站。模板包含 3 个首页变体及完整的详情页、新闻、定价、团队等附加页面。

技术栈link

• HTML5 + CSS3（原生样式 + SCSS 源码）
• Bootstrap 5（响应式布局框架）
• jQuery（DOM 操作与交互）
• Swiper.js（轮播与幻灯片）
• Magnific Popup（图片/视频弹窗）
• MeanMenu（移动端导航）
• Nice Select（自定义下拉框）
• WOW.js（滚动动画）

项目结构link

wowtubehtml-10/
└── Main files/
    ├── index.html          # 首页（主）
    ├── index-2.html        # 首页变体 2
    ├── index-3.html        # 首页变体 3
    ├── movie.html          # 电影列表页
    ├── movie-details.html  # 电影详情页
    ├── tv-shows.html       # 综艺/剧集列表
    ├── tv-shows-details.html
    ├── web-series.html     # 网络剧列表
    ├── web-series-details.html
    ├── news.html           # 资讯列表
    ├── news-details.html
    ├── pricing.html        # 定价方案
    ├── about.html          # 关于我们
    ├── team.html           # 团队成员
    ├── contact.html        # 联系页面
    ├── login.html          # 登录页
    ├── 404.html            # 错误页
    ├── cooming-soon.html   # 即将上线页
    └── assets/
        ├── css/            # 编译后样式（含 main.css.map）
        ├── scss/           # SCSS 源码
        ├── js/             # 脚本文件
        └── img/            # 图片资源

核心文件说明link

• Main files/index.html — 主首页入口，包含轮播区、精选内容、CTA 等模块
• assets/css/main.css — 完整编译样式，定义了主题色、排版、布局等所有视觉规则
• assets/scss/ — SCSS 源码目录，按模块（_header.scss、_hero.scss、_movie.scss 等）组织，便于定制主题
• assets/js/main.js — 交互逻辑：导航初始化、弹窗、轮播、计数器等插件的调用配置
• assets/css/bootstrap.min.css — Bootstrap 5 核心框架，提供栅格系统与基础组件
• assets/css/color.css — 主题色变量文件，定义了 CSS 自定义属性（--theme、--theme2 等）

快速开始link

1. 进入 Main files 目录，直接在浏览器中打开 index.html 即可预览全部页面。

2. 如需本地服务器（推荐），可使用任意静态服务器工具，例如：

   bashcontent_copyCopy

   # Python 3
   cd wowtubehtml-10/Main\ files
   python -m http.server 8080
   
   # 或使用 VS Code Live Server 插件
   

3. 模板内含完整 SCSS 源码，修改样式后可重新编译为 main.css。

使用建议link

• 视频播放功能需要自行对接后端播放器或第三方服务（如 Video.js、DPlayer），当前模板仅提供视频弹窗预览。
• 移动端菜单依赖 MeanMenu 插件，assets/js/main.js 中已默认初始化，若页面无移动菜单需检查 #mobile-menu 元素是否存在。
• SCSS 模块化程度高，建议在 _color.scss 或 color.css 中统一管理主题色，便于后期品牌换肤。