建立網站

首先，在 ChatGPT 或 Codex 中描述你想建置的內容。然後審閱初始版本，並逐步完善。

開始使用 sites

在網頁或桌面應用中開啟 ChatGPT。在提示詞中包含“website”一詞，或提及 @Sites，即可啟動 sites 工作流程。例如，你可以要求為運營團隊建立專案請求看板：

提示詞：

Build a project request dashboard website for my operations team. Let team members submit requests, see who owns each one, update the status, and filter the list. Require people to sign in with their workspace account, and keep the request data saved between visits.

看板只是一個範例。你可以根據想建置的網站調整以下流程。

1. 描述網站

   告訴 ChatGPT 網站面向哪些人，以及你希望訪客執行哪些操作。提供網站所需的文件或資料。對於請求看板，你可以提供範例請求、負責人和狀態標籤。

2. 審閱網站

   試用你要求的操作，並對照源材料檢查內容和結果。對於看板，你可以提交請求、更改狀態或按負責人篩選。確認網站如何使用和儲存資訊。

3. 完善網站

   告訴 ChatGPT 你想更改哪些內容，並在有幫助時提供截圖或參考網站。對於看板，你可以這樣要求：“將負責人和狀態篩選器放在請求列表上方。”

4. 管理和分享網站

   傳回 sites 重新開啟或編輯網站。發布前，請完成審閱和分享檢查。選擇哪些人可以存取，並以目標訪客的身份檢查已發布的連結。

儲存記錄和進度

儲存網站版本會保留其內容、設計和行為。訪客請求、狀態更新、上傳的檔案和個人進度需要單獨儲存。告訴 ChatGPT 或 Codex 要儲存什麼，以及哪些人可以讀取或更改這些資訊。

對於共享或個人記錄，請要求在伺服器上強制執行存取規則。檢查更新是否在重新載入後仍然保留，並使用不同帳號確認每個人的存取權限。隱藏按鈕並不能保護底層記錄。

對於提供的檔案，請明確網站應使用副本還是從原始檔重新整理。檢查資訊的最近更新時間。

有關儲存和登入選項，請參閱資料和連線。

建置網站的技巧

• 使用源材料。 附上網站應使用的檔案、連結、定義和公式。要求 ChatGPT 或 Codex 標出缺失的資訊，而不是自行補全。
• 描述空狀態和錯誤狀態。 說明搜尋無匹配結果、表單不完整或連線的應用不可用時，訪客應看到什麼。提供重試或糾正問題的方法。
• 提供視覺參考。 附上截圖或頁面連結，並指出你想採用的細節，例如緊湊的卡片或搜尋框的位置。提供品牌顏色、字型或寫作規範。
• 考慮手機使用。 描述卡片、表格和表單應如何適配窄屏。檢查導航、篩選器和表單控制項是否無需橫向滾動即可使用。
• 標註範例資料。 如果最終內容尚未準備好，請要求將範例記錄標註為範例。分享網站前替換這些記錄。
• 每次聚焦一項更改。 每次提出一項更改，並說明要保留什麼。例如，移動篩選器，同時保留已儲存的記錄、存取規則和現有操作。每次更改後都試用受影響的互動。

Sites 案例展示提供了你可以使用 Sites 建置的 Web 應用範例。

提示詞範例

對於資源中心，可以從一段簡短的提示詞開始：

提示詞：

Build a resource hub website where project leads can search our kickoff resources by task. Use the resource list I attach. Save a version without deploying it so I can review it.

你可以在此請求中補充訪客操作、搜尋規則和設計偏好：

提示詞：

Build a resource hub website for project leads preparing a kickoff. Use the resource list I attach, with its titles, descriptions, task labels, and source links.

Visitor actions:

- Choose a task, such as preparing an agenda.
- Search within that task's resources.
- Select a result to open its source link.

Search rules:

- When the search is empty, show all resources for the selected task.
- If no task is selected, show the full list.
- If there are no matches, offer a way to clear the filters and show the help contact from my list.
- Flag entries with missing titles or links for my review.
- Search filters can reset when the visitor returns.

Design preferences:

- Use a white background and dark text. Keep descriptions to one sentence, with a layout that works on a phone.
- If I provide a reference screenshot, use it for the search placement and compact resource cards.
- If I provide a brand guide, use its accent color.

Save a version without deploying it so I can review the layout and try the search.

對於現有專案，請要求 ChatGPT 檢查相容性並做好發布準備：

提示詞：

Deploy this project with sites. Check whether it is compatible, make any required changes, and give me the deployment URL.

如果網站需要記住記錄或上傳的檔案，請在請求中說明：

提示詞：

Add player scores and avatar uploads to this game. Keep the scores and uploaded avatars between visits.