柜台前排队的客人，点单前会先盯着墙上的菜单看两分钟。这套模板把这块「墙」搬到了网上——菜单页单独成页，按口味分组陈列，每一款配图、配价、配一句原料说明；然后紧接着是商品详情、购物车、结算三页，看完就能直接下单外带。十三个页面，没有一页是凑数的，这在动辄三十页的餐饮模板里算得上克制。
整套视觉是围绕「手作」这件事建立的：陶杯优先、不加糖浆、现点现做、从德里小摊到你家街角，这些话术在页面上是有专属区块承接的，不是塞在一段介绍文字里。博客区也跟着这个调性走，写的是当季水果、五层果昔碗、三款调饮这类内容，天然适合做食材与配方的长尾词。三套首页版式可以按季节主推不同产品线。这套结构同样适用于精品咖啡、手作茶饮、冰淇淋店、沙拉轻食、烘焙工坊、果切外送……凡是「SKU 不多但要拍得好看、靠外带与到店两条腿走路、内容围绕食材讲故事」的生意都合用。
核心功能
菜单单独成页并按口味分组，每款配图、配价、配原料说明
商品详情、购物车、结算三页打通，看完菜单即可下单外带
首屏浮出式购物车面板，加购后不跳页，点单路径不被打断
品牌故事区块承接「手作、无糖浆、陶杯装」这类差异化话术
门店信息区含地址、营业时间与预订入口，到店与外带两条路并列
博客围绕食材与配方展开，天然适配当季水果这类长尾词
用户晒单区块把社交内容接回官网，替代生硬的评价列表
三套首页版式可按季节轮换主推产品线
页面与技术规格
13 个 HTML 页面，含 3 套首页，实测 80 个文件、5.1 MB，整站轻
基于 Bootstrap 5.3.3 栅格，菜单卡片在手机端自动转为单列
产品图放大走
Fancybox，点开即为高清大图，适合展示成品实拍主视觉与产品横滚分别由 Swiper 与 Slick 承担
GSAP 负责区块进场与视差位移，首屏滚动时背景与前景分速移动
页面数少、资源集中，改一套菜单基本只动一个文件
