影片筆記:ChatGPT 5.6 做出隨來源資料即時變動的網頁 | 免資料庫、不用架網站、零維護成本!| 追蹤【龍龍FB粉專頁】,17門課程0元免費領回家!前100名免費,先搶再說!送完為止!
YouTube 影片框會固定在左上方;點擊右側逐字稿時間戳可跳到對應時間。
一句話總結
本影片演示如何利用 ChatGPT 的 Sites 外掛 搭配 Google Sheets,建立一個無需資料庫、零維護成本的動態網頁。透過將 Google Sheets 設定為「知道連結的人皆可檢視」,並讓 ChatGPT 直接串接該試算表連結,所建立的網站能即時同步來源資料的變動,適用於報價單、活動行程、庫存清單等需頻繁更新的動態資料。
核心重點
- 技術組合:ChatGPT Sites 外掛 + Google Sheets。
- 運作原理:
- Google Sheets 設定為「知道連結的人皆可以檢視」。
- ChatGPT 透過 Sites 外掛串接該連結,直接讀取最新資料。
- 來源資料變動時,網站內容即時同步更新。
- 優勢:
- 無需重新調整網頁程式碼。
- 無需手動發布。
- 適合管理頻繁變動的動態資料(如報價單、活動行程、庫存清單)。
- 痛點解決:解決網站管理時資料需頻繁手動更新的困擾。
詳細大綱
一、 核心概念與優勢
- 痛點解決:解決網站管理時資料需頻繁手動更新的困擾。
- 技術組合:ChatGPT Sites 外掛 + Google Sheets。
- 運作原理:
- Google Sheets 設定為「知道連結的人皆可以檢視」。
- ChatGPT 透過 Sites 外掛串接該連結,直接讀取最新資料。
- 來源資料變動時,網站內容即時同步更新。
- 優勢:
- 無需重新調整網頁程式碼。
- 無需手動發布。
- 適合管理頻繁變動的動態資料(如報價單、活動行程、庫存清單)。
二、 實作步驟詳解
準備資料:
- 範例為銷售資料 CSV 檔案(約 1825 筆)。
- 上傳至 Google 硬碟指定目錄。
- 關鍵動作:點選檔案,選擇用 Google 試算表 開啟(而非直接分享 CSV)。
- 關閉視窗後,目錄中會產生對應的 Google 試算表檔案。
設定權限:
- 對該 Google 試算表檔案右鍵點選「共用」。
- 存取許可權調整為「知道連結的任何人」。
- 複製該連結。
ChatGPT 設定與提示詞:
- 選擇 Terra 模型。
- 推理強度設為「高」。
- 使用 Sites 外掛功能。
- 將剛才複製的 Google 連結替換提示詞中的 URL。
- 提示詞目標:
- 網站連線開放資料並保持連線。
- 產生 BI 分析儀錶板(中文版)。
- 對象為經營高層。
- 首頁需直接說明洞察結果與建議方針。
開發與選擇:
- ChatGPT 呼叫「建設網站」技能 (Skill)。
- 系統預設提供三種視覺方向供選擇(若未直接生成):
深藍色系。
淺色系。
偏綠色系。
- 使用者回覆選項(如回覆 2),ChatGPT 繼續進行完整開發。
驗證與修改:
- 約 4-5 分鐘完成網站建設。
- 在新分頁開啟檢視內容(標題、重點 Highlight、洞察資訊、營收/行銷/商品/區域績效分析)。
- 即時更新測試:
- 在原始 Google Sheets 新增一筆北區資料。
- 重新整理網站頁面,確認數值已同步更新(例如從 280,252 變更為 281,039)。
- 細部修改:
- 回到 ChatGPT 對話視窗輸入提示詞(如修改首頁名稱)。
- 重新整理網站頁面確認標題已變更。
分享與存取:
- 預設狀態下其他人無法觀看。
- 在聊天視窗點選「分享」。
- 選擇「知道連結的人可以觀看」並儲存。
- 複製連結傳送給觀看者。
工具 / 模型 / 名詞整理
- ChatGPT
- Sites 外掛 (ChatGPT 的功能/外掛)
- Google Sheets (Google 試算表)
- Google 硬碟
- Terra (模型名稱)
- BI 分析儀錶板 (功能描述)
- CSV (檔案格式)
- Skill (技能/功能名稱,原文提及「建設網站的技能 Skill」)
操作流程整理
資料準備與轉換:
- 將銷售資料 CSV 檔案(約 1825 筆)上傳至 Google 硬碟。
- 在 Google 硬碟中點選該 CSV 檔案,選擇用 Google 試算表 開啟。
- 關閉視窗後,確認目錄中已產生對應的 Google 試算表檔案。
權限設定:
- 在 Google 硬碟中找到該試算表檔案。
- 右鍵點選檔案,選擇「共用」。
- 將存取許可權調整為「知道連結的任何人」。
- 複製該共享連結。
ChatGPT 指令輸入:
- 在 ChatGPT 中選擇 Terra 模型。
- 將推理強度設為「高」。
- 啟用 Sites 外掛 功能。
- 輸入提示詞,將剛才複製的 Google 連結替換提示詞中的 URL 位置。
- 提示詞內容需包含:網站連線開放資料並保持連線、產生 BI 分析儀錶板(中文版)、對象為經營高層、首頁需直接說明洞察結果與建議方針。
網站開發與風格選擇:
- ChatGPT 呼叫「建設網站」技能 (Skill)。
- 系統預設提供三種視覺方向供選擇:
深藍色系。
淺色系。
偏綠色系。
- 使用者回覆選項(例如回覆 2),ChatGPT 繼續進行完整開發。
驗證與即時更新測試:
- 等待約 4-5 分鐘完成網站建設。
- 在新分頁開啟檢視內容,確認包含標題、重點 Highlight、洞察資訊、營收/行銷/商品/區域績效分析。
- 即時更新測試:
- 在原始 Google Sheets 新增一筆北區資料。
- 重新整理網站頁面,確認數值已同步更新(例如從 280,252 變更為 281,039)。
- 細部修改測試:
- 回到 ChatGPT 對話視窗輸入提示詞(如修改首頁名稱)。
- 重新整理網站頁面確認標題已變更。
分享連結:
- 預設狀態下其他人無法觀看。
- 在聊天視窗點選「分享」。
- 選擇「知道連結的人可以觀看」並儲存設定。
- 複製連結傳送給觀看者。
值得注意的限制或風險
- 預設隱私限制:預設狀態下其他人無法觀看網站,必須手動在聊天視窗點選「分享」並調整權限為「知道連結的人可以觀看」。
- 資料同步依賴:網站內容即時同步更新依賴於 Google Sheets 的權限設定為「知道連結的人皆可以檢視」,若權限變更或連結失效,網站可能無法讀取資料。
- 開發時間:網站建設約需 4-5 分鐘,並非即時生成。
- 資料規模:範例中使用約 1825 筆銷售資料,未提及更大規模資料的效能表現。
逐字稿辨識疑點
- Terra 的模型:逐字稿中明確提到「選擇 Terra 的模型」,此為 ChatGPT 模型名稱的聽寫或口誤,需查證是否指代特定模型版本或名稱。
- Sites 外掛:ChatGPT 官方功能通常稱為 "Browse" 或 "Canvas" 或特定插件,"Sites" 一詞在逐字稿中出現多次,需確認是否為特定外掛名稱或口誤。
- 建設網站的技能 Skill:逐字稿提到「呼叫建設網站的技能 Skill」,"Skill" 一詞需查證是否為特定功能模組的名稱。
- 280,252 / 281,039:這些數值為影片中的具體數據範例,若與實際操作不符,僅為影片演示數據。
- abcd公司:提示詞範例中提到的公司名稱,為虛構範例。
可延伸追問
- 此方法是否支援更複雜的資料關聯或多個試算表的串接?
- 若 Google Sheets 的資料結構發生重大變更(如欄位增減),網站是否會自動適應或需要重新生成?
- 「Terra」模型與一般 ChatGPT 模型在此功能上的差異為何?
- 此方法生成的網站是否支援使用者互動(如表單提交)或僅為只讀展示?
- 若資料量超過數萬筆,此方法的效能與載入速度如何?
逐字稿時間軸
右側可一路往下捲;左側影片框會固定。點擊時間戳會讓左側影片跳到對應秒數。
00:00:00.000 → 00:00:08.200
免資料庫零維護成本,教你用ChatGPT做出隨來源資料即時變動的網頁
00:00:08.200 → 00:00:14.400
許多人在管理網站的時候,經常面臨資料需要頻繁手動更新的困擾
00:00:14.400 → 00:00:22.600
其實只要善用ChatGPT的Sites外掛功能,搭配我們常用的Google Sheets就能夠輕鬆的解決
00:00:22.600 → 00:00:28.900
我們只需要將Google Sheets設定為知道連結的人皆可以檢視
00:00:28.900 → 00:00:35.000
並且開放讀取的許可權,接著透過ChatGPT的Sites外掛進行串接
00:00:35.000 → 00:00:39.400
又能夠讓ChatGPT直接讀取表單內的最新資料
00:00:39.400 → 00:00:45.700
如此一來,建構出我的網站,只要您的來源Google Sheets裡面的資料有變動
00:00:45.700 → 00:00:50.300
所建立的網站內容就可以即時的同步更新資料
00:00:50.300 → 00:00:55.300
完全不需要重新調整網頁程式碼或者是進行手動的發布
00:00:55.300 → 00:00:59.400
這項方法非常適合用來管理需要頻繁變動的動態資料
00:00:59.400 → 00:01:03.000
例如報價單、活動行程、庫存清單等等
00:01:03.000 → 00:01:05.800
能夠為您節省大量的維護時間
00:01:05.800 → 00:01:07.800
接著帶你來進行實作
00:01:07.800 → 00:01:10.400
這裡我會提供一個範例的資料檔
00:01:10.400 → 00:01:12.500
這個是一個銷售的資料
00:01:12.500 → 00:01:16.200
裡面有大概1825筆的資料
00:01:16.200 → 00:01:18.600
這筆資料它是CSV的檔案
00:01:18.600 → 00:01:22.600
接著我們先把資料上傳到你的Google的硬碟裡面
00:01:22.600 → 00:01:25.200
你可以建一個目錄,把它放在這個目錄裡面
00:01:25.200 → 00:01:27.000
我們直接把它上傳進來
00:01:27.000 → 00:01:31.000
完成之後,記得我們不是要把這個檔案開成分享
00:01:31.000 → 00:01:34.900
我們直接點選讓他使用Google的試算表去開啟
00:01:34.900 → 00:01:36.900
這個時候你再把這個視窗關掉
00:01:36.900 → 00:01:39.500
我們再回到同一個目錄下面
00:01:39.500 → 00:01:42.400
你會發現多了一個Google的試算表的檔案
00:01:42.400 → 00:01:44.900
我們就是要分享這個檔案
00:01:44.900 → 00:01:47.700
右鍵點選共用
00:01:47.700 → 00:01:52.200
存取許可權下拉調整成知道連結的任何人
00:01:52.200 → 00:01:56.200
並且複製這個連結,待會會使用到我們點選完成
00:01:56.200 → 00:01:59.400
接著我們回到ChatGPT這邊
00:01:59.400 → 00:02:02.800
我們選擇Terra的模型就可以了
00:02:02.800 → 00:02:05.000
並且推理強度用成高
00:02:05.000 → 00:02:07.800
並且貼上提供給大家的提示詞
00:02:07.800 → 00:02:11.200
這裡我們使用它的外掛Sites的功能
00:02:11.200 → 00:02:14.400
請他讀取這個Google的連結的資料
00:02:14.400 → 00:02:18.600
我們把剛才的連結直接替換掉這個URL
00:02:18.600 → 00:02:22.600
我們就是希望網站能夠連線開放的資料
00:02:22.600 → 00:02:25.000
並且保持資料的連線
00:02:25.000 → 00:02:28.500
最後幫我們產生一個BI分析的儀錶板
00:02:28.500 → 00:02:30.200
而且是中文的版本
00:02:30.200 → 00:02:32.600
目的是做給經營高層觀看
00:02:32.600 → 00:02:37.200
而且首頁要直接說明洞察的結果跟建議的方針
00:02:37.200 → 00:02:39.200
接著直接傳送出去
00:02:39.200 → 00:02:41.800
他開始讀取Google試算表的資料
00:02:41.800 → 00:02:44.400
並且來進行網站建設
00:02:44.400 → 00:02:48.000
並且呼叫建設網站的技能Skill
00:02:48.000 → 00:02:49.800
來幫我們完成這個任務
00:02:49.800 → 00:02:54.400
接著他幫我們會先設計三種高階管理儀錶板的
00:02:54.400 → 00:02:56.600
首頁的視覺呈現的方向
00:02:56.600 → 00:02:58.400
待會可以讓我們做選擇
00:02:58.400 → 00:03:00.800
當然你有可能會跟我呈現的不一樣
00:03:00.800 → 00:03:02.800
他也許會直接幫你做出來
00:03:02.800 → 00:03:04.200
並不會讓你做選擇
00:03:04.200 → 00:03:08.000
接著他幫我們產生了三個視覺的儀錶板
00:03:08.000 → 00:03:10.000
第一個是深藍色的
00:03:10.000 → 00:03:12.400
第二個是淺色系的
00:03:12.400 → 00:03:15.000
第三個的是偏綠色系的
00:03:15.000 → 00:03:19.800
我們選擇中間這個適合帶到董事會的管理報告
00:03:19.800 → 00:03:22.200
接著我們只要回覆1,2,3就可以了
00:03:22.200 → 00:03:23.800
那我就回覆2
00:03:25.800 → 00:03:29.400
接著他就會繼續幫我們進行完整的開發
00:03:29.400 → 00:03:32.800
接著我們看到大概在花了四、五分鐘的時候
00:03:32.800 → 00:03:34.400
這個網站已經完成了
00:03:34.400 → 00:03:36.200
我們可以點選畫面這裡
00:03:36.200 → 00:03:38.200
在新分頁中開啟
00:03:38.200 → 00:03:39.400
好這裡我們可以看到
00:03:39.400 → 00:03:42.600
包括了標題各個重點的highlight
00:03:42.600 → 00:03:44.000
還有洞察的資訊
00:03:44.000 → 00:03:46.600
這邊都很完整的呈現出來
00:03:46.600 → 00:03:49.800
包括了左邊的地方也分為了營收分析
00:03:50.800 → 00:03:53.000
商品表現跟區域的績效
00:03:53.000 → 00:03:56.400
接著我們來測試一下能不能及時的更新
00:03:56.400 → 00:03:59.600
接著我們大概看一下這邊有一個加總的資料
00:03:59.600 → 00:04:01.000
280,252
00:04:01.000 → 00:04:03.000
這個是北區的部分
00:04:03.000 → 00:04:05.000
我們再回到我們的資料來源這邊
00:04:05.000 → 00:04:07.800
我們點選這個試算表開啟來
00:04:07.800 → 00:04:10.200
那我們資料拉到最後面
00:04:10.200 → 00:04:12.200
那我們這邊呢是一個北區的資料
00:04:12.200 → 00:04:14.200
我們再新增一筆資料進來
00:04:14.200 → 00:04:18.300
我們看一下原來資料這裡是280252
00:04:18.300 → 00:04:20.400
接著我們再進行重新整理
00:04:20.400 → 00:04:23.500
你會看到這邊原本的資料已經變成
00:04:23.500 → 00:04:25.500
281039了
00:04:25.500 → 00:04:28.400
表示這個資料他是有進行連動的
00:04:28.400 → 00:04:30.300
今天我們就是透過
00:04:30.300 → 00:04:32.000
ChatGPT的Sites外掛
00:04:32.000 → 00:04:35.300
再加上連線我們自有的Google Sheets的資料
00:04:35.300 → 00:04:38.100
就能夠完成一個動態網站的製作
00:04:38.100 → 00:04:40.900
如果你針對這個網站要做細部的修改
00:04:40.900 → 00:04:43.200
包括了標題的修改功能的修改
00:04:43.200 → 00:04:44.700
你就只要回到
00:04:44.700 → 00:04:47.400
原來的對話視窗這邊來進行輸入
00:04:48.100 → 00:04:52.300
例如說我希望將首頁名稱改成
00:04:52.300 → 00:04:56.100
abcd公司的經營決策儀錶板
00:04:56.100 → 00:04:58.600
直接在這個地方下提示詞就可以了
00:04:58.600 → 00:05:02.000
接著完成之後我們回到網站這邊
00:05:02.000 → 00:05:03.600
我們直接重新整理看看
00:05:03.600 → 00:05:05.600
好這邊的title
00:05:05.600 → 00:05:07.800
就已經是幫我們改過來了
00:05:07.800 → 00:05:09.400
今天我們的網址
00:05:09.400 → 00:05:11.500
如果要給其他人觀看的話
00:05:11.500 → 00:05:14.400
如果你沒有去做特別許可權的設定
00:05:14.400 → 00:05:16.800
其他人是沒有辦法看到內容的
00:05:16.800 → 00:05:19.600
接著我們可以在聊天視窗這邊
00:05:23.100 → 00:05:25.500
知道連結的人可以觀看
00:05:27.000 → 00:05:31.100
這裡你會得到一個連結點選複製連結
00:05:31.100 → 00:05:33.100
接著我們再把連結
00:05:33.100 → 00:05:35.100
傳送給需要觀看的人
00:05:35.100 → 00:05:37.400
他在把網址貼上的時候
00:05:37.400 → 00:05:39.300
就一樣可以看到內容了
00:05:39.300 → 00:05:40.900
是不是非常的方便呢