# การผสานรวม Marketo
คู่มือนี้อธิบายวิธีผสานรวม [Marketo](https://login.marketo.com/) กับ Pushwoosh คุณจะสามารถใช้ช่องทางการสื่อสาร Web Push Notifications เป็นส่วนหนึ่งของแคมเปญการตลาดของคุณกับ Marketo ได้
ตัวอย่างเช่น ลองจินตนาการว่าผู้ใช้เข้าชม landing page ของ Marketo ของคุณแต่ไม่ได้ดำเนินการใดๆ ที่นั่น คุณจะสามารถเข้าถึงผู้ใช้นี้ด้วย web push notification เพื่อเป็นการเตือนความจำได้ web push notification นี้ยังสามารถปรับแต่งให้เป็นส่วนตัวด้วยข้อมูล Marketo ที่บันทึกไว้สำหรับผู้ใช้นี้เพื่อการมีส่วนร่วมสูงสุด!
## 1. การสร้าง Service Worker
ทำตาม[คู่มือ](/th/developer/pushwoosh-sdk/web-push-notifications/web-push-sdk-30)นี้และทำตาม**ขั้นตอนเบื้องต้น**และขั้นตอนที่ **1 - 2.2**
หลังจากทำตามขั้นตอนข้างต้นแล้ว คุณควรมีไฟล์ _manifest.json_ และ _pushwoosh-service-worker.js_ พร้อมใช้งาน
สลับไปที่ **Marketo Design Studio**
Marketo สามารถอัปโหลดไฟล์ไปยังโฟลเดอร์ทรัพยากรเท่านั้น ซึ่งเป็นโฟลเดอร์ที่เรียกว่า "Images and Files"
อัปโหลด _manifest.json_ และ _pushwoosh-service-worker.js_ ไปยังโฟลเดอร์เหล่านี้
## 2. การสร้างหน้าสมัครรับ push
ดังที่ได้กล่าวไว้ข้างต้น Marketo สามารถอัปโหลดไฟล์ไปยังโฟลเดอร์ทรัพยากรเท่านั้น ซึ่งแตกต่างจากขอบเขตของ landing pages
ตัวอย่างเช่น หากคุณคลิกที่ไฟล์ใดๆ ที่อัปโหลดข้างต้นและตรวจสอบ URL ของมัน คุณจะเห็นบางอย่างเช่น "[https://your-host-name.com/rs/765-IWA-819/images/pushwoosh-service-worker.js](https://your-host-name.com/rs/765-IWA-819/images/pushwoosh-service-worker.js)"
อย่างไรก็ตาม หากคุณคลิกที่ landing page และตรวจสอบ URL ของมัน จะเป็นบางอย่างเช่น: "[https://your-host-name.com/lp/765-IWA-819/pushwoosh-landing.html](https://your-host-name.com/lp/765-IWA-819/pushwoosh-landing.html)"
สังเกตส่วน **"lp"** ใน URL ของ landing pages และ **"rs"** ใน URL ของสคริปต์
นั่นหมายความว่าเราต้องลงทะเบียนสคริปต์ _Service Worker_ ของเราในขอบเขตที่แตกต่างจาก landing pages
เพื่อให้บรรลุเป้าหมายนั้น เราจะอัปโหลดหน้าสมัครรับ push พิเศษไปยังโฟลเดอร์ทรัพยากรของ Marketo แล้วเปิดจาก landing page มาสร้างหน้าสมัครรับนี้กัน
รับไฟล์ _push-subscription.html_ จาก gist ต่อไปนี้:
[https://gist.github.com/shaders/2b518e3acaf9b4712d5260205243343d#file-push-subscription-html](https://gist.github.com/shaders/2b518e3acaf9b4712d5260205243343d#file-push-subscription-html)
เปิดไฟล์และเปลี่ยนบรรทัดต่อไปนี้:
* บรรทัดที่ 8 - เปลี่ยนลิงก์เป็น URL ของไฟล์ _manifest.json_ ที่อัปโหลดในขั้นตอนก่อนหน้า
* บรรทัดที่ 24 - เปลี่ยนค่าพารามิเตอร์ _scope_ เป็น URL ของโฟลเดอร์ทรัพยากรของคุณ (นี่คือโฟลเดอร์ที่ _manifest.json_ อยู่)
* บรรทัดที่ 20 - เปลี่ยนค่าพารามิเตอร์ _applicationCode_ เป็น Pushwoosh App Id ของคุณ
โปรดทราบว่าสคริปต์ยังจับคู่ push notifications ที่เน้นผู้ใช้ของ Pushwoosh กับ Lead Identifier ของ Marketo: _userId:leadId_ (บรรทัดที่ 26)
อัปโหลดไฟล์ผลลัพธ์ไปยังโฟลเดอร์ "Images and Files" ตอนนี้คุณควรมีไฟล์เหล่านี้ในโฟลเดอร์:
## 3. การสร้าง landing page พร้อมการสมัครรับ push
รับไฟล์ _pushwoosh-template.html_ จาก gist ต่อไปนี้:
[https://gist.github.com/shaders/2b518e3acaf9b4712d5260205243343d#file-pushwoosh-template-html](https://gist.github.com/shaders/2b518e3acaf9b4712d5260205243343d#file-pushwoosh-template-html)
เปิดไฟล์และเปลี่ยนบรรทัดต่อไปนี้:
* บรรทัดที่ 47 - เปลี่ยนค่าพารามิเตอร์ _scope_ เป็น URL ของโฟลเดอร์ทรัพยากรของคุณ
* บรรทัดที่ 65 - เปลี่ยนลิงก์เป็น URL ของไฟล์ _push-subscription.html_ ที่อัปโหลดในขั้นตอนก่อนหน้า
* บรรทัดที่ 43 - เปลี่ยนค่าพารามิเตอร์ _applicationCode_ เป็น Pushwoosh App Id ของคุณ
สคริปต์นี้เช่นเดียวกับสคริปต์ก่อนหน้ายังจับคู่ push notifications ที่เน้นผู้ใช้ของ Pushwoosh กับ Lead Identifier ของ Marketo: _userId:leadId_ (บรรทัดที่ 49)
ตอนนี้ไปที่ส่วน "**Templates**" ของ **Marketo landing pages** ของคุณ สร้างเทมเพลต (เรียกว่า "pushwoosh-template" ในภาพหน้าจอด้านล่าง) และคัดลอก-วางเนื้อหาของไฟล์ผลลัพธ์ที่นั่น
ตอนนี้เรามาสร้าง landing page ใหม่โดยใช้เทมเพลตนี้กัน
ในตัวอย่างของเราเพื่อแสดงความสามารถของการผสานรวม Pushwoosh กับระบบอัตโนมัติของแคมเปญ Marketo เพื่อความเรียบง่าย เราจะเพิ่มลิงก์ง่ายๆ ไปยัง landing page เราจะสร้างแคมเปญที่จะทริกเกอร์ personal push notification เมื่อผู้ใช้คลิกที่ลิงก์นี้
เราจะใช้ URL เดียวกันกับ landing page
```txt
Send me an Offer!
```
## 4. การสร้าง Pushwoosh Webhook
ไปที่ส่วน **"Admin" ของ Marketo** และสร้าง Webhook ใหม่ด้วยพารามิเตอร์ต่อไปนี้:
* URL - [https://go.pushwoosh.com/json/1.3/createMessage](https://go.pushwoosh.com/json/1.3/createMessage)
* Request Type: 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 ดูเพิ่มเติมเกี่ยวกับ push notifications ที่เน้นผู้ใช้ [ที่นี่](/th/product/messaging-channels/push-notifications/send-push-notifications/push-by-user-id)
ในตัวอย่างที่ง่ายมากของเรา เราใช้ข้อความ push แบบคงที่ อย่างไรก็ตาม คุณสามารถใช้ฟังก์ชันทั้งหมดของ [`createMessage`](/th/developer/api-reference/messages-api/#createmessage) ได้
เพื่อปรับแต่ง push notification ให้เป็นส่วนตัว คุณสามารถใช้ **Preset** จาก Pushwoosh และส่งค่าจาก Marketo ในพารามิเตอร์ **"dynamic_content_placeholders"** ของการเรียก `/createMessage` เพื่อปรับแต่ง push ให้เป็นส่วนตัว
## 5. การผสานรวมกับแคมเปญอัตโนมัติของ Marketo
ไปที่ส่วน "**Marketing Activities**" ของ Marketo และสร้างแคมเปญ
สำหรับตัวอย่างของเรา เราจะทริกเกอร์แคมเปญเมื่อผู้ใช้คลิกที่ลิงก์ (ลิงก์ที่เราสร้างขึ้นเมื่อสองขั้นตอนก่อนหน้า) บน landing page ของเรา
b. เลือก "send_push" Webhook ในส่วน "Flow"
* ตอนนี้เปิด URL ของ landing page
* คลิกที่ปุ่ม **"Yes, I Want"** เพื่อเปิดกล่องโต้ตอบการสมัครรับ push
* สมัครรับ push notifications
* คลิกที่ลิงก์ **"Send me an Offer!"**
คุณได้รับการแจ้งเตือน push อัตโนมัติจาก Marketo ของคุณแล้ว!
