Claude Code 做網站教學：不會寫程式也能做出店家官網嗎？

先看重點

• 用的是電腦上 Claude 桌面 App 裡的 Code 功能，要 Pro 以上的付費方案。
• 先開一個新資料夾，再把店名、價格、地址、營業時間講清楚，菜單照片直接丟進去。
• 給它兩三張你喜歡的網站截圖，切成 Plan 模式，看完計畫再按同意。
• 只打一句「幫我做網站」，多半只會拿到跟別人長得差不多的模板。

以前想要一個店家網站，大概只有兩條路：找人接案，或是自己套網站平台的版型，一個欄位一個欄位填。現在多了第三條路，你用講的，告訴 Claude Code 你的店是什麼樣子，它幫你把網站寫出來。

我自己不是工程師，官網也是這樣一步一步跟它講出來的。所以我把做法整理成照著走就好的版本，下面用一間示範用的豆花店「小貓豆花」當例子，店名、價格都是我編的，換成你自己的就可以。

先說好，這篇講的是介紹店家的網站，首頁、菜單、交通、聯絡方式這種。要線上收款、會員登入這類功能，步驟會多很多，這篇先不談。

開始前要準備的東西

這四樣先準備好，後面會順很多。

• Claude 桌面 App：裝在電腦上，Windows 和 Mac 都有。還沒裝的話，可以看Claude Desktop 下載教學。
• Pro 以上的付費方案：App 裡的 Code 功能要付費方案才能用，台灣實際要付多少可以看Claude 訂閱價格整理。
• 你的店家資料：店名、賣什麼、價格、地址、營業時間、聯絡方式。
• 照片和參考圖：菜單照片、Logo，再加兩三張你喜歡的網站截圖。

步驟一：開一個新資料夾

在桌面或任何你找得到的地方，開一個新資料夾，名字隨你取，例如「我的店網站」。打開 Claude 桌面 App，點上面的 Code，在輸入框底下選這個資料夾。

為什麼要另外開一個？Claude Code 做出來的檔案都會放進你選的資料夾，網站的每一頁、每一張圖都在裡面。跟其他檔案混在一起，之後要找、要改都很麻煩。

步驟二：把你的店講清楚

這一步真的最重要，也最多人跳過。它不認識你的店，你沒講的，它只能自己猜，猜出來通常就是很一般的內容。

至少要講這幾樣：店名、賣什麼、價格、地址、營業時間、聯絡方式。再多寫一句「我的店跟別人不一樣的地方」，像示範的小貓豆花就寫了花生每天早上自己煮、糖水不加香精，網站的文案就會有你的味道。

下面這份範本可以直接複製，把冒號後面填好就好：

我想幫我的店做一個網站，我不會寫程式，請用最簡單的方式做。

店名：
賣什麼：
價格：
地址：
營業時間：
聯絡方式（LINE／電話／IG）：
我的店跟別人不一樣的地方：
主要想給誰看：

網站要有：首頁、菜單或服務、交通方式、聯絡我們。
手機看也要好看。
我附上的截圖是我喜歡的感覺，請參考配色和排版，但不要照抄。

步驟三：菜單照片和 Logo 直接丟進去

菜單有照片的話，直接把照片拖進輸入框就好，不用自己一項一項打字。它看得懂照片上的品項和價格，會幫你整理成網站上的菜單。Logo 也一樣，拖進去它就會放到網站上。

不過照片上的字太小或太糊，它也可能看錯。做好之後，價格記得自己核對一次。

步驟四：給它兩三張你喜歡的網站截圖

光用講的形容「我想要清爽一點」「要有質感」，每個人腦中的畫面都不一樣。最快的方法是直接給它看：找兩三個你喜歡的網站，截圖拖進輸入框，跟它說「我想要這種感覺」。

不知道去哪找的話，可以上 Pinterest 或 Dribbble，搜你的行業加上 website，例如「cafe website」。

要提醒一下，截圖是拿來參考配色和排版的，範本裡我也寫了「不要照抄」。把別人的網站整個複製下來，版權上有疑慮，做出來也不像你的店。

步驟五：切成 Plan 模式再送出

資料和圖片都放好之後，先不要急著送出。輸入框底下有一個寫著 Auto 的地方，點開，切成 Plan，再送出。

Plan 模式是讓它先想好要怎麼做，列成一份計畫給你看，這時候還不會真的動手改檔案。網站要做幾頁、每頁放什麼、用什麼顏色，你都可以先看過。

步驟六：看完計畫再按同意

計畫出來之後，花一兩分鐘看一遍。頁面有沒有少、菜單有沒有放、聯絡方式對不對。哪裡不喜歡就直接打字跟它講，例如「交通方式那頁加上附近的捷運站」，它會改好計畫再給你看。

沒問題了再按同意，它就會開始寫。這段要等幾分鐘，可以先去倒杯水。

步驟七：做好之後，用講的改

做好之後跟它說「幫我打開來看」，它就會把網站開給你看。想改什麼直接講：「標題大一點」「顏色再淡一點」「菜單改成兩欄」，不用自己去找程式碼在哪裡。

一次講一件事，比一次丟十個要求更容易改對。改到不喜歡，就跟它說剛剛那個改動不要了，請它改回來。

步驟八：放上網路

到這裡，網站還只在你的電腦裡。要讓別人看得到，就跟它說「幫我免費放到網路上，一步一步教我」。它通常會帶你用 Vercel、Netlify 或 GitHub Pages 這類有免費方案的服務，註冊帳號、登入這些要你自己按，其他它會一步一步講給你聽。

想用自己的網址，例如 xiaomao.com，要另外買網域，一年大概幾百元起，買好再請它教你怎麼接上去。

最常踩的雷：只打一句「幫我做網站」

最常見的狀況，是打開 App 只打一句「幫我做網站」就送出。它不知道你賣什麼、在哪裡、喜歡什麼風格，只好給你一個最安全的版本，做出來就跟隔壁那家長得差不多。

所以會不會寫程式，其實沒那麼重要。決定網站像不像你的，是步驟二到步驟四那些資料。

常見問題

完全不會寫程式也做得出來嗎？

可以。整個過程都是用講的，程式碼它寫。你要做的是準備店家資料、看計畫，然後說你想怎麼改。

要花多少錢？

Claude 的 Pro 以上方案是一定要的。放上網路可以先用免費方案，想要自己的網址才需要另外買網域。

之後要改營業時間怎麼辦？

再打開 Claude 桌面 App，選同一個資料夾，跟它說要改什麼。改好之後，再請它更新到網路上。

網站做出來之後，最常更新的會是菜單和營業時間，這些你都能自己跟它講，不用每次都找人。

那你的店，最想讓客人在網站上第一眼看到什麼呢？