用聊天的方式新增顧客評價區塊

來自真實顧客的好評，往往比你自己寫的任何介紹更能說服新訪客。在 WordPress 裡，你得挑選見證區塊或外掛、做出版面，再調整樣式來配合佈景主題。在 ShipPress 裡，你只要在聊天中描述這個區塊，AI 就會用你的設計原本就有的元件來打造。在這篇教學中，我會為 Pier 7 Coffee 的首頁新增一個「What our regulars say」區塊。

決定評價要放在哪裡

在 ShipPress 中開啟你的網站，把預覽畫面捲動到評價要出現的位置。很適合的位置是在介紹你提供什麼的部分之後、邀請訪客上門的部分之前。在 Pier 7 Coffee 上，我選的是 Journal 區塊（有 Read the journal）和大張「Sit at the bar」照片之間的空檔。

修改前：Journal 區塊直接接到吧台照片。
用一則訊息描述這個區塊

點選 + New Worker 開啟一個新的聊天，然後輸入你想要的內容：區塊標題、放置位置、評價數量，以及每則評價要顯示什麼。也請它配合網站其他部分的風格，並說明哪些地方不能更動。我送出的訊息是：
在首頁的 Journal 區塊和「Sit at the bar」照片之間，新增一個簡短的顧客評價區塊，標題為「What our regulars say」。並排顯示三則評價，每則都有一段簡短的評語、五顆星、名字，以及他們通常點的餐點。字型和顏色請與網站其他部分一致，在手機上讓評價改為上下堆疊。其他地方都不要更動。

說明區塊要放在哪裡，以及每則評價要顯示什麼。
讓 AI 來打造

按下 Enter。AI 會先找到首頁、看看各區塊是怎麼建構的，然後再加入新的區塊。你可以在聊天中看到每個步驟。我這次大約花了四分鐘。它在處理時你也可以繼續輸入，新訊息會等它完成後再處理。

AI 會先閱讀頁面，再進行修改。
看看它做了什麼

完成後，AI 會說明版面配置（三則評價並排，每則都有評語、五顆星、名字和常點的餐點），也會說明它沿用了與 Lots 和 Journal 區塊相同的元件，所以字型和間距都會一致，而且頁面上其他地方都沒有被動到。它也會清楚告訴你，評語和姓名都只是預留的範例，並主動提議幫你換成真實的評價。

一份簡短的摘要，包含你還需要提供的內容。
查看新的區塊

把預覽畫面捲回同一個位置。新的「What our regulars say」區塊就在 Journal 和吧台照片之間，三則評價排成一列，背景是同樣的米色，線條和小型大寫標籤也和頁面其他部分一樣。

這個區塊看起來就像原本設計的一部分。
用簡短的後續訊息微調

第一版有點平淡：星星是小小的黑色，評語也偏小。只要再送一則簡短的訊息就能解決。我送出的訊息是：
把星星改成金色並稍微放大一點，評語也稍微放大一些，讓它更醒目。
幾秒鐘後，星星變成溫暖的金色而且更大了，評語也比卡片上的其他文字更大。

小小的樣式調整，一句話就搞定。

上方是第一版，下方是後續調整後。
用 Phone 檢查

點選預覽畫面右上角的 Phone，然後捲動到這個區塊。三則評價會上下堆疊，每則都有星星、評語和姓名，在小螢幕上也容易閱讀。

在手機上，評價會上下堆疊。
換上你真實的評價

AI 寫的評語、姓名和餐點只是範例，讓你看看版面的樣子。在你 Go live 之前，請把它們換成顧客真正說過的話。你可以把真實的評價貼到聊天中（例如來自 Google 或你收到的訊息，並且要先徵得同意），請 AI 改用這些內容，或是點選回覆下方的建議 Swap in my real reviews。如果你的評價不到三則，可以改成要求兩則，或一則較大的評語。

完成的版面，等著放上你真實的評價。
隨時都能用 History 回到之前的版本

ShipPress 會在 AI 每一輪處理之後儲存一個還原點。點選右上角的 History，就能看到新增區塊的還原點，以及改成金色星星的還原點。點選任一個旁邊的 Restore，就能回到網站在那個時間點的原貌。

每一次修改都是一個還原點。
小提醒
- 只使用真實的評價，而且顯示顧客姓名之前要先徵求同意。
- 簡短的評語效果最好：每則一到兩句話。
- 三則評價在電腦上排成一列很好看；在手機上則會上下堆疊。
- 把這個區塊放在靠近你請訪客採取行動的地方，例如在地址或聯絡資訊之前。
- 在你點選 Go live 之前，先用 Phone 檢查頁面。