Hend Instagram
首頁
/
/
如何在網站置入聊天按鈕？GetButton 教學
getbutton

如何在網站置入聊天按鈕？GetButton 教學

Elementor WordPress 網頁設計

* GetButton 目前已不支援免費使用，如果你正在尋找免費的聊天按鈕，可以試試看 ToldYou Button：

ToldYou Button 是由台灣開發者邱煜庭 (邱小黑) 所開發，保留了 GetButton 的核心優點，但專注於解決中文使用者的痛點。

GetButton 提供各種通訊平台的串接，透過設定可以快速地在網站上加入聊天按鈕，增加與網站使用者的互動，在免費版即有完整的功能。

getbutton 02 1
GetButton 網站連結：https://getbutton.io/
📝 更多工作想法 ∣ 追蹤 Facebook
☕ 更多日常紀錄 ∣ 追蹤 Instagram

加入 Facebook Messenger

  1. 點擊「Get my Facebook page ID」。
  2. 將 Facebook 粉絲專頁的網址複製進去，即可取得 Facebook Page ID。
getbutton 03

加入 LINE QR code 連結

  1. 點擊「LINE」的圖示。
  2. 填入 QR code 連結，格式為 https://line.me/ti/p/你的帳號名稱
getbutton 04

設定按鈕位置與預設文字

  1. 後面有括弧 Pro Feature 表示為付費版才有提供的功能。
  2. Position 為 GetButton 顯示的位置，預設為右下角，可以依照自己的喜好更換成出現在左下角。
  3. Call to action 為預設顯示的文字，預設為英文，可以更改為中文，如：歡迎與我聯絡！
getbutton 05
  1. 在下一個區塊中的「Custom Color」可以更換 GetButton 的顏色，顏色可以依照網站的配色去調整。

關於網頁色彩規劃，可以閱讀：網站色彩計畫 (2022 最新) 🙂

在網站加入程式碼

  1. 輸入 E-mail 後，即可取得一段程式碼，GetButton 同時也會寄送程式碼到你的信箱。
  2. 將程式碼複製貼到網站的 <body> 標籤裡面。
  3. 於 WordPress 後台 / 外掛，安裝 Insert Headers And Footers，將程式碼複製到「Scripts in Body」即完成設定。
Insert Headers And Footers
  1. 若網站是使用 Elementor 編輯，則可以使用 Custom Code 加入，不需要另外安裝外掛。
  2. 位置選擇 <body> – Start，完成設定後，點擊右上角按鈕儲存即完成設定。
getbutton 07
  1. 完成設定後就可以在網站前台看到 GetButton 顯示在網頁的角落囉！
相關標籤：
Elementor WordPress 網頁設計
追蹤我
想持續看到相關分享，歡迎追蹤我的社群！
Hend Instagram
廣告
延伸閱讀
SHARE
WRITTEN BY
Picture of Hend Chen
Hend Chen
嗨，我是 Hend！專長於網頁設計 、UI 設計、品牌設計，熱愛參與社群活動、分享設計新知。我的英文名字取自中文名字發音，發音和手的英文 “hand“ 沒有差異，如果您正面臨網站設計的困擾，我很樂意成為協助您的那雙手！

目錄

Subscribe
Subscription
Follow
Hend Instagram