การผสานรวมกับ Marketo
คู่มือนี้จะอธิบายวิธีผสานรวม Marketo เข้ากับ Pushwoosh คุณจะสามารถใช้ช่องทางการสื่อสารผ่าน Web Push Notifications เป็นส่วนหนึ่งของแคมเปญการตลาดของคุณกับ Marketo ได้
ตัวอย่างเช่น ลองนึกภาพผู้ใช้เข้าชมหน้าแลนดิ้งเพจ Marketo ของคุณ แต่ไม่ได้ดำเนินการใดๆ คุณจะสามารถเข้าถึงผู้ใช้นี้ได้ด้วยการแจ้งเตือนแบบพุชบนเว็บเพื่อเป็นการเตือนความจำ การแจ้งเตือนแบบพุชบนเว็บนี้ยังสามารถปรับแต่งให้เหมาะกับแต่ละบุคคลได้ด้วยข้อมูล Marketo ที่บันทึกไว้สำหรับผู้ใช้นี้ เพื่อการมีส่วนร่วมสูงสุด!
1. การสร้าง Service Worker
Anchor link toปฏิบัติตามคู่มือนี้ และทำตามขั้นตอนข้อกำหนดเบื้องต้น และขั้นตอนที่ 1 - 2.2
หลังจากทำตามขั้นตอนข้างต้นเสร็จสิ้น คุณควรมีไฟล์ manifest.json และ pushwoosh-service-worker.js เตรียมพร้อมไว้
สลับไปที่ Marketo Design Studio Marketo สามารถอัปโหลดไฟล์ไปยังโฟลเดอร์ทรัพยากรที่ชื่อว่า “Images and Files” ได้เท่านั้น
อัปโหลด manifest.json และ pushwoosh-service-worker.js ไปยังโฟลเดอร์นี้

2. การสร้างหน้าสมัครรับการแจ้งเตือนพุช
Anchor link toตามที่กล่าวไว้ข้างต้น Marketo สามารถอัปโหลดไฟล์ไปยังโฟลเดอร์ทรัพยากรเท่านั้น ซึ่งแตกต่างจากขอบเขต (scope) ของหน้าแลนดิ้งเพจ
ตัวอย่างเช่น หากคุณคลิกที่ไฟล์ใดๆ ที่อัปโหลดไว้ข้างต้นและตรวจสอบ URL ของไฟล์ คุณจะเห็นบางอย่างเช่น “https://your-host-name.com/rs/765-IWA-819/images/pushwoosh-service-worker.js”
อย่างไรก็ตาม หากคุณคลิกที่หน้าแลนดิ้งเพจและตรวจสอบ URL ของมัน จะเป็นบางอย่างเช่น: “https://your-host-name.com/lp/765-IWA-819/pushwoosh-landing.html”
โปรดสังเกตส่วน “lp” ใน URL ของหน้าแลนดิ้งเพจ และ “rs” ใน URL ของสคริปต์
นั่นหมายความว่าเราต้องลงทะเบียนสคริปต์ Service Worker ของเราในขอบเขต (scope) ที่แตกต่างจากหน้าแลนดิ้งเพจ
เพื่อให้บรรลุเป้าหมายนี้ เราจะอัปโหลดหน้าสมัครรับการแจ้งเตือนพุชพิเศษไปยังโฟลเดอร์ทรัพยากรของ Marketo แล้วเปิดจากหน้าแลนดิ้งเพจ มาสร้างหน้าสมัครรับข้อมูลนี้กัน
รับไฟล์ push-subscription.html จาก gist ต่อไปนี้:
https://gist.github.com/shaders/2b518e3acaf9b4712d5260205243343d#file-push-subscription-html
เปิดไฟล์และแก้ไขบรรทัดต่อไปนี้:
- บรรทัดที่ 8 - เปลี่ยนลิงก์เป็น URL ของไฟล์ manifest.json ที่อัปโหลดในขั้นตอนก่อนหน้า
- บรรทัดที่ 24 - เปลี่ยนค่าพารามิเตอร์ scope เป็น URL ของโฟลเดอร์ทรัพยากรของคุณ (นี่คือโฟลเดอร์ที่ manifest.json อยู่)
- บรรทัดที่ 20 - เปลี่ยนค่าพารามิเตอร์ applicationCode เป็น Pushwoosh App Id ของคุณ
โปรดทราบว่าสคริปต์นี้ยังจับคู่การแจ้งเตือนพุชที่เน้นผู้ใช้เป็นศูนย์กลางของ Pushwoosh กับ Lead Identifier ของ Marketo: userId:leadId (บรรทัดที่ 26)
อัปโหลดไฟล์ผลลัพธ์ไปยังโฟลเดอร์ “Images and Files” ตอนนี้คุณควรมีไฟล์เหล่านี้อยู่ในโฟลเดอร์:

