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

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

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

getbutton 02 1
GetButton 網站連結:https://getbutton.io/

加入 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」即完成設定。
  1. 若網站是使用 Elementor 編輯,則可以使用 Custom Code 加入,不需要另外安裝外掛。
  2. 位置選擇 <body> – Start,完成設定後,點擊右上角按鈕儲存即完成設定。
getbutton 07
  1. 完成設定後就可以在網站前台看到 GetButton 顯示在網頁的角落囉!
延伸閱讀
相關標籤:
SHARE
分享在 facebook
分享在 twitter
分享在 linkedin
WRITTEN BY
Hend Chen
Hend Chen
嗨,我是 Hend!專長於網頁設計 、UI 設計、品牌設計,熱愛參與社群活動、分享設計新知。我的英文名字取自中文名字發音,發音和手的英文 “hand“ 沒有差異,如果您正面臨網站設計的困擾,我很樂意成為協助您的那雙手!

目錄

Subscribe