iKanBot苹果CMSV10纯白影视模板 双栏响应式原生JS源码

苹果CMS模板截图

简介

iKanBot为苹果CMS V10开发，整体采用纯白简约风格，移除弹窗广告与会员相关组件，页面重心集中在影视资源展示。整套模板由HTML5、CSS3与原生JavaScript构建，配色使用白色底色，搭配浅蓝色主题色与深灰正文，观感柔和。

• 采用HTML5语义标签搭建页面结构，使用header、main、section、aside等标签，层级规整。

• 经典左右双栏布局，左侧放置影片主体内容，右侧侧边栏承载榜单推荐；影片封面使用Grid网格6列排版，卡片悬浮带有轻微上浮效果。

• 支持电脑、平板、手机三端响应式，小屏幕自动减少封面列数，顶部导航转为汉堡菜单适配触控操作。

• 无第三方UI框架依赖，配色通过CSS变量统一管理，修改主题色仅需调整一处参数；保留完整{maccms}调用标签，可修改num参数控制每页数据量。

• 图片使用IntersectionObserver实现懒加载，减少初始页面资源加载量。

模板自带完整站点功能，顶部导航附带二级下拉分类，搭配全域视频搜索框。首页区分热门电影、热播剧集板块；分类页面提供子分类导航，方便题材筛选。影片详情页展示海报与资料，播放页使用16:9播放器，通过TAB标签切换多条播放线路，侧边固定展示影片简介。

搜索结果页为网格封面布局，附带筛选控件；右侧侧边栏放置一周口碑影片榜单。页面底部预留友情链接区域，内置统一分页组件、返回顶部按钮与RSS订阅入口。公共文件拆分为头部、尾部、分页、静态资源引入、SEO元数据，首页、分类、筛选、详情、播放、搜索均为独立页面文件。样式、脚本、图片素材分目录存放。

教程

前置环境要求

服务器部署苹果CMS V10.0或更高版本；PHP版本7.0及以上，MySQL 5.6及以上；服务器开启URL伪静态，支持Apache、Nginx环境。

分步部署操作

1. 上传模板文件：将muban完整文件夹上传到服务器template目录，保证路径 /www/template/muban/。

2. 后台切换模板：登录苹果CMS后台，进入系统、网站参数配置、基本设置，模板下拉选择muban并保存。

3. 绑定分类模板：进入视频分类管理，编辑各个分类，为封面、筛选、详情、播放、搜索绑定对应模板文件，文章分类执行同样绑定操作。

4. 清理缓存：进入系统缓存管理，清空模板缓存和数据缓存，刷新前台页面即可加载模板。