投票打榜模板

教育企業內部互動玩法

示例：最美班級風采 · 投票打榜 · 投票榜

幫我做一個投票打榜的網頁，發到家長群裡讓大家投：學校六一評「最美班級」，8 個班參選。手機豎屏為主，電腦上居中一塊手機大小的舞臺。首屏是活動主視覺（彩旗、氣球的插畫，大標題）、一個走秒的截止倒計時，下面是即時前三的領獎臺：中間第一、左邊第二、右邊第三，柱子高度按票數比例，頁面開啟時柱子從檯面長出來，柱頂是班級頭像、班名和票數；接著是 8 個班的卡片，按票數排名，每張有插畫封面、班名和暱稱、一句口號、一句做了什麼、一條票數條和「投一票」按鈕，點了票數 +1 往上飄、名次變了卡片要動畫交換位置，有輕的提示音（可靜音）；每人每天 3 票，只在頁面上提示還剩幾票；投票存到一張資料表（每行一票：班級、投票人稱呼），頁面讀這張表把票數加到已有票數上，領獎臺、卡片和總票數三處要對得上；指令碼不跑時也能看靜態排行，並有一個選班級的投票表單。最後寫活動規則（投票時間、每天幾票、誰能投、平票怎麼算）和獎項設定。顏色明快但別花，插畫全用內聯向量圖畫。以後補候選或改截止時間就更新同一個連結。

參考模板：先讀 https://space.24haowan.com/examples/sample-vote-rank/agent.md ，照它的結構和版式做，內容全部換成我的；做成一個單檔案 HTML（樣式寫在頁面裡、不引用外部檔案，手機上好看），並提供 .html 檔案下載。
· 你有活頁工具（MCP）：用樣例 sample-vote-rank 當底稿（list_examples key=sample-vote-rank），發成活頁，先給我看預覽。
· 沒有活頁工具、但能發 HTTPS 請求：把做好的 HTML 以 Content-Type: text/html POST 到 https://space.24haowan.com/api/quick?client=template-sample-vote-rank ，把返回的預覽連結和認領連結給我（7 天臨時連結）。
如果你還沒有活頁聯結器（MCP），先讀 https://space.24haowan.com/for-agents.md ，照裡面的說明接入，或不登入直接發布。

豆包、DeepSeek、Kimi、元寶、ChatGPT、Claude……能上網讀連結的都可以

看真頁面

發成微信裡能開啟的連結

WorkBuddy、Claude、Codex 等支援 MCP 的 Agent，微信掃碼登入

第一次在 WorkBuddy 裡接活頁？看圖文手冊 ›

幫我接入活頁：先讀 https://space.24haowan.com/for-agents.md ，一步步帶我完成；然後參考 https://space.24haowan.com/examples/sample-vote-rank/agent.md 做一份我自己的「最美班級風采 · 投票打榜」，發成活頁，先給我看預覽。

我的要求：幫我做一個投票打榜的網頁，發到家長群裡讓大家投：學校六一評「最美班級」，8 個班參選。手機豎屏為主，電腦上居中一塊手機大小的舞臺。首屏是活動主視覺（彩旗、氣球的插畫，大標題）、一個走秒的截止倒計時，下面是即時前三的領獎臺：中間第一、左邊第二、右邊第三，柱子高度按票數比例，頁面開啟時柱子從檯面長出來，柱頂是班級頭像、班名和票數；接著是 8 個班的卡片，按票數排名，每張有插畫封面、班名和暱稱、一句口號、一句做了什麼、一條票數條和「投一票」按鈕，點了票數 +1 往上飄、名次變了卡片要動畫交換位置，有輕的提示音（可靜音）；每人每天 3 票，只在頁面上提示還剩幾票；投票存到一張資料表（每行一票：班級、投票人稱呼），頁面讀這張表把票數加到已有票數上，領獎臺、卡片和總票數三處要對得上；指令碼不跑時也能看靜態排行，並有一個選班級的投票表單。最後寫活動規則（投票時間、每天幾票、誰能投、平票怎麼算）和獎項設定。顏色明快但別花，插畫全用內聯向量圖畫。以後補候選或改截止時間就更新同一個連結。

分享海報

微信里長按圖片儲存或轉發給朋友；掃碼就能開啟這個模板。

下載海報

這份模板

要在群裡發起一場評選、讓大家點一下就投票並即時看排名的，選它：最美班級、優秀團隊、最佳作品、年會節目、門店評比。候選一般 4–12 個，每個有一張封面和一句話。只是問大家「選哪個時間 / 去哪裡」、不需要排名與領獎臺的，選 sample-event-signup；請人來參加活動、收出席回執的，選 sample-invitation。

頁面結構：即時排行 · 8 個班 · 投票 · 規則與獎項

一鍵投票寫回資料表（原生表單 POST ./_data/votes 打底，指令碼在時頁內提交），頁面讀回即時算票數和排名
首屏領獎臺按票數長高、名次變化時卡片換位，排行本身就是一張值得截圖轉發的畫面
同一連結更新不變（補候選、改截止時間都在這一頁），閱讀回執看看哪幾節被看了
微信卡片（share.title / share.desc）

發之前要備好：資料表 votes（列 class / voter，append_open=true）：「投一票」和文末表單都寫進這裡，一行一票，頁面讀回加到基礎票數上；發布前先用 set_data 建好，到截止時間把 append_open 關掉

看模板原始碼 ›

這份哪裡不合適？提改進建議模板工廠每天看一次，改好了寫進改進記錄

投票打榜模板

同類案例