字
字节笔记本
2026年2月22日
Mobile App Landing Page Template - 免费开源的移动应用落地页模板
Mobile App Landing Page Template 是一个免费开源的静态生成落地页模板，专为移动应用设计。该项目基于 Jekyll 和 Webpack 构建，提供了丰富的预置功能，帮助开发者快速搭建专业的应用展示网站。
项目简介
Mobile App Landing Page Template 由 Sandoche 开发维护，采用 MIT 许可证开源。截至目前，该项目在 GitHub 上已获得 927 stars 和 261 个 fork。模板设计简洁现代，支持自动深色模式，非常适合展示 iOS 或 Android 应用。
核心特性
该模板内置了丰富的功能模块：
- 应用图标展示 - 突出显示应用品牌标识
- 无限截图轮播 - 展示应用界面截图，支持滚动浏览
- 多平台下载链接 - 支持 Google Play、App Store 和 Web App 链接
- 媒体报道区域 - 展示应用在媒体上的曝光和报道
- Product Hunt 浮动提示 - 集成 Product Hunt 推广组件
- 隐私政策页面 - 内置隐私政策模板页面
- Google Analytics - 内置网站分析追踪
- Cookie 同意弹窗 - 符合 GDPR 规范的 Cookie 提示
- 自动深色主题 - 根据系统偏好自动切换深色/浅色模式
- Doorbell 反馈组件 - 集成用户反馈收集工具
- GitHub Fork 横幅 - 展示开源项目的 Fork 入口
技术栈
- Jekyll - 静态网站生成器
- Webpack - 模块打包工具
- SCSS - CSS 预处理器
- Node.js - 开发环境
- Ruby/Bundler - Jekyll 依赖管理
安装指南
前置要求
- Node.js
- Ruby 和 Bundler
安装步骤
bash
# 克隆项目
git clone https://github.com/sandoche/Mobile-app-landingpage-template.git
cd Mobile-app-landingpage-template
# 安装依赖
npm install
bundler install快速开始
开发模式
bash
npm start构建生产版本
bash
npm run build自定义配置
- 编辑
_config.yml文件，根据需要启用/禁用功能（如 Google Analytics、GitHub 链接等） - 修改
_data/app.yml文件，填入你的应用信息 - 更新
_data/strings.yml文件，自定义页脚链接等文本内容 - 替换
_images文件夹中的应用截图和根目录的icon.png - 编辑
_src/index.js文件，更新 Product Hunt 弹窗配置或移除深色模式插件
使用示例
应用数据配置示例
yaml
# _data/app.yml
name: "My Awesome App"
description: "A revolutionary mobile app"
icon: "icon.png"
screenshots:
- "screenshot1.png"
- "screenshot2.png"
- "screenshot3.png"
play_store_url: "https://play.google.com/store/apps/..."
app_store_url: "https://apps.apple.com/app/..."
web_app_url: "https://myapp.com"一键部署到 Netlify
点击以下按钮即可一键部署到 Netlify（免费托管）：
无代码使用方式
对于不熟悉代码的用户，可以使用 T3MPL 编辑器：
- 访问 T3MPL 编辑器
- 在左侧编辑设置
- 点击
Publish按钮，然后选择Save Webpage as .zip - 解压文件并上传到服务器（可直接拖拽到 Netlify 免费托管）
实际应用案例
以下是使用此模板构建的网站：
项目链接
分享: