起始模板

整個版面都繞著飲品表做的手搖飲網站

八款飲品加兩樣小點、三個分類,每一項都留了照片位。手搖飲店是被菜單牆決定的——那面牆的十行格子,在架站工具裡已經照分類排好,其他區塊都往旁邊站。手搖飲店老闆先換的是照片和價格。

手搖飲專門店網站範本——它實際產出的首頁

此頁以〈霓虹夜市〉設計風格展示 — 15 種風格隨時切換,商家資料保留。

完整首頁
手搖飲專門店網站設計實例——完整首頁
完整內頁
手搖飲專門店網站設計實例——完整內頁
另一個完整內頁
手搖飲專門店網站設計實例——另一個完整內頁

飲品表是一格一格的,不是一段文字

奶茶、水果茶、小點——三個分類、十個品項,每一個都配圖,因為沒有人是看一句話決定要喝什麼的。範例清單就照真的菜單牆在寫:黑糖珍奶、經典珍珠奶茶、炭焙烏龍奶茶、芋頭布丁鮮奶。主視覺下面那條數字帶,是留給手搖店真正會拿出來講的數字用的,例如一天幾杯、排了幾年。

範例網站裡已經放了什麼

三個菜單分類共十項標價品項、一條數字帶、三則範例評價、一組折扣碼,整站四頁。

上面這份清單裡,只要是會從訪客手上收東西、或是要讀即時排程的——表單、預約、優惠碼、訂閱欄位、課程時間表、由內容集合供稿的清單——都是用 Storefront Pro 上線。Storefront 會照你排的樣子發佈頁面其餘的部分;這個模板裡要是有整頁專門拿來做這件事的,那一頁就是要等升級的那一頁。

這個網站涵蓋什麼

內含 4 個頁面

哪些在這個模板裡,哪些留在你自己的系統

甜度、冰塊和加料在範例菜單裡是寫在品名裡的命名規則,不是讓客人現場點選的選項器。每一張飲品照都是佔位圖:手搖店是被自己那杯決定的,所以那是最該先換掉的東西。

這一頁上的每一個數量和金額,都是從模板本身讀出來的,不是有人用手打上去的——所以這些數字跟你真正拿到的網站是同一組。

發佈之後你拿到的

真的有人問的問題

甜度、冰塊與加料是怎麼掛到每一杯飲料上的?

用品項自己的選項群組掛上去,而且每一杯只帶適合它的那幾組。八款飲料全部有冰塊、六款有甜度、四款有加料——加料每杯最多三種,每種各自定價。甜度與冰塊是單選必填:購物車會標示「必選」,沒選完就擋住加入按鈕,並直接點名還沒回答的那一組。兩款小點則完全不帶選項。顧客選了什麼,都會跟著這筆品項一起進到訂單裡。線上點餐要在 Storefront Pro 上才會生效。