Codex 小白入門課|第九章
本機檔案、Hostinger 檔案、線上網站,到底差在哪裡?
第九章要解決小白最容易卡住的一句話:我明明上傳了,為什麼網站沒有變?這個問題不是你笨,也不是網站在跟你作對,而是你還沒有把「電腦裡的檔案」、「Hostinger 裡的檔案」和「瀏覽器看到的網站」分清楚。
這一章先不講深奧技術,只講一個能馬上用的觀念:你的電腦是工作桌,Hostinger 是店面倉庫,lugucrop.com 是客人看到的門面。你在工作桌上改完東西,不代表客人已經看到了;你要把正確檔案放進店面倉庫,客人才會看到新的內容。
先看短影音,再用下面的方式分清楚本機、Hostinger 和線上網站。
小白老闆版:Codex 幫你在電腦裡把文件做好,這叫「完成草稿」。你把文件上傳到 Hostinger 的 public_html,這叫「放上架」。客人打開 lugucrop.com 看到新內容,這才叫「真的上線」。三件事不要混在一起。
先記住三個地方
1. 本機檔案:你電腦裡的工作版本
我們現在主要工作的資料夾是 hostinger-flat。Codex 幫你寫文章、改首頁、更新 sitemap,都是先改這裡的檔案。這些檔案可以在電腦上預覽,但它們還沒有自動跑到網路上。
2. Hostinger 檔案:網站真正上架的位置
你在 Hostinger 文件管理器裡看到的 public_html,可以先想成網站的貨架。你要讓訪客看到新頁面,就要把新的 HTML 檔案放到這個貨架,而且通常要覆蓋舊檔。
3. 線上網站:瀏覽器最後看到的結果
當你打開 https://lugucrop.com/,瀏覽器會去讀 Hostinger 上目前的檔案。它不會讀你電腦裡還沒上傳的檔案,所以本機改好了,線上不一定會馬上變。
一個超白話比喻:工作桌、倉庫、門市
你可以把整個網站流程想成開店。
你的電腦
像工作桌。你和 Codex 在這裡寫文章、改版面、試圖片。工作桌上的東西再漂亮,客人還看不到。
Hostinger public_html
像店面倉庫。要拿出去賣的東西,要放到這裡。放錯抽屜、放到子資料夾、忘記覆蓋,都可能讓客人看不到。
lugucrop.com
像門市櫥窗。訪客只會看到門市裡目前展示的內容,不會知道你工作桌上還有多少新版草稿。所以「我電腦有」不等於「網站有」。
第九章最重要的一張流程圖
- 你跟 Codex 說:請幫我做第九章。
- Codex 修改你電腦裡的
hostinger-flat檔案。 - Codex 告訴你這次要上傳哪幾個檔案。
- 你到 Hostinger 的文件管理器。
- 你進入網站的
public_html。 - 你把新檔案上傳並覆蓋舊檔。
- 你打開線上網址檢查。
只要漏掉其中一步,就可能出現「我明明做好了,但網站沒變」的感覺。
Hostinger Website Builder 和 HTML 上傳,不要混在一起
這點非常重要,因為你一開始用的是 Hostinger Website Builder,但我們現在做的課程頁面,是一批靜態 HTML 檔案。這兩種做法像兩套不同系統。
如果你用 Website Builder
你是在 Hostinger 的網站編輯器裡拖拉、改文字、按「更新網站」。這種方式比較像用現成裝潢工具做網站。
如果你用 HTML 檔案上傳
你是在電腦裡準備 index.html、文章頁、sitemap.xml,再把檔案上傳到 public_html。這種方式比較像自己整理好貨品,再放到網站貨架上。
兩種方式都能做網站,但不要同時用混亂。現在我們這套 Codex 小白課,主要是走「Codex 做 HTML 檔案,你上傳到 Hostinger」這條路。
小白判斷法:如果你是在 Hostinger 編輯器裡點文字、拖圖片,那是 Website Builder。如果你是在文件管理器裡看 index.html、上傳 HTML,那是檔案上傳。你現在跟 Codex 合作時,多半是在做後者。
為什麼明明上傳了,網站還是沒變?
這不是玄學,通常只有幾種原因。小白先照這張清單查,不要一開始就慌。
常見原因
- 上傳到錯誤資料夾:檔案沒有放在
public_html第一層。 - 沒有覆蓋舊檔:新檔案傳上去了,但舊檔還在生效。
- 檔名不一樣:例如線上要的是
codex-beginner-prompts.html,你卻傳了另一個名字。 - 只傳文章,忘了首頁:文章頁有了,但
index.html沒更新,所以首頁看不到入口。 - 只傳繁體,忘了簡體:兩個語言版本是兩個不同檔案。
- 瀏覽器快取:瀏覽器還記著舊畫面,可以重新整理或開無痕視窗看。
- 把 Builder 和 File Manager 混用:你在一邊改,但實際生效的是另一套系統。
小白上傳前,只問 Codex 一句話
每次準備上傳前,你不用自己猜哪些檔案要傳。你可以直接把 Codex 當上架助理,叫它列清單。
請幫我整理這次網站更新的上傳清單。 請用小白能懂的方式告訴我: 1. 這次要上傳哪幾個檔案? 2. 這些檔案要放在 Hostinger 哪個資料夾? 3. 哪些檔案需要覆蓋舊檔? 4. 上傳後我要打開哪些網址檢查?
這次第九章會產生哪些檔案?
以你現在這個網站來說,一個新章節通常不只是一個文章檔。因為網站要讓訪客找得到它,所以還要更新入口。
codex-beginner-files-hostinger.html:第九章繁體文章。codex-beginner-files-hostinger-cn.html:第九章簡體文章。index.html:首頁要新增第九章入口。articles.html:文章庫要新增第九章卡片。sitemap.xml:讓搜尋引擎知道有新頁面。
小白檢查網站更新的 5 個動作
- 先打開首頁:
https://lugucrop.com/,看有沒有第九章入口。 - 再直接打開第九章網址:
https://lugucrop.com/codex-beginner-files-hostinger.html。 - 切到簡體版:
https://lugucrop.com/codex-beginner-files-hostinger-cn.html。 - 打開文章庫,看第九章是否在文章列表。
- 如果看不到,按重新整理;還不行就用無痕視窗再看一次。
學會看檔名,你就少迷路一半
靜態網站很看重檔名。檔名就像房間門牌,門牌錯了,訪客就找不到房間。
index.html:首頁。打開網域時通常先看它。articles.html:文章庫。privacy.html:隱私權政策。sitemap.xml:給搜尋引擎看的網站清單。codex-beginner-tools.html:第一章繁體。codex-beginner-tools-cn.html:第一章簡體。
所以你上傳時不要隨便改檔名。檔名一改,原本的連結就可能失效。
小白老闆的驗收話術
你可以把每次上傳都當成一次驗收,不要只問「好了嗎」。請 Codex 幫你列可檢查的網址和結果。
請幫我做網站上線前驗收。 請檢查這次是否需要更新: 1. 首頁入口 2. 文章庫入口 3. 繁體文章頁 4. 簡體文章頁 5. sitemap.xml 最後請列出我上傳後要打開檢查的網址。
第九章作業
- 在電腦裡找到
hostinger-flat資料夾。 - 找到
index.html,記住它是首頁。 - 找到
articles.html,記住它是文章庫。 - 登入 Hostinger,進到文件管理器和
public_html。 - 上傳前,先叫 Codex 列出「這次要傳哪幾個檔案」。
下一章預告
第十章可以開始做更實戰的內容:Codex 怎麼幫你改首頁、加文章入口、更新 sitemap,然後讓你用最少檔案完成一次網站更新。也就是把「知道差別」變成「真的會操作」。