---
description: 這是使用微信與網站整合的指南。 在本文中，我們將重點放在如何設定微信網路聊天及其好處。
title: 微信與網站整合使用指南 [2023 年 7 月]
image: https://assets2-proxy.respond.io/ph8r57dk1q9w/6UqY6pT6RDVBpybAQYuTbi/bdb75b964b88f14603193366e8f129db/WeChatWebchatCoverImage_aa6b8482306e05e4f052ce62fd72e803.png
---

1. [首頁 ](/tw)
2. [\> 部落格 ](/tw/blog)
3. [\> How To Article](/tw/category/how-to-article)

# 微信網頁聊天：如何使用微信與網站整合 \[2023 年 7 月\]

[![Stephanie Yap](https://assets2-proxy.respond.io/ph8r57dk1q9w/ImihtSBQhPthGMwzma4mL/da76d13db9b74013121180c96ff97b1c/Avatar-8.svg?q=70&w=400&fm=avif)](/tw/author/stephanie-yap)

[Stephanie Yap](/tw/author/stephanie-yap)

· 10 Jul 2025

·

7 分鐘

![微信與網站整合使用指南 [2023 年 7 月]](https://assets2-proxy.respond.io/ph8r57dk1q9w/6UqY6pT6RDVBpybAQYuTbi/bdb75b964b88f14603193366e8f129db/WeChatWebchatCoverImage_aa6b8482306e05e4f052ce62fd72e803.png?q=70&w=400&fm=avif)

計劃在您的網站上安裝微信網路聊天小工具？ 在本文中，我們將解釋什麼是微信網路聊天以及如何使用微信與網站整合。 然後，我們將探討使用網路聊天小工具在行銷、銷售和支援方面的好處。 最後，我們將向您展示如何使用 respond.io 的工作流程將聊天自動化合併到您的微信小工具中。

## 微信與網站整合：簡介

[微信](https://respond.io/tw/blog/wechat-official-account) 擁有超過 12 億月活躍用戶 (MAU)，是滿足您所有社交需求的一站式中心。 這就是為什麼想要進入或拓展中國業務的企業需要擁有 [微信公眾號](https://respond.io/tw/blog/wechat-official-account#toc-mobile-6)。

為了防止垃圾行銷，微信規定商家不能匯入聯絡人。 相反，客戶必須先向您發送訊息，然後才能成為聯絡人。 為了鼓勵客戶向您發送第一則訊息，您可以將微信小工具新增到您的網站。

![此圖描述如何在網頁聊天中使用微信。 以下是您需要了解的內容。 網頁版微信需要您掃描二維碼才能開始聊天，不允許企業匯入聯絡人。](https://assets2-proxy.respond.io/ph8r57dk1q9w/3ZpaFwmmjkgiTBftkfKvkr/7df2c3fb413dc724360b6f15da824439/6316a6248f648c8bf75b57ad-wechatwebchat-image01-800_362e48a46371c544dd286bb89c1b787c.png) 

然而，與其他管道不同的是，微信不支援微信公眾平台上的點擊聊天連結功能。 客戶聯絡您的網路聊天小工具的唯一方法是透過二維碼。 

掃描代碼後，訪客將登陸應用程序，他們可以開始與您聊天。 在下一節中，我們將向您展示如何在您的網站上設定微信小工具。 

### 如何在 Respond.io 上設定微信與網站集成

要 [大規模處理微信對話](https://respond.io/tw/blog/wechat-official-account#toc-mobile-11)，您需要像respond.io這樣的客戶對話管理軟體。 [將您的微信公眾號連接到respond.io](https://help.respond.io/l/tw/channels/wechat#connecting%5Fwe%5Fchat) ，讓您的整個團隊能夠在一個平台上管理所有客戶對話。

在 respond.io 上設定 WeChat 網頁聊天的過程很簡單，可以通過 [跟隨這些步驟](https://help.respond.io/l/tw/workspace-settings/growth-widgets#creating%5Fwidget) 快速完成。

![此圖顯示了當您將微信小部件放置在您的網站上以便從微信應用程式呼叫公司時網頁微信的樣子。 此微信網頁版支援微信小工具。](https://assets2-proxy.respond.io/ph8r57dk1q9w/1fL5VegAbYSj5Ti6RbiMMa/545c83a37a249521580ecf5b99014b34/image_c4ef9033fa013b9e423d3f0bf093c63d.png) 

首先， [從您的微信公眾號頁面](https://help.respond.io/l/tw/channels/wechat#how%5Fcan%5Fi%5Fcreate%5Fa%5Fqr%5Fcode%5Ffor%5Fmy%5Fwe%5Fchat%5Faccount) 產生二維碼，並將二維碼以圖像形式下載到桌面上。 

然後，使用智慧型手機相機掃描二維碼。 將出現一條通知。 點擊它可在手機瀏覽器上開啟與二維碼關聯的連結。 複製瀏覽器網址列中的 URL，稍後您將需要它。 

![這張圖片向你展示了從微信官方帳號頁面下載網路聊天微信二維碼的步驟。 放置此二維碼後，您就可以開始在 WordPress 的微信小工具上聊天。](https://assets2-proxy.respond.io/ph8r57dk1q9w/6BDx0IQGOC2v2RPqPEWZ6M/492d5c7bfa5b2fdb40446ee0badc6ad0/image_60829d2d19c514c8e29b13720d45c725.png) 

在 respond.io 上，導覽至 _設定_ \> _成長小工具_。 然後，按一下 _新增小工具_ 並選擇 _新增小工具_ ，然後按一下 _建立小部件_。

之後，輸入您要新增聊天小工具的網站。 在 _標題元素_下，按 _新增頻道_ 並選擇 _自訂 QR_。 將您先前複製的 URL 貼到 _自訂 QR_下的文字欄位中。 

![此圖顯示如何透過點選「進階設定」來自訂微信小工具的外觀 ](https://assets2-proxy.respond.io/ph8r57dk1q9w/1ml4QtTKSzdSKgrLfjwmGD/c2314af316fdaa3d6d4e0f11b378a372/screenshot-2023-03-31-at-30140-pm_4d23204b758f39db8e955b510c8d8abe.jpg) 

您可以透過點選 _進階設定_ 按鈕來自訂小工具的外觀。 最後，點擊 _產生小工具_，複製產生的腳本並將其安裝到您的網站上。 然後您的小部件就可以使用了。 

如果您想跨多個管道與客戶建立聯繫， [全通路小部件](https://respond.io/tw/blog/omnichannel-widget) 可以提供協助。 您也可以選擇 [將網站聊天小工具加入您的網站](https://help.respond.io/l/tw/website-chat-widget/website-chat-widget-overview)。

現在您已經設定了小部件，讓我們詳細了解如何在您的業務中使用微信網路聊天。

## 微信與網站整合：如何使用微信網路聊天進行業務

在這裡，我們將向您介紹微信整合對您的網站的好處，特別是對銷售和客戶服務的好處。

### 銷售微信小工具

使用即時聊天進行銷售的最大缺點之一是潛在客戶的身份通常是匿名的。 銷售人員很難獲得準確的資訊來識別聯絡人並建立融洽的關係。

![這是一張描述如何在線上使用微信網頁版的圖片。 透過微信網站整合進行銷售，您可以將訊息收件匣與銷售 CRM 集成，以發出 HTTP 請求來收集聯絡資訊並建立銷售交易。](https://assets2-proxy.respond.io/ph8r57dk1q9w/2MsdRWyeQFLx7PlzZSP7q7/e5d827af6a5ce51d107f637ff57ecd13/WeChatWebchat_Image03_dd1c8616997cdbdffca77038881307c7.png) 

但是，您可以將您的 respond.io 收件匣與銷售客戶關係管理 (CRM) 整合。 在客戶發送消息後，您可以透過 [HTTP](https://respond.io/tw/blog/february-2022-release-new-workflows-steps-new-navigation-and-messaging-module-design-custom-channel-integration-and-bits-and-bobs#toc-mobile-4) [請求](https://respond.io/tw/blog/february-2022-release-new-workflows-steps-new-navigation-and-messaging-module-design-custom-channel-integration-and-bits-and-bobs#toc-mobile-4)來收集聯絡信息，並利用 [respond.io 的工作流程](https://help.respond.io/l/tw/workflows/workflows-overview) 創建銷售交易，而無需離開平台。 

接下來，我們將了解企業如何使用網站的微信整合來處理客戶支援。

### 客戶服務微信小部件

即時聊天的另一個挑戰是沒有保存的對話歷史記錄，客服人員無法在以後跟進查詢。 一旦聯絡人離開網站，所有對話以及聯絡資訊都將永遠消失。

respond.io 上的微信網路聊天允許客服人員識別回頭客，即使他們之前 [透過不同管道向您發送了訊息](https://respond.io/tw/blog/merge-contacts)。 這為代理人提供了對重複出現的問題的上下文洞察。 如有需要，您可以 [將案件回報給其他代理商或團隊](https://respond.io/tw/blog/escalation-management)。

![這是一張描述使用微信網站整合進行支援的好處的圖片。 當您在網站上整合微信時，您可以追蹤對話歷史記錄，享受 48 小時的訊息視窗並在稍後跟進對話。 查看部落格以了解有關微信網頁聊天的更多信息](https://assets2-proxy.respond.io/ph8r57dk1q9w/58Q2bYbysVRMPmMI9P5PUP/c00485c6a9caec8d87d6c7d9273b315e/WeChatWebchat_Image04_31b30a566cf126c7974e306784c20b62.png) 

為了防止企業向客戶發送垃圾郵件，WeChat 實施了 [48 小時](https://respond.io/tw/blog/wechat-official-account#toc-mobile-11) [消息窗口。](https://respond.io/tw/blog/wechat-official-account#toc-mobile-11) 這不僅能鼓勵企業迅速回覆，同時也可能提高客戶對您品牌的滿意度。 

如果客服人員需要在 48 小時後再次聯繫，他們可以使用其他管道（例如簡訊、電子郵件或在 respond.io 等全通路平台上的 WhatsApp）發送第一則訊息並繼續對話。 

要衡量客戶滿意度水準並了解您可以在哪些方面進行改進，請向客戶發送 [CSAT 調查](https://respond.io/tw/blog/csat-customer-satisfaction-score)。 讓我們繼續下一部分，我們將重點討論創建與微信相關的自動化。

透過 respond.io 將客戶對話轉化為業務成長。 ✨

在一處管理通話、聊天和電子郵件！

[ 預約示範](https://cta-service-cms2.hubspot.com/web-interactives/public/v1/track/redirect?encryptedPayload=AVxigLJZtM4BfRkXBKSL59L5j/laJ4+zD1NHrw8UnfY3qlAjv5e5x/LC6kTHaAzy+ZArNHjwEPBjeaY/legh7/lItLGZbpOSlRy+3HaHdvJTbK4816w=&webInteractiveContentId=131307604004&portalId=7250147&%5F%5Fhstc=4958508.ec36eb4a1acb5a2f1d2caa097ff2cfe6.1725863681681.1736738541926.1736745026317.279&%5F%5Fhssc=4958508.5.1736745026317&%5F%5Fhsfp=1189922200) [ 免費註冊](https://cta-service-cms2.hubspot.com/web-interactives/public/v1/track/redirect?encryptedPayload=AVxigLJUZ9y86szSaqWmCnYSYMq0ZOk9XV2oCon/mNLPf8PPYjkz0WNyT3X6/NYXJ57JQd5OrqxmaPSa+7vmFBoJC5AM1ZN85A57D/f8/TbyG9hd5BP9pbt7izF7v82BktzihajSsdiAfsC8q7M1poVVj/eAarUQTlFGjZdhnpE/S0oyP6r6zJeC35UP7Fj5/hBOQVo1fYZ5OQ0ThLMvpSdc7BkVWmpTOpdbJhdObPU=&webInteractiveContentId=131307603879&portalId=7250147&%5F%5Fhstc=4958508.ec36eb4a1acb5a2f1d2caa097ff2cfe6.1725863681681.1736738541926.1736745026317.279&%5F%5Fhssc=4958508.5.1736745026317&%5F%5Fhsfp=1189922200) 

## 使用 Respond.io 輕鬆處理微信小工具對話

在這裡，我們將向您展示如何建立進階聊天自動化，以透過工作流程提升您的微信網路聊天水平。

### 微信與網站整合：解答常見問題

不要花時間回答常見問題 (FAQ)，而是在微信小工具上設定自動回覆。 這樣，您可以減少客服人員的工作量，讓他們專注於更重要的事務。

![這是一張螢幕截圖，顯示了在 respond.io 工作流程中自動執行常見問題解答的步驟。](https://assets2-proxy.respond.io/ph8r57dk1q9w/2hBXfjMI0xnlhTlwzWIL9k/b992d3618ec4812ebb4ac14861e6bea1/UploadWeChatlogo2_52711080335d986fd38695771bc2588e.png) 

若要設定常見問題，請在[工作流程](https://help.respond.io/l/tw/workflows/workflow-steps)中建立一個多項選擇步驟，最多可包含 10 個常見問題及其回覆。 

還有 [快速回覆功能](https://help.respond.io/l/tw/workspace-settings/snippets) (它類似於快速回覆) 您可以為常見查詢創建預設回覆，例如退款政策。 與工作流程觸發的常見問題解答不同，支援代理在與客戶聊天時必須手動選擇相關的已儲存回應。

### 微信網路聊天：設定離開訊息

沒有業務可以 24/7 提供服務。 但可以建立 [離開訊息](https://respond.io/tw/blog/away-message-for-business) 來管理客戶對回應時間的期望。 現在，如果聯絡人在工作時間之外發送微信對話，他們將收到離開訊息。

![這是一張螢幕截圖，顯示了在 respond.io 的工作流程中設定離開訊息的步驟](https://assets2-proxy.respond.io/ph8r57dk1q9w/71iTbWEKTirHCPAp1iRdKa/59583963ac912f5297b9426482b79a92/UploadWeChatlogo1_646c77848542b6028214a8c558a23600.png) 

要更上一層樓，您甚至可以添加 [提問步驟](https://respond.io/tw/blog/question-bot) 來捕獲客戶資訊。 然後，將回覆儲存為 [變數](https://help.respond.io/l/tw/dynamic-variables/dynamic-variables) 以根據他們的需求自訂回覆。

您也可以查看我們的 [最佳做法如何為您的業務寫出離開消息](https://respond.io/tw/blog/away-message-for-business#toc-mobile-3)。

### 微信網路聊天：將微信聯絡人路由到正確的團隊

Workflow 允許您在 WeChat 小部件上的 [路由聯絡人](https://respond.io/tw/blog/chat-routing-contact-routing-workflows-module-respondio) 至正確的團隊。 首先，建立 [聊天前調查](https://respond.io/tw/blog/pre-chat-survey) 以收集客戶資訊以確定他們的需求。 然後，應用路由邏輯將客戶路由到相關團隊。 

![這是一張截圖，展示如何在 respond.io 上設定聊天路由](https://assets2-proxy.respond.io/ph8r57dk1q9w/5CDzj7cRyArT71YlNQ49EO/7237bfafe693a2322ad1da54fdaa48c1/UploadWeChatlogo3_9aabd4c8926b04ba034728b919c50b86.png) 

然後，建立一個分配邏輯，識別聯絡人查詢或需求的目的，並將其分配給正確的客服人員。 

現在您已經了解了有關微信與網站整合所需的所有資訊。 今天 [將您的微信帳號連結到respond.io](https://help.respond.io/l/tw/channels/wechat) 。

透過 respond.io 將客戶對話轉化為業務成長。 ✨

在一處管理通話、聊天和電子郵件！

[ 預約示範](https://cta-service-cms2.hubspot.com/web-interactives/public/v1/track/redirect?encryptedPayload=AVxigLJZtM4BfRkXBKSL59L5j/laJ4+zD1NHrw8UnfY3qlAjv5e5x/LC6kTHaAzy+ZArNHjwEPBjeaY/legh7/lItLGZbpOSlRy+3HaHdvJTbK4816w=&webInteractiveContentId=131307604004&portalId=7250147&%5F%5Fhstc=4958508.ec36eb4a1acb5a2f1d2caa097ff2cfe6.1725863681681.1736738541926.1736745026317.279&%5F%5Fhssc=4958508.5.1736745026317&%5F%5Fhsfp=1189922200) [ 免費註冊](https://cta-service-cms2.hubspot.com/web-interactives/public/v1/track/redirect?encryptedPayload=AVxigLJUZ9y86szSaqWmCnYSYMq0ZOk9XV2oCon/mNLPf8PPYjkz0WNyT3X6/NYXJ57JQd5OrqxmaPSa+7vmFBoJC5AM1ZN85A57D/f8/TbyG9hd5BP9pbt7izF7v82BktzihajSsdiAfsC8q7M1poVVj/eAarUQTlFGjZdhnpE/S0oyP6r6zJeC35UP7Fj5/hBOQVo1fYZ5OQ0ThLMvpSdc7BkVWmpTOpdbJhdObPU=&webInteractiveContentId=131307603879&portalId=7250147&%5F%5Fhstc=4958508.ec36eb4a1acb5a2f1d2caa097ff2cfe6.1725863681681.1736738541926.1736745026317.279&%5F%5Fhssc=4958508.5.1736745026317&%5F%5Fhsfp=1189922200) 

## 深入閱讀

除了微信之外，您還可以使用不同訊息管道的網路聊天。 在此處了解如何設定它們： 

* [為網站設定 LINE Widget 的完整指南](https://respond.io/tw/blog/line-web-chat)
* [如何使用 WhatsApp 與網站集成](https://respond.io/tw/blog/whatsapp-webchat)
* [使用 Instagram 網路聊天開展業務的指南](https://respond.io/tw/blog/instagram-widget)

分享這篇文章

[![Telegram](https://assets1-proxy.respond.io/api/v1/image/assets%2F11f7a662b80a4675973850b067c01fa5%2F44daca77a4844f0c8fd29040ddeba057?width=22)](https://api.whatsapp.com/send?text=https://respond.io/blog/wechat-integration-with-website)[![Facebook](https://assets1-proxy.respond.io/api/v1/image/assets/11f7a662b80a4675973850b067c01fa5/fff57eeb01160bc604392f519b4f3461ca16f0fa1b6a587b20b142cdf1ad0ba7?placeholderIfAbsent=true&width=22)](https://www.facebook.com/sharer/sharer.php?u=https://respond.io/blog/wechat-integration-with-website)[![Linkedin](https://assets1-proxy.respond.io/api/v1/image/assets/11f7a662b80a4675973850b067c01fa5/7aaf8d87b5410844d83e06a4ed663e4f551b8c5ef51dbb20a8ff064a1eed9a0f?placeholderIfAbsent=true&width=22)](https://www.linkedin.com/sharing/share-offsite/?url=https://respond.io/blog/wechat-integration-with-website)[![Twitter](https://assets1-proxy.respond.io/api/v1/image/assets%2F11f7a662b80a4675973850b067c01fa5%2F4e03e02422a94e8eab9b8b41457c2371?width=22)](https://twitter.com/share?url=https://respond.io/blog/wechat-integration-with-website)

相關帖子 👩‍💻 

* [![](https://assets2-proxy.respond.io/ph8r57dk1q9w/2oqQFglGKjjaHVJ8tzFoWn/dae58c7100ab3e6aadc197b8967ace36/Practical_Guide___Best_Omnichannel_CRM.png?q=70&w=1000&fm=avif)](/tw/blog/best-omnichannel-crm)  
[十大最佳全通路 CRM 平台：功能與定價比較}\]},十大最佳全通路 CRM 平台：respond.io、Kustomer、Kommo、Salesforce、HubSpot、Zendesk、Intercom、Zoho CRM、Zendesk 與 Freshdesk。](/tw/blog/best-omnichannel-crm)
* [![](https://assets2-proxy.respond.io/ph8r57dk1q9w/vr013lmO4xRSS30KcRV8T/8577db2181c4da2b4b4650ef13f7f93c/Practical_Guide___Best_AI_Chatbot_for_Website_Cover__1___1_.png?q=70&w=1000&fm=avif)](/tw/blog/best-ai-chatbots-for-website)  
[網站最佳 AI 聊天機器人：比較頂尖平台發現2025年最佳網站AI聊天機器人：Respond.io、Intercom、Zendesk AI、Tidio、Chatbase、Drift、HubSpot聊天機器人、ManyChat、Landbot](/tw/blog/best-ai-chatbots-for-website)
* [![](https://assets2-proxy.respond.io/ph8r57dk1q9w/1TpzwG7GSnvYfqt5pQRkSu/33fb71cdb0416e51b471784944d51485/AI_Agents_for_Customer_Support.png?q=70&w=1000&fm=avif)](/tw/blog/best-ai-agents-for-customer-support)  
[2025 年最佳 AI 代理用於客戶支持：優缺點及定價探索 2025 年最佳的 AI 代理，用於客戶支持。 比較 respond.io 和 Intercom 等頂級平台的優缺點和定價。](/tw/blog/best-ai-agents-for-customer-support)

用 Respond.io 增加 3 倍的業務成果 🚀

[聯絡銷售](/tw/demo)[開始免費試用](https://app.respond.io/user/register)

2025-12-05T06:17:25.066Z

blogs

```json
[{"@context":"https://schema.org","@type":"Article","image":"https://assets2-proxy.respond.io/ph8r57dk1q9w/6UqY6pT6RDVBpybAQYuTbi/bdb75b964b88f14603193366e8f129db/WeChatWebchatCoverImage_aa6b8482306e05e4f052ce62fd72e803.png","thumbnailUrl":"https://assets2-proxy.respond.io/ph8r57dk1q9w/6UqY6pT6RDVBpybAQYuTbi/bdb75b964b88f14603193366e8f129db/WeChatWebchatCoverImage_aa6b8482306e05e4f052ce62fd72e803.png","headline":"微信與網站整合使用指南 [2023 年 7 月]","alternativeHeadline":"微信與網站整合使用指南 [2023 年 7 月]","genre":["How To Article"],"publisher":{"@type":"Organization","name":"Respond.io","sameAs":"https://respond.io","logo":{"@type":"ImageObject","url":"https://respond.io/logo/respond-io.webp"}},"url":"https://respond.io/tw/blog/wechat-integration-with-website","datePublished":"2023-07-19T00:00:00.000Z","dateCreated":"2023-07-19T00:00:00.000Z","dateModified":"2025-07-10T11:11:55.835Z","description":"想要將微信網路聊天與您的網站整合嗎？ 請參閱我們的指南，了解微信小工具是什麼、如何設定它以及您的企業如何從中受益。","author":{"@type":"Person","name":"Stephanie Yap","url":"https://respond.io/tw/author/stephanie-yap"},"mainEntityOfPage":{"@type":"WebPage","@id":"https://respond.io/tw/blog/wechat-integration-with-website"}},{"@context":"https://schema.org","@type":"BreadcrumbList","itemListElement":[{"@type":"ListItem","position":1,"name":"Home","item":"https://respond.io/tw"},{"@type":"ListItem","position":2,"name":"Blog","item":"https://respond.io/tw/blog"},{"@type":"ListItem","position":3,"name":"How To Article","item":"https://respond.io/tw/category/how-to-article"}]}]
```