3. การสร้างหน้าแลนดิ้งเพจพร้อมการสมัครรับการแจ้งเตือนพุช
Anchor link toรับไฟล์ pushwoosh-template.html จาก gist ต่อไปนี้:
https://gist.github.com/shaders/2b518e3acaf9b4712d5260205243343d#file-pushwoosh-template-html
เปิดไฟล์และแก้ไขบรรทัดต่อไปนี้:
- บรรทัดที่ 47 - เปลี่ยนค่าพารามิเตอร์ scope เป็น URL ของโฟลเดอร์ทรัพยากรของคุณ
- บรรทัดที่ 65 - เปลี่ยนลิงก์เป็น URL ของไฟล์ push-subscription.html ที่อัปโหลดในขั้นตอนก่อนหน้า
- บรรทัดที่ 43 - เปลี่ยนค่าพารามิเตอร์ applicationCode เป็น Pushwoosh App Id ของคุณ
สคริปต์นี้เช่นเดียวกับสคริปต์ก่อนหน้า ยังจับคู่การแจ้งเตือนพุชที่เน้นผู้ใช้เป็นศูนย์กลางของ Pushwoosh กับ Lead Identifier ของ Marketo: userId:leadId (บรรทัดที่ 49)
ตอนนี้ไปที่ส่วน “Templates” ของหน้าแลนดิ้งเพจ Marketo ของคุณ สร้างเทมเพลต (ในภาพหน้าจอด้านล่างเรียกว่า “pushwoosh-template”) และคัดลอก-วางเนื้อหาของไฟล์ผลลัพธ์ที่นั่น

ตอนนี้เรามาสร้างหน้าแลนดิ้งเพจใหม่โดยใช้เทมเพลตนี้กัน

ในตัวอย่างของเรา เพื่อแสดงความสามารถของการผสานรวม Pushwoosh กับระบบอัตโนมัติของแคมเปญ Marketo เพื่อความเรียบง่าย เราจะเพิ่มลิงก์ง่ายๆ ไปยังหน้าแลนดิ้งเพจ เราจะสร้างแคมเปญที่จะทริกเกอร์การแจ้งเตือนพุชส่วนบุคคลเมื่อผู้ใช้คลิกลิงก์นี้
เราจะใช้ URL เดียวกันกับหน้าแลนดิ้งเพจ
<a href="https://na-ab24.marketo.com/lp/765-IWA-819/pushwoosh-landing.html">ส่งข้อเสนอให้ฉัน!</a>

4. การสร้าง Pushwoosh Webhook
Anchor link toไปที่ส่วน “Admin” ของ Marketo และสร้าง Webhook ใหม่ด้วยพารามิเตอร์ต่อไปนี้:
- URL - https://go.pushwoosh.com/json/1.3/createMessage
- ประเภทคำขอ: POST
วางโค้ดต่อไปนี้เป็นเทมเพลต
{ "request": { "application": "ENTER_YOUR_PUSHWOOSH_APP_ID", "auth": "ENTER_YOUR_PUSHWOOSH_API_TOKEN_HERE", "notifications": [{ "send_date": "now", "ignore_user_timezone": true, "content": "เรามีข้อเสนอใหม่สำหรับคุณ!", "users" : ["{{lead.Id:default="ABCD-EFGH"}}"] }] } }
โปรดทราบว่าเราใช้ Marketo Lead ID เพื่ออ้างอิงถึงผู้ใช้ใน Pushwoosh ดูเพิ่มเติมเกี่ยวกับการแจ้งเตือนพุชที่เน้นผู้ใช้เป็นศูนย์กลางได้ที่นี่

ในตัวอย่างที่ง่ายมากของเรา เราใช้ข้อความพุชแบบคงที่ อย่างไรก็ตาม คุณสามารถใช้ฟังก์ชันการทำงานทั้งหมดของ /createMessage
ได้
หากต้องการปรับแต่งการแจ้งเตือนพุชให้เหมาะกับแต่ละบุคคล คุณสามารถใช้ Preset จาก Pushwoosh และส่งค่าจาก Marketo ในพารามิเตอร์ “dynamic_content_placeholders” ของการเรียก /createMessage
เพื่อปรับแต่งพุช
5. การผสานรวมกับแคมเปญอัตโนมัติของ Marketo
Anchor link toไปที่ส่วน “Marketing Activities” ของ Marketo และสร้างแคมเปญ
สำหรับตัวอย่างของเรา เราจะทริกเกอร์แคมเปญเมื่อผู้ใช้คลิกลิงก์ (ลิงก์ที่เราสร้างไว้เมื่อสองขั้นตอนก่อนหน้านี้) บนหน้าแลนดิ้งเพจของเรา

b. เลือก Webhook “send_push” ในส่วน “Flow”

- ตอนนี้เปิด URL ของหน้าแลนดิ้งเพจ
- คลิกที่ปุ่ม “Yes, I Want” เพื่อเปิดกล่องโต้ตอบการสมัครรับการแจ้งเตือนพุช
- สมัครรับการแจ้งเตือนพุช
- คลิกที่ลิงก์ “Send me an Offer!”
คุณได้รับการแจ้งเตือนพุชอัตโนมัติจาก Marketo แล้ว!
