TUTORIAL · v2026.04

使用教學

從申請帳號到 WordPress 貼片,五個步驟搞定

01 / REGISTER

註冊帳號

前往 /signup 用 Email 或 Google 帳號完成註冊,整個過程不到一分鐘。

帳號建立後自動開啟 14 天免費試用,期間所有功能完整開放。試用結束當天才開始計費,你可以提前隨時取消。

立即免費試用
02 / BUSINESS

新增商家

登入後進入 儀表板,點右上角的「新增商家」按鈕。

在搜尋框輸入店名,系統會透過 Google Places 自動帶出建議清單。找到正確的地點後點選,系統就會抓回 Google Maps 上的評論資料,通常在幾秒內完成。

一個帳號可以綁定多家商家,費用依商家數量按比例計算,不用為每家店另外開帳號。

// FALLBACK · 搜尋找不到?

用 Place ID 手動指定

少數小店或新開的店可能還沒進 Google Places 的搜尋索引,這時候可以從 Google Maps 直接複製 Place ID 貼到後台。

1

打開 Google Maps Place ID Finder

瀏覽器輸入:developers.google.com/maps/.../places-placeid-finder

📸
圖 1 · 待截圖
畫面:Google Maps Place ID Finder 工具首頁
截取:整個工具介面(搜尋框 + 地圖 + 左側說明)
建議尺寸:1400×800
ref: developers.google.com
2

在搜尋框輸入你的店名

工具頁上方會有一個搜尋欄,輸入店名或完整地址。

📸
圖 2 · 待截圖
畫面:搜尋框輸入店名後彈出的下拉建議
截取:搜尋框 + 下拉清單(3-5 筆同名店家)
建議尺寸:1200×500;重點:展示同名多筆情境
ref: developers.google.com
3

選擇正確的那一家

點選對的地址後,地圖會 zoom 到該店家,右側會彈出一張 info card 顯示 Place ID。

📸
圖 3 · 待截圖
畫面:選中店家後地圖 + info card 展開
截取:info card(顯示店名 + 地址 + Place ID 字串)
建議尺寸:1000×600;重點:Place ID 欄位要清晰可見(紅框圈起)
ref: developers.google.com
4

複製 Place ID 貼回後台

Place ID 是 ChIJ 開頭的 27 字元字串,整段複製,回到 ReVuTron 後台「新增商家」→「找不到你的店?改用 Place ID」展開區,貼上並驗證。

📸
圖 4 · 待截圖
畫面:ReVuTron 後台展開的 Place ID input
截取:我們自己的後台表單(含 Place ID 輸入框 + 驗證按鈕)
建議尺寸:900×400;註:這張是我們自己的介面,可以直接截
ref: revumaru.withtron.com
💡 九成的情況下直接用搜尋就找得到。只有小店或新店才會需要用 Place ID 備援。
03 / WIDGET

選擇版型 + 取得程式碼

目前有五種版型,可以同時啟用多種,也可以在後台調整顏色、位置、顯示幾則評論。

01 / FLOAT

浮動卡

頁面右下角自動浮現,跟著使用者捲動。適合想要評論隨時可見、又不打擾主要內容的情境。

貼法:一行 <script>

02 / INLINE

內嵌區塊

直接嵌在頁面指定位置,形成一整面評論牆。適合放在服務說明頁或 About 頁面,增強說服力。

貼法:<div> 容器 + <script>

03 / CAROUSEL

輪播

自動切換多則評論,適合首頁 Hero 下方或寬橫幅區域,視覺衝擊力強。

貼法:<div> 容器 + <script>

04 / SIDEBAR

側邊條

頁面側邊的收合面板,點擊才展開,不佔版面空間。電腦版效果特別好,適合偏好簡潔風格的品牌。

貼法:一行 <script>

05 / BADGE

徽章

⭐ 4.9 · 245 reviews 小巧簡潔,放在 CTA 按鈕旁或表單上方最有效,占空間最小但轉換率提升明顯。

貼法:<div> 容器 + <script>

// CODE SNIPPETS

浮動類(浮動卡 / 側邊條 / 徽章)— 一行搞定:

<script src="https://revumaru.withtron.com/embed.js"
  data-widget-id="YOUR_WIDGET_ID"
  data-type="float"
  async></script>

嵌入類(內嵌區塊 / 輪播)— 先放容器,再放 script:

<div id="revumaru-inline"></div>

<script src="https://revumaru.withtron.com/embed.js"
  data-widget-id="YOUR_WIDGET_ID"
  data-type="inline"
  data-target="revumaru-inline"
  async></script>
YOUR_WIDGET_ID 要替換成後台建立 Widget 後取得的專屬 ID。
04 / INSTALL

安裝到網站

4-1 一般網站(HTML / Wix / Squarespace / Shopify 等)

浮動類:把 <script> 貼到 </body> 前一行就完成了。

嵌入類:先在想顯示的位置貼 <div id="revumaru-inline"></div>,然後把 <script> 放到 </body> 前。

4-2 WordPress(推薦外掛)

WordPress 建議用 WPCode – Insert Headers and Footers 外掛,免費、裝機量 50 萬以上,不需要動到任何主題檔案。

  1. 1 WordPress 後台 → 左側選單「外掛」→ 「安裝外掛」
  2. 2 搜尋 WPCode,找到後點「立即安裝」→「啟用」
  3. 3 左側選單出現「Code Snippets」→ 點「Header & Footer」
  4. 4 把程式碼貼到「Footer」區塊,點「儲存變更」,完成
05 / FAQ

常見問題

評論幾小時更新一次?

系統每天自動同步一次。如果剛收到新評論想馬上更新,後台有「立即更新」按鈕可以手動觸發。

裝上去沒看到 widget?

按 F12 打開開發者工具,看 Console 有沒有紅色錯誤訊息;確認 Widget ID 有正確替換;試著清瀏覽器快取再重新整理。

能不能改顏色和字體?

可以,後台「樣式設定」可以調整顏色、字體大小、圓角等外觀選項。

可以只顯示好評嗎?

可以。後台「評論精選」可以把每則評論設成顯示(visible)、精選(featured)或隱藏(hidden),完全由你控制。

會不會讓網站變慢?

不會。embed script 採非同步載入,不會阻塞頁面渲染,對 Core Web Vitals 影響極小。

停止訂閱後 widget 會怎樣?

訂閱到期後,widget 會自動停止顯示。網站上不會出現錯誤,只是評論嵌入區塊不再呈現內容。重新訂閱後立即恢復正常。

// GET STARTED

還沒有帳號?

14 天免費試用,一行程式碼上線

立即免費試用