總覽 #
ManyChat Pixel允許您記錄網站事件。您可以將一些代碼字符串複製到您的網站,設置要跟踪的事件,然後將所有分析存儲在ManyChat中。
怎麼運行的 #
ManyChat執行幾個步驟來使Pixel正常工作-需要從外部資源收集數據。
- 創建帶有“打開網站”選項的按鈕,以將您的訂戶定向到外部資源。
- 從現在開始,每個訂閱者單擊此按鈕都將隱式獲得一個名為“ mcp_token”的附加URL參數(例如
https://mysite.com/?utm_source=manychat&utm_medium=cpa&mcp_token=12312314232yg123jh1g3j1g23u12y3
)。MCP_token存儲加密的元數據,以識別該訂戶及其在您網站上的後續操作。
- 從現在開始,每個訂閱者單擊此按鈕都將隱式獲得一個名為“ mcp_token”的附加URL參數(例如
- 安裝ManyChat Pixel(下面的指南)。如今,由於每個頁面
<head>...</head>
通常在所有頁面之間共享該塊,因此您可以在每個網站上一次安裝腳本-儘管您不確定,可以將腳本安裝到觸發事件的每個頁面上。 - 將日誌功能添加到您的網站,並向其傳遞有效的預期參數(以下指南)。
重要!!! 為了使Pixel第一次正常啟動,您需要用戶從Messenger轉到Pixel所在的網站。完成後,該用戶的會話將保存28天。在該會話期間,無論此使用何時訪問Pixel網站,無論他/她來自哪裡,均會觸發偶數。
安裝ManyChat Pixel #
步驟1
轉到自動化→像素。您應該看到一段代碼:
第2步
複製ManyChat Pixel代碼並將其添加到您的網站,如下所示:
的HTML
<head>...<!-- ManyChat --><script src="//widget.manychat.com/100949504624148.js" async="async"></script></head>
重要提示:這部分內容無法使用-您應該從ManyChat帳戶中復制一個。
在您的網站上設置活動 #
ManyChat Pixel支持兩種類型的事件:Conversion事件和Money事件。要“觸發”事件,您應該使用正確的內置函數並傳遞其預期參數。
window.MC_PIXEL.fireLogMoneyEvent()
接受3個參數:事件名稱,事件權重和貨幣(您可以忽略此參數-則ManyChat將'USD'
用作默認值)。準備使用的功能將如下所示:window.MC_PIXEL.fireLogMoneyEvent('my_book_purchase', 10.7, 'EUR')
。因此,您將告訴ManyChat記錄您的訂戶剛剛以10.7歐元的價格買了東西。您可以使用已經存在的事件名稱或鍵入一個新的事件名稱-在這種情況下,ManyChat將創建一個新的事件名稱。window.MC_PIXEL.fireLogConversionEvent()
接受唯一的參數:事件名稱。準備使用的功能將如下所示:window.MC_PIXEL.fireLogConversionEvent('buy_button_clicked')
。這樣,ManyChat就會知道,您的網站上發生了某些事情-例如,訪客單擊了某些按鈕或鏈接。您可以使用已經存在的事件名稱或鍵入一個新的事件名稱-在這種情況下,ManyChat將創建一個新的事件名稱。
例子
添加一些事件進行記錄!記錄事件有兩種常用的方法:訪問者加載某個頁面(例如“成功的付款頁面”)或單擊某個按鈕/鏈接(例如“閱讀更多”或“購買”)時。
頁面加載日誌事件完成
的HTML
<!-- This syntax will fire event after page is loaded completely --><body onload="window.MC_PIXEL.fireLogMoneyEvent('my_book_purchased', 10.7, 'EUR')">...</body>
記錄事件,當訪客單擊某些按鈕或鏈接時
的HTML
<!-- This syntax will fire event after visitor clicks the button --><button onclick="window.MC_PIXEL.fireLogConversionEvent('buy_button_clicked')">...</button><!-- This syntax will fire event after visitor clicks the link --><a href="#" onclick="window.MC_PIXEL.fireLogConversionEvent('buy_button_clicked')">...</a>
記錄幾個事件
的HTML
<!-- Sometimes you may need to log several events, when something happens (e.g. send events to several 3d party systems). Then you should create new functionto incapsulate several methods and use it --><body> <!-- This script will create function "myLogger()" which will make 3 things when called: 1. Fire event in ManyChat 2. Write word "test" in console (look in DevTools-Console) 3. Show a modal window with word "test" Of course, you can alter this code to fire several events--> <script> function myLogger() { window.MC_PIXEL.fireLogConversionEvent('buy_button_clicked'); console.log('test'); alert('test'); } </script> <!-- Here you declare calling "myLogger()" function when button is clicked --> <button onclick="myLogger()"> ... </button></body>
評論 #
上面的簡要說明-快速入門所需的全部信息。當然,有很多方法可以使用我們的Pixel(或更好地稱為SDK)-例如,您可以從自己的函數中調用此函數來轉換數據,然後再在ManyChat中觸發它。但是,這個故事是另一個話題。