設定與修改客服中心資訊
透過後台網站設定與樣板檔編輯,調整客服頁面聯絡資訊、標題文字,並嵌入 Google Maps 地圖與自訂 HTML 內容。
客服中心資訊修改說明¶
客服中心資訊調整 功能讓商家可以修改、新增客服資訊,並客製化呈現額外的資訊或 Google Map 地圖。
以下為客服中心資訊調整的詳細操作流程與教學:
此教學僅適用於「預設版型/一般版型(舊版)」。
修改客服資料與標題名稱¶
若您使用的是 「預設版型」(一般版型),可透過程式碼編輯器修改標題文字(例如將「公司地址」改為「門市位置」)。
- 進入路徑:登入 CYBERBIZ 管理後台,前往 網站外觀 > 套版主題管理 > CSS/HTML 編輯器。
- 編輯檔案:搜尋並點開
contact.liquid檔案。 - 修改文字:找到欲更換的預設文字(如:公司地址),直接將內容改為您想顯示的文字後儲存。
<ul class="contact_list">
{% if settings.display_contact_address %}
<li>
<span>公司地址:{{ settings.contact_address }}</span>
</li>
{% endif %}
{% if settings.display_phone %}
<li>
<span>公司電話:{{ settings.phone_number }}</span>
</li>
{% endif %}
{% if settings.display_office_time %}
<li>
<span>客服時間:{{ settings.shop_office_time }}</span>
</li>
{% endif %}
</ul>
修改客服聯繫內容(地址、電話、營運時間)¶
大部分的聯繫資訊可直接透過後台的「網站設定」進行調整:
-
更改聯絡地址:登入 CYBERBIZ 管理後台,前往 網站外觀 > 套版主題管理 > 網站設定 > 客服中心 進行修改。
-
更改電話與營運時間:前往 網站外觀 > 套版主題管理 > 網站設定 > 頁腳Footer 進行調整。
新增額外客服資訊(如:傳真)¶
若預設欄位不足,您可以手動在程式碼中複製區塊來新增資訊:
- 複製語法:在
contact.liquid檔案中,將其中一段<li>至</li>的語法複製起來。 - 貼上並修改:將複製的段落貼在
</ul>上方,並將其中的系統代碼(如{{ settings.shop_office_time }})刪除,替換成您想呈現的純文字資訊(例如:傳真電話)後儲存。
<li>
<span>公司電話:{{ settings.phone_number }}</span>
</li>
{% endif %}
{% if settings.display_office_time %}
<li>
<span>客服時間:{{ settings.shop_office_time }}</span>
</li>
<li>
<span> 傳真時間 </span>
</li>
{% endif %}
Google Map 地圖設定¶
-
取得地圖碼:至 Google Map 搜尋地址,點選「分享」>「嵌入地圖」>「複製 HTML」。
-
埋設連結:回到後台「網站外觀」>「套版主題管理」>「網站設定」>「客服中心」>「地圖連結」。
-
套用語法:將複製的 HTML 碼貼上並儲存,前台即會顯示對應的地圖。
-
更改地圖標題:若需修改地圖上方的標題文字,請至
contact.liquid找到地圖相關行數,將引號內的文字(如公司位置)改為自訂名稱。contact.liquid<div class="row"> <div class="col"> <h5 class="title mt-3 mb-4 section-heading">公司位置</h5> <div id="map-wrapper" class="map-wrap"> <div class="map-responsive"> {{ settings.show_google_map_iframe }} </div> </div> </div>
重要注意事項¶
- 責任歸屬:CYBERBIZ 提供程式碼修改權限,但 官方不提供語法教學或代碼撰寫服務,建議委託自家工程師或專業設計單位處理。
- 恢復機制:修改程式碼前請留意,若發生異常,可利用編輯器中的「查看之前版本」功能,回溯至先前版本。
常見問題¶
為什麼我在「網站設定」修改了地址,但客服頁面卻沒有更新?
這通常是因為您的 contact.liquid 檔案中,原本的系統代碼(如 {{ settings.contact_address }})已被手動修改為「固定文字」。
解決方法:* 請檢查 contact.liquid 程式碼,確認該欄位是否仍保留 {{ ... }} 格式的系統代碼。若已變更為固定文字,您需要直接在程式碼編輯器中手動更新地址。
Google Map 嵌入後顯示空白,或是比例不正確怎麼辦?
這通常與複製的 HTML 代碼完整度或版型 CSS 限制有關。
解決方法:
- 確保貼入的內容是以
<iframe>開頭並以</iframe>結尾的完整代碼。 - 若地圖無法滿版,請確認程式碼中是否有
map-responsive的外層div包裹,這能確保地圖在手機端也能正常縮放。
如果不小心刪錯程式碼導致頁面亂碼,該如何還原?
CYBERBIZ 的程式碼編輯器提供版本管理功能。
- 操作步驟: 在
contact.liquid編輯頁面的右上方(或下方),點選「查看之前版本」。系統會列出過往存檔紀錄,建議選擇修改前的時間點進行回溯。
我可以同時顯示多個門市的地圖嗎?
系統預設欄位僅支援一個地圖連結。
解決方法: 若需顯示多個地圖,需進入 contact.liquid 手動複製多組 <div class="map-responsive"> 區塊,並將各別門市的 Google Map 嵌入碼直接寫死在程式碼中。
最後更新:2026-03-05





