現在 Google Gemini 已經能夠成為不少人規劃出國旅遊的秘密武器，但還是有些人比較會想自己整理和規劃旅遊行程，要是天數和行程太慢，到最後就會變成很雜亂的文字，底下就來分享如何利用 Gemini 就能將手變現有資料生出結構清楚、排版漂亮、可以分享給朋友的旅遊行程頁面，不需要寫程式，新手也能上手。

如何用Google Gemini將旅遊行程規劃轉成網頁？

步驟1：先準備好旅遊行程計劃資料

想要透過 Google Gemini 生成旅遊行程網頁之前，要先準備好已經規劃好的旅遊行程表或資料，如果比較懶也可以在 Gemini 輸入清楚的需求：

幫我規劃 5 天 4 夜東京自由行，照天數列出，包含時間、景點、交通方式、餐廳與預估費用，最後加上總整理區塊

為了讓後續行程規劃更適合轉成網頁，會建議要請用 Day1、Day2 分段，每天再細分早上／下午／晚上，使用條列式列表顯示等，這樣 Gemini 會先幫你生成接近網頁區塊結構的內容。

如果是直接在 Gemini 聊天介面規劃行程，最後要編輯最簡單的方式，直接整段複製貼上到 Google 文件、Google 試算表，直接透過線上編輯調整。

步驟2：將行程資料轉換網頁代碼

有了初版純文字旅遊規劃行程之後，接下來請 Gemini 重構成網頁版格式，變成更接近旅遊時程頁面的排版，可以依照底下透過 vibe coding 指令來執行（直接複製貼上執行）：

用vibe coding寫一個旅遊的行程網頁，我會給你行程表，必須依照行程進行美化，而且可以有互動感，你準備好就等我上傳行程。

接下來，就可以在對話框內直接上傳螢幕截取規劃好的旅遊行程表，或是上傳文件資料，甚至可以貼上規劃好純文字行程，讓 Gemini 來幫你處理。

最後Gemini就會將現有提供的旅行規劃輸出成HTML格式代碼，只要等到AI全部跑完後，點擊一下HTML框右上角複製按鈕，將所有程式碼複製起來。

步驟3：搭配Canvas線上即時編輯預覽

隨後打開一個新的對話視窗，輸入欄位底下點選工具，開啟「Canvas」模式。

接下來，先貼上剛生成好的旅遊規劃原始碼，頂部輸入底下指令讓 Gemini 能夠以 Canvas 即時線上顯示：

幫我把底下HTML代碼以Canvas即時線上顯示

（原始HTMEL程式碼）

步驟4：即時修改調整網頁排版

最後 Gemini 就會利用 Canvas 即時線上模式，將剛生成的 HTML 原始碼轉成線上可預覽的旅遊時程網頁，而且右側畫面是可以真實點擊。

要是不滿意或是想要修改裡面資料，也可以直接在左側對話框內直接用口語化方式要求調整，像是可以下達類似底下指令：

可以幫我改成一個可以切換不同天數的版本嗎？
將天數改成更美的按鈕選單
能幫我改成手機版比較好預覽方式嗎？

甚至能夠在每個景點內自動加入Google地圖導航按鈕，而且可以透過Gemini自動生成，不需要先手動自動找好網址，只要透過底下指令就能辦到：

幫我替每個景點加入Google地圖導航按鈕，依照每個地點名稱自動生成

可以隨意調整到滿意為止，而且還可以自訂整體呈現的風格樣式，都可以透過 AI 來修改新增。

步驟5：共享輸出和分享網址

最後製作好的旅遊行程網頁也可以直接分享給其他人瀏覽，只要點擊右上角「共用」並選擇「分享」。

隨後 Canvas 就會自動生成一組公開能線上瀏覽的網址，只要點擊複製連結，就可以透過 LINE 或是 Email 直接分享給親朋好友或是旅行夥伴。

對方打開連結後，不需要輸入任何Google帳密，都可以直接透過電腦網頁版或手機直接瀏覽旅遊行程。

要是有在帶旅遊團也可以製作成不同語系，這些都可以透過 Gemini 要求加入英文版本，就可以在右上角切換中文或英文語系版本。

總結

要是事先規劃好旅遊行程後，現在可以完全不用學會如何網頁設計，直接透過 Gemini 快速轉換成超美的旅遊時程頁面，而且資料越豐富，最後顯示出來的結構就會更清楚，也會更好閱讀行程內容。

這樣下次就不需要多花時間，還要自己要整理好每個景點的導航連結，全部透過 AI 就能幫你處理，分享給旅伴和其他人，大家也會更清楚接下來行程和要去哪個景點。

要是想用AI找便宜機票，也可以參考「Google AI航班優惠查詢工具Flight Deals教學，一鍵找最便宜機票」。

想了解更多Apple資訊、iPhone教學和3C資訊技巧，歡迎追蹤瘋先生FB粉絲團、訂閱瘋先生Google新聞、 Telegram、 Instagram以及訂閱瘋先生YouTube。