用 ChatGPT Sites 自製電商儀表板:SHOPLINE MCP 的實作分享

上一篇介紹了如何透過 SHOPLINE MCP,讓 AI 取得電商後台資料。
這篇接著往下做:搭配 ChatGPT Sites,把訂單與商品資料整理成自己用得上的儀表板。

這份儀表板,可以選日期區間、看每天的訂單變化,也能查不同商品的銷量。 完成後,它有自己的網站連結,需要看數字時就能直接開啟。

製作過程中,我用 ChatGPT 透過 SHOPLINE MCP 取得資料,再請 AI 協助整理與製作網頁,發布到 ChatGPT Sites。
這篇就用這個經驗,說明電商與行銷人可以如何從需求出發,做出自己的版本。

ChatGPT Sites 電商儀表板的每日訂單趨勢與日期篩選畫面
電商儀表板的商品分組選擇與每日銷量趨勢圖

我的儀表板功能是什麼

當時我的需求很具體:想快速知道每天有多少筆訂單,以及不同商品各賣了多少。
所以這份儀表板的主要功能,也圍繞這兩個問題展開:

想知道的事情儀表板怎麼呈現
某段期間有多少訂單?日期篩選與區間訂單總數
訂單量每天怎麼變化?每日訂單趨勢圖
哪些商品賣了多少?商品選擇與銷量圖表

對我來說,這樣的頁面很適合拿來做日常查看或開會討論:選一段日期,就能沿著圖表繼續看商品表現。

MCP、AI 和 Sites 在這裡各負責一段工作:

  • MCP 讓 AI 取得有權限讀取的資料
  • AI 定期整理資料與製作介面
  • Sites 則讓完成的網頁有地方可以發布與開啟。
SHOPLINE MCP 取得電商資料,經 AI 整理後製成網站儀表板的示意圖

定義資料需求,用每日排程下載到本機

我的做法是把資料需求寫進每日排程,讓 AI 每天固定透過 SHOPLINE MCP 取得資料,下載並儲存到本機。

資料需求先簡單確認要看哪些數字、取得哪段期間,以及保留哪些欄位。
以這份儀表板來說,就是每日訂單數與個別商品銷量,沿用確認好的計算方式即可。(MCP 串接與權限設定,可以先參考上一篇文章。)

接著在排程中寫清楚每天何時執行、下載到哪個本機資料夾,以及每次如何更新檔案。
這樣每天要看的資料就有固定的取得流程,製作或更新儀表板時,也能從同一個位置找到報表。

例如可以把prompt寫成這樣,再補上自己的執行時間、資料期間與儲存位置:

每天【執行時間】(Asia/Taipei),透過 SHOPLINE MCP 擷取【品牌名稱】含當日在內最近 90 天的訂單與商品資料,依台灣時間分日,當日只統計至開始擷取時的固定截點。

沿用已確認的欄位與計算規則,只輸出「每日成交訂單」「每日SKU銷量」「每日無SKU商品」「每月訂單總量」四張彙總表。月表承接已核對的歷史,重算當月、補齊未結算及缺漏月份,不用 90 天資料推估完整月份;不另存明細,全部存成獨立數值。

將 Excel 存入【本機資料夾】,以品牌與資料期間命名,保留舊報表。同名檔內容相同則跳過,不同則停止回報。核對 API 總數、分頁、去重及逐日/每月合計,再以獨立方式讀回驗證;Excel 原生驗收無法執行時標示待驗收。失敗時保留舊檔並通知,不自行重新認證。

(這是精簡版的,實際使用仍然需要依照你的品牌/商品做更多調整)

有了每天固定下載到本機的資料,接下來就能用它製作與更新 Sites 儀表板。

定義訂單與商品資料需求,透過 SHOPLINE MCP 與 ChatGPT 排程下載 Excel 到本機

用 ChatGPT Sites 做出第一版,再用對話修改

目前可以用 ChatGPT 的網站功能來建立。 在需求裡寫明要製作「網站」,或提及 @Sites,再附上資料。

如果像我一樣,已經在 Codex 專案裡完成取數與整理,就可以接著要求製作儀表板。
例如以下是依本篇案例整理的教學提示詞:

請使用我提供的每日訂單與商品銷量資料,用 ChatGPT Sites 製作電商營運儀表板網站。

上方放日期篩選與區間建立訂單總數,中間放每日訂單趨勢,下方放可選擇商品的銷量圖表。

使用繁體中文,版面簡潔、手機可用,並標示資料截至時間與訂單計算方式。遇到資料缺漏或欄位不清楚,先提出,不自行補造數字。

先提供預覽,確認後再發布。

第一版出來後,試著用它回答工作問題,再回到原對話或從 Sites 開啟既有網站,提出修改需求。例如:

選好日期後,訂單總數與所有圖表都要一起更新;沒有資料時,顯示「此區間沒有資料」。

商品名稱要能完整辨識,並增加銷量排名,顯示所選期間的前十名。

要換資料,也可以在同一個網站繼續更新:

請用這份已核對的新資料更新原本的儀表板,保留版面與篩選功能。

先確認期間、欄位與計算方式一致,依資料範圍取代或合併,避免重複。更新資料截至時間,列出前後訂單總數供我核對,先預覽再發布。

這裡的更新,是把下載下來取得的資料放進網站;日期篩選則是在已有資料裡切換範圍。

資料需求、每日排程與 Excel 下載到本機的三步流程示意

核對成果,再發布與分享

我在整理這份報表時,會核對取得的訂單總數、分頁與重複資料,也確認日期歸到台灣時間後,報表和儀表板顯示的數字一致。

做自己的版本時,可以先選一小段日期來檢查:

  1. 比對來源報表與儀表板,確認訂單總數和某一商品的銷量相符。
  2. 更換日期與商品,確認總數、趨勢圖及表格會依設定一起變動。
  3. 用手機打開預覽,確認標籤、圖表與篩選選單能看清楚、能操作。

這裡也要分辨「沒有資料」與「數值為零」。前者可能是沒有取得那段資料,不能直接補成零,再畫出看似完整的趨勢。

確認後,再請 AI 發布到 Sites,取得網站連結。官方文件提醒,Sites 的部署網址就是正式網站;如果還在檢查,可以明確要求先儲存版本、暫不部署。發布與版本說明

分享時,也要選好存取對象。內部營運儀表板可以依帳號可用的設定,限定給需要查看的人;文章示範畫面則使用去識別化內容。

核對報表數字、手機預覽及 Sites 發布與存取設定的驗收流程

小結

對電商與行銷人來說,可以從每天想知道的一個問題開始:用每日排程把資料下載到本機,再透過 ChatGPT Sites 做成方便查看的儀表板。

之後依實際需求,用對話調整指標、版面與功能,逐步做成自己的工作工具。