เก่ง Rich Menu ใน LINE ให้ครบสูตร
หากจะพูดถึง Chatbot แว๊บแรกที่คนจะนึกถึงก็คือการพิมพ์ข้อความ text คุยกัน ซึ่งแน่นอนว่าในการพัฒนา Chatbot เราจะต้องมี Keywords ที่ตั้งไว้สำหรับให้ Chatbot ทำงานอะไรบางอย่าง เช่นพิมพ์ว่า “โปรโมชันล่าสุด” แล้ว Chatbot จะทำหน้าที่ไปดึงข้อมูลโปรโมชันมาให้
แต่…การที่จะให้ผู้ใช้มานั่งจำ Keywords เหล่านั้นเองก็คงไม่ใช่เรื่องง่ายนัก ยิ่งถ้าผู้ใช้ไป Follow ตัว Chatbot หลายๆ Account ก็ยิ่งต้องจำมากขึ้นตามไปด้วย และ มันจะดีกว่าไหม ถ้าเราสามารถแนะนำคำสั่งต่างๆที่ใช้จะเรียกใช้บ่อยๆ หรือคำสั่งที่เราต้องการเน้นให้ผู้ใช้ได้เรียกใช้งานแบบง่ายๆโดยไม่ต้องจำ ด้วยการจิ้มๆผ่านเมนู
หมายเหตุ: ใครเผลอเข้ามาอ่านบทความนี้แล้วไม่เคยสร้าง LINE Chatbot มาก่อน แนะนำให้อ่านและทำตามบทความด้านล่างนี้ เพื่อความราบรื่นสำหรับเนื้อหาของบทความในลำดับถัดไป
เอาหละบทความนี้เราจะมาสร้าง Rich Menu เพื่อตอบโจทย์ปัญหาที่กล่าวไปในข้างต้นกัน โดยเนื้อหาทั้งหมดจะแบ่งออกเป็น
- สร้างรูป Rich Menu ด้วย Rich Menu Maker
- สร้าง Rich Menu ผ่าน LINE OA Manager
- เตรียม JSON สำหรับการสร้าง Rich Menu ผ่าน API ด้วย LINE Bot Designer
- บริหารจัดการ Rich Menu ผ่าน API
- ตัวอย่างการใช้งาน Rich Menu ผ่าน API
- ลำดับความสำคัญในการแสดงผล Rich Menu
- การโหลดและการเปลี่ยนแปลง Rich Menu
- ข้อจำกัดของ Rich Menu
1. สร้างรูป Rich Menu ด้วย Rich Menu Maker
Pain point ของคนสร้างรูป Rich menu ที่พบบ่อยๆคือมีทั้งเรื่องนามสกุลไฟล์ไม่ถูกต้อง หรือขนาดของรูป Rich menu ไม่ตรงตามที่ LINE กำหนด แต่ปัญหาเหล่านั้นจะหมดไปถ้าคุณใช้ Rich Menu Maker เครื่องมือในการสร้างรูป Rich menu ที่พัฒนาโดย LINE ประเทศไทย
การใช้งานมันก็ง่ายมากๆแค่ 3 ขั้นตอน
เพียงเท่านี้เราก็จะได้ไฟล์รูปที่มีนามสกุล JPG และขนาด 2500 x 1686px ออกมาตรงตามที่ระบบต้องการแล้ว
2. สร้าง Rich Menu ผ่าน LINE OA Manager (ไม่ต้องเขียนโค้ด)
เมื่อได้รูป Rich menu ตามต้องการแล้ว ก็เข้าไปที่ LINE Official Account Manager จากนั้นเลือก account ที่เราได้สร้างไว้ แล้วไปที่เมนูชื่อ Rich menus จะเจอปุ่ม Create new เขียวๆให้กดสร้าง ก็กดซะ
เมื่อกดปุ่มสร้างแล้ว ก็จะเจอหน้า Rich menus แบบนี้ ซึ่งเราจะต้องระบุข้อมูล 2 ส่วนหลักคือ Menu settings และ Menu content
Menu settings
- Title: ชื่อของ Rich menu (ไม่ได้แสดงให้ผู้ใช้เห็น)
- Status: เปิด/ปิด Rich menu ตัวนั้น
- Display period: วันและเวลาในการเริ่มและสิ้นสุดการแสดงผล Rich menu
- Menu bar label: ชื่อเมนูตรงบาร์ด้านล่าง (ผู้ใช้เห็น)
- Default behavior: แสดง/ซ่อน Rich menu ตั้งแต่เปิดห้องแชท
Menu content
เริ่มจากเลือก Template ให้ตรงกับรูปที่สร้างมา โดยล่าสุดมี Rich menu ขนาดใหม่ออกมาแล้วด้วยชื่อ Compact(2500×843, 1200×405, 800×270) แต่รูปที่ได้จาก Rich Menu Maker ยังรองรับเฉพาะแบบ Large(2500×1686, 1200×810, 800×540) ดังนั้นใครอยากใช้แบบ Compact ก็ออกแบบเองกันไปก่อนนะจ๊ะ
เมื่อเลือกแบบแล้วก็ Upload รูปที่เตรียมมาได้เลย
สุดท้ายก็กำหนด Action ให้แต่ละปุ่ม โดยสามารถกำหนดได้ดังนี้
- Link: เปิด URL ที่ขึ้นต้นด้วย
http
,https
,line
และtel
- Text: ส่งข้อความตัวอักษรกลับไปในห้องแชท
- Coupon: เปิดหน้าคูปอง
- Reward cards: เปิดหน้าสะสมแสตมป์
- No action: กดแล้วไม่เกิดอะไรขึ้น
หมายเหตุ: การสร้าง Rich menu จะต้องระบุข้อมูลให้ครบทุกช่องจึงจะกด Save ได้
กด Save แล้วมาเปิดหน้าแชทของ account ที่เราสร้างไว้กันเลย
3. เตรียม JSON สำหรับการสร้าง Rich Menu ผ่าน API ด้วย LINE Bot Designer
ตั้งแต่หัวข้อนี้ไป จะเป็นการสร้าง Rich Menu แบบ Advance โดยให้ทุกคนดาวน์โหลดโปรแกรม LINE Bot Designer จากลิงค์ด้านล่างนี้มาก่อน ซึ่งมีทั้ง Windows และ macOS
จากนั้นให้เปิดโปรแกรมขึ้นมา และให้ทำการ New project
เมื่อเข้ามาสู่หน้าหลักของโปรแกรม ผมจะขออธิบายตามตัวเลขด้านบนในแต่ละส่วนดังต่อไปนี้
ส่วนที่ 1 Bot Items
ส่วนนี้ให้เราโฟกัสที่ที่ช่องของ Rich Meu แล้วกด + เพื่อสร้าง Rich Menu
ส่วนที่ 2 Properties
ส่วนนี้ให้เรากำหนดค่าต่างให้กับ Rich Menu ที่ต้องการสร้างโดยมี
- Name: ชื่อของ Rich Menu(ผู้ใช้ไม่เห็น)
- Image: ไฟล์รูปที่มีขนาดตรงกับ Base Width และ Base Height
- Base Width: ความกว้างของ Rich Menu ซึ่งตอนนี้มีให้เลือกแค่ 2500
- Base Height: ความสูงของ Rich menu ซึ่งสามารถเลือกได้ 2 ขนาดคือ Large(1686px) และ Compact(843px)
- Display Menu by Default: จะโชว์ตั้งแต่เปิดหน้าแชทเลยไหม
- Chat Bar Title: ชื่อเมนูตรงบาร์ด้านล่าง (ผู้ใช้เห็น)
- Action: จะถูกสร้างอัตโนมัติหลังจากเราเลือก Area ที่ให้คลิกได้ในส่วนที่ 3 ซึ่งเมื่อถูกสร้างแล้วเราสามารถกำหนดได้ว่าคลิกแล้วจะให้เกิดเหตุการณ์อะไร โดยสามารถกำหนด Action ได้ทั้ง Message, URI, Postback, Datetime Picker และ Web App Action หรือมันก็คือ LIFF นั่นเอง
หมายเหตุ: ใครไม่คุ้นชินกับ Action ใน LINE Messaging API อ่านบทความนี้ได้เลย
ส่วนที่ 3 Preview
รูปในส่วนนนี้จะแสดงหลังจากเราเลือกรูป Image ในส่วนที่ 2 ซึ่งเราสามารถ drag พื้นที่ที่เราต้องการให้คลิกได้สูงสุดถึง 20 จุดบนรูป(ไม่ต้องคำนวนหาจุด X, Y, ความกว้าง และความสูงเอง สะดวกจริงไปอี๊ก) ซึ่งจากตัวอย่างของผมจะเลือกไว้ 8 จุดคือดราก้อนบอล 7 ลูกและเทพเจ้ามังกร เมื่อเลือกแล้วจะก่อให้เกิด Action ในส่วนที่ 2 ให้เราระบุนั่นเอง
ส่วนที่ 4 JSON
ในส่วนนี้จะแสดงโค้ดที่เป็นรูปแบบของ JSON ซึ่งถูกสร้างมาจากจัดการในส่วนที่ 2 และ 3 ซึ่งเราจะ copy เอาไว้ใช้ในหัวข้อถัดไป ง่ายเนอะ
4. บริหารจัดการ Rich Menu ผ่าน Messaging API
หลายคนอาจยังไม่รู้ว่า API ที่ใช้สำหรับ Rich Menu นี่ถือว่าเยอะที่สุดในตระกูล Messaging API เลย โดยมีถึง 14 ตัวด้วยกัน โดยใครจะเขียนโปรแกรม หรือใช้ Postman ยิง ก็ได้ทั้งคู่ ถ้าพร้อมแล้วเราไปเริ่มกันเลย
4.1 Create Rich Menu
จุดเริ่มขบวน เราจะต้องสร้าง Rich Menu ขึ้นมาผ่าน API ก่อนโดยมีรายละเอียดดังนี้
Headers:
+ Authorization: Bearer {channel access token}
+ Content-Type: application/json
Endpoint: https://api.line.me/v2/bot/richmenu
Method: POST
Body:
+ size: ความกว้างความสูงของรูป Rich Menu ทั้งแบบ Large และ Compact
- size.width: ความกว้างของรูป Rich Menu หน่วยเป็น px
- size.height: ความสูงของรูป Rich Menu หน่วยเป็น px + selected: กำหนดค่า default ในการแสดงผล true หรือ false
+ name: ชื่อ Rich Menu ไม่เกิน 30 ตัวอักษร
+ chatBarText: ชื่อเมนูบาร์ของ Rich Menu ไม่เกิน 14 ตัวอัษร + areas: เป็น array ที่ประกอบไปด้วย bounds และ action
- areas.bounds.x: ตำแหน่งในแนวราบของรูป Rich Menu
- areas.bounds.y: ตำแหน่งในแนวดิ่งของรูป Rich Menu
- areas.bounds.width: ความกว้างจากตำแหน่ง x ไปทางขวา หน่วยเป็น px
- areas.bounds.height: ความสูงจากตำแหน่ง y ไปด้านล่าง หน่วยเป็น px
- areas.action: Message, URI, Postback แลพะ Datetime Picker
เมื่อ Request ไป หากสำเร็จก็จะได้ richMenuId
คืนกลับมา (แต่ Rich Menu ยังไม่แสดงในหน้าแชทนะ)
{
"richMenuId": "{richMenuId}"
}
แนะนำ: ให้สร้าง Rich Menu กับ LINE Bot Designer ในหัวข้อที่ 3 แล้วเอา JSON มาใช้ในส่วน Body เพราะมันง่ายที่สุดในสามโลกแล้ว
4.2 Upload Rich Menu Image
เมื่อเราได้ richMenuId จากข้อ 4.1 มาแล้ว ในขั้นตอนนี้เราจะอัพโหลดรูปให้กับ Rich Menu ผ่าน API นั้นมีรายละเอียดดังนี้
Headers:
+ Authorization: Bearer {channel access token}
+ Content-Type: image/jpeg หรือ image/pngEndpoint: https://api-data.line.me/v2/bot/richmenu/{richMenuId}/contentMethod: POST
Param:
+ richMenuId: ID ของ Rich Menu ที่ได้จากข้อ 4.1
สำหรับไฟล์รูปที่จะอัพโหลดจะมีเงื่อนไขดังนี้
- ไฟล์รูปจะรองรับเฉพาะ JPEG, JPG และ PNG
- Resolution รูปจะมี 2 รูปแบบคือ Large(2500×1686, 1200×810, 800×540) และ Compact(2500×843, 1200×405, 800×270)
- ขนาดไฟล์รูปจะมีขนาดได้ไม่เกิน 1MB
เมื่อ Request ไป หากสำเร็จจะได้ status 200 แต่จะไม่ได้คืน JSON ใดๆกลับมา (แต่ Rich Menu ยังไม่แสดงในหน้าแชทนะ)
หมายเหตุ: การจะอัพเดทรูป Rich Menu หลังจาก Upload ไปแล้วนั้นยังไม่สามารถทำได้ วิธีเดียวคือจะต้องไปสร้าง Rich Menu ใหม่ในขั้นตอนที่ 4.1 เท่านั้น
4.3 Set Default Rich Menu
เมื่อผ่านขั้นตอนที่ 4.1 และ 4.2 บัดนี้ถือว่าเราพร้อมแล้วที่จะนำ Rich Menu ดังกล่าวไปสำแดง API ตัวนี้จะเป็นการผูก Rich Menu ให้กับ Followers ทุกคน
Headers:
+ Authorization: Bearer {channel access token}
Endpoint: https://api.line.me/v2/bot/user/all/richmenu/{richMenuId}
Method: POST
Param:
+ richMenuId: ID ของ Rich Menu ที่ได้จากข้อ 4.1
เมื่อ Request ไป หากสำเร็จจะได้ status 200 แต่จะไม่ได้คืน JSON ใดๆกลับมา
หมายเหตุ: จะเห็นว่าเราสามารถคลิกบอลทั้ง 7 แยกกันได้ แถมกดเทพเจ้ามังกรก็เปิดเว็บขึ้นมาได้ด้วย(ถ้ากดแล้วมังกรออกมาจะเมพขิงๆเลย 555)
4.4 Get Default Rich Menu ID
สมมติว่าเราสร้าง Rich Menu ไว้เยอะเลย(สูงสุด 1,000 แบบ) แล้วบางครั้งเราอยากรู้ว่า richMenuId ไหนเหรอที่ใช้งานอยู่ ก็ให้มาใช้ API ตัวนี้เลย
Headers:
+ Authorization: Bearer {channel access token}
Endpoint: https://api.line.me/v2/bot/user/all/richmenu
Method: GET
เมื่อ Request ไป หากสำเร็จก็จะได้ richMenuId
คืนกลับมาละ
{
"richMenuId": "{richMenuId}"
}
4.5 Cancel Default Rich Menu
บางครั้งเราตั้งค่า Rich Menu ผิด หรือแคมเปญหมดอายุ แล้วเราต้องการจะยกเลิกการแสดงผล Rich Menu ที่เป็นแบบ Default เราก็สามารถใช้ API ตัวนี้ได้
Headers:
+ Authorization: Bearer {channel access token}
Endpoint: https://api.line.me/v2/bot/user/all/richmenu
Method: DELETE
เมื่อ Request ไป หากสำเร็จจะได้ status 200 แต่จะไม่ได้คืน JSON ใดๆกลับมา
4.6 Link Rich Menu to a User
คราวนี้หากเราต้องการทำ Personalize ตัว Rich Menu ให้กับผู้ใช้ เช่นหาก Login ผ่านแล้วให้แสดง Rich Menu อีกแบบก็สามารถทำได้ แต่ก่อนอื่นเราต้องไปเตรียม Rich Menu อีกชุดมาซะก่อน โดยทำขั้นตอน 4.1 และ 4.2 อีกครั้ง เมื่อพร้อมแล้วก็ดูรายละเอียดการผูกกันเลย
Headers:
+ Authorization: Bearer {channel access token}Endpoint: https://api.line.me/v2/bot/user/{userId}/richmenu/{richMenuId}Method: POST
Param:
+ richMenuId: ID ของ Rich Menu ที่ได้จากข้อ 4.1
+ userId: ID ของผู้ใช้ที่ได้จาก Webhook
เมื่อ Request ไป หากสำเร็จจะได้ status 200 แต่จะไม่ได้คืน JSON ใดๆกลับมา
4.7 Link Rich Menu to Multiple Users
สมัยก่อนการจะผูก Rich Menu เราจะต้องผูกแบบ 1:1 เหมือนในข้อ 4.6 แต่ก็มีเสียงเรียกร้องจากนักพัฒนามาว่า กรณีที่เขามีลูกค้าเยอะๆ หลายแสน หรือหลายล้านคน การจะยิงแบบ 1:1 มันช้า และมีโอกาสเกิด timeout สูง จึงเป็นที่มาของ API นี้ที่จะให้บรรจุ userId ได้สูงสุดครั้งละ 500 userIds เพื่อยิงไปในครั้งเดียว
Headers:
+ Authorization: Bearer {channel access token}
+ Content-Type: application/json
Endpoint: https://api.line.me/v2/bot/richmenu/bulk/link
Method: POST
Param:
+ richMenuId: ID ของ Rich Menu ที่ได้จากข้อ 4.1
+ userIds: Array ของ userId เช่น ["{userId1}","{userId2}"]
เมื่อ Request ไป หากสำเร็จจะได้ status 202 แต่จะไม่ได้คืน JSON ใดๆกลับมา และ Rich Menu จะเปลี่ยนแบบ Realtime ในกรณีนี้(ไม่ต้องออกไปแล้วกลับมาเข้ามาดู)
4.8 Get Rich Menu ID of a User
เมื่อเราทำการผูกตัว Rich Menu แบบ Multiple แล้วต้องการแน่ใจว่าการผูกครั้งนั้นสัมฤทธิ์ผลดี เราสามารถสุ่มเอา userId ของผู้ใช้ที่อยู่ในกลุ่มที่ผูกมาตรวจสอบกับ API ด้านล่างนี้
Headers:
+ Authorization: Bearer {channel access token}
Endpoint: https://api.line.me/v2/bot/user/{userId}/richmenu
Method: GET
Param:
+ userId: ID ของผู้ใช้ที่ได้จาก Webhook
เมื่อ Request ไป หากสำเร็จก็จะได้ richMenuId
คืนกลับมา ก็ตรวจสอบดูว่าตรงตามที่ผูกไว้ไหม ถ้าตรงก็จบ ถ้าไม่ตรงก็ไม่จบไง 555
{
"richMenuId": "{richMenuId}"
}
4.9 Unlink Rich Menu from a User
กรณีที่ต้องการถอด Rich Menu ที่ผูกไว้แบบ Personalize เราสามารถใช้ API ด้านล่างนี้ โดยระบุ userId ของผู้ใช้ที่ต้องการถอดออก
Headers:
+ Authorization: Bearer {channel access token}
Endpoint: https://api.line.me/v2/bot/user/{userId}/richmenu
Method: DELETE
Param:
+ userId: ID ของผู้ใช้ที่ได้จาก Webhook
เมื่อ Request ไป หากสำเร็จจะได้ status 200 แต่จะไม่ได้คืน JSON ใดๆกลับมา
4.10 Unlink Rich Menus From Multiple Users
มีการผูกแบบ Multiple จะไม่มีการถอดแบบ Multiple สำหรับ Rich Menu แบบ Personalize ก็คงจะแปลกไป ดังนั้นเพื่อลด Request ก็บรรจุ userId ได้สูงสุดทีละ 500 กันไปเลย
Headers:
+ Authorization: Bearer {channel access token}
+ Content-Type: application/json
Endpoint: https://api.line.me/v2/bot/richmenu/bulk/unlink
Method: POST
Param:
+ userIds: Array ของ userId เช่น ["{userId1}","{userId2}"]
เมื่อ Request ไป หากสำเร็จจะได้ status 202 แต่จะไม่ได้คืน JSON ใดๆกลับมา และ Rich Menu จะเปลี่ยนแบบ Realtime ในกรณีนี้(ไม่ต้องออกไปแล้วกลับมาเข้ามาดู)
4.11 Download Rich Menu Image
สำหรับ API นี้ผมว่ามันมีประโยชน์ 2 อย่างด้วยกันคือ ต้องการดึงไฟล์รูป Rich Menu กลับมา และตรวจสอบว่าขั้นตอนที่ 4.2 ทำงานได้สมบูรณ์หรือไม่
Headers:
+ Authorization: Bearer {channel access token}Endpoint: https://api-data.line.me/v2/bot/richmenu/{richMenuId}/contentMethod: GET
Param:
+ richMenuId: ID ของ Rich Menu ที่ได้จากข้อ 4.1
เมื่อ Request ไป หากสำเร็จจะได้ status 200 พร้อม Binary ของรูปกลับคืนมา
4.12 Get Rich Menu
กรณีเราอยากกลับไปดูโครงสร้าง JSON ของ Rich Menu ที่เราสร้างไว้ในข้อ 4.1 เราสามารถ Request ตามรายละเอียดด้านล่างนี้
Headers:
+ Authorization: Bearer {channel access token}
Endpoint: https://api.line.me/v2/bot/richmenu/{richMenuId}
Method: GET
Param:
+ richMenuId: ID ของ Rich Menu ที่ได้จากข้อ 4.1
เมื่อ Request ไป หากสำเร็จจะได้ status 200 พร้อมกับโครงสร้าง JSON กลับมา
4.13 Get Rich Menu List
อย่างที่รู้คือ Rich Menu ที่เราสร้างด้วย API มีได้มากถึง 1,000 แบบ ดังนั้นหากเราต้องการดึง Rich Menu ทั้งหมดที่เราสร้างออกมาดู ก็ให้ใช้วิธีนี้เลย
Headers:
+ Authorization: Bearer {channel access token}
Endpoint: https://api.line.me/v2/bot/richmenu/list
Method: GET
เมื่อ Request ไป หากสำเร็จจะได้ status 200 พร้อมกับข้อมูล Rich Menu ทั้งหมดที่มีในรูปแบบ JSON
4.14 Delete Rich Menu
API ตัวสุดท้ายนี้จะมาช่วยเราในกรณีที่ต้องการจะลบ Rich Menu ที่ไม่ใช้แล้ว
Headers:
+ Authorization: Bearer {channel access token}
Endpoint: https://api.line.me/v2/bot/richmenu/{richMenuId}
Method: DELETE
Param:
+ richMenuId: ID ของ Rich Menu ที่ได้จากข้อ 4.1
เมื่อ Request ไป หากสำเร็จจะได้ status 200 แต่จะไม่ได้คืน JSON ใดๆกลับมา และ Rich Menu จะอันตรธานหายไปเมื่อเปิดห้องแชทอีกครั้ง
5. Use case การใช้งาน Rich Menu ผ่าน API
ผมจะยกตัวอย่างให้เห็นภาพว่า จริงๆแล้วเราสามารถทำให้ Rich Menu เปลี่ยนไปตามสถานการณ์ต่างๆได้ โดยตัวอย่างที่ผมจะโชว์นี้จะมี scenario ดังนี้
- ผู้ใช้เปิดหน้าแชทกับ LINE Chatbot ให้แสดง Rich Menu ที่สร้างจาก OA Manager โดย Rich Menu มีหน้าตาแบบนี้
- ผู้ใช้กด Rich Menu แล้วให้เปิด LIFF ขึ้นมาเป็นหน้า Login โดยมี HTML ตามนี้
- ผู้ใช้ Login ด้วย username และ password อะไรก็ได้ สิ่งที่ต้องการคือ userId ที่ได้จาก LIFF เพื่อส่งต่อไป API
- สร้าง Rich Menu 2 ชิ้น ผ่าน Postman โดยให้มีปุ่ม More และ Back ซึ่งจะส่ง Postback กลับมาเป็น data = richmenu1 และ richmenu2
- สร้าง Webhook ด้วย Cloud Functions for Firebase โดยจะมีโค้ดตามด้านล่างนี้
6. ลำดับความสำคัญในการแสดงผล Rich Menu
กรณีที่เรามีการสร้าง Rich menu ไว้ทั้ง 2 ช่องทางผ่าน OA Manager และ Messaging API ระบบจะมีการจัดลำดับความสำคัญในการแสดงผลตามตารางด้านล่างนี้
ซึ่งจะเห็นว่า ระบบจะให้ความสำคัญกับการสร้าง Rich menu ผ่าน API มากกว่า และยิ่งไปกว่านั้นระบบจะให้ความสำคัญสูงสุดกับการสร้าง Rich menu ผ่าน API แบบกำหนดรายบุคคล
7. การโหลดและการเปลี่ยนแปลง Rich Menu
- การกำหนด Rich menu แบบรายบุคคล ทั้งการ Link และ Unlink ผู้ใช้งานจะได้รับอัพเดททันทีโดยไม่ต้องออกจากหน้า Chat แต่อย่างใด
- การกำหนด Rich menu แบบ Default, การยกเลิก Rich menu(Cancel) และการลบ Rich menu(Delete) ผู้ใช้งานจะได้รับอัพเดทเมื่อเปิดห้องแชท(อีกครั้ง) และอาจใช้เวลาตั้งแต่ 0–60 วินาที จึงจะเห็นการเปลี่ยนแปลง
8. ข้อจำกัดของ Rich Menu
- แสดงเฉพาะในแอป LINE สำหรับ Android และ iOS
- แสดงเฉพาะการคุยกับ Chatbot แบบ 1-on-1 เท่านั้น
- สร้างได้สูงสุด 1,000 รูปแบบ
- ไฟล์รูปจะรองรับเฉพาะ JPEG, JPG และ PNG
- Resolution รูปจะมี 2 รูปแบบคือ Large(2500×1686, 1200×810, 800×540) และ Compact(2500×843, 1200×405, 800×270)
- ขนาดไฟล์รูปจะมีขนาดได้ไม่เกิน 1MB
- สามารถกำหนดจุดที่ให้ผู้ใช้คลิกได้ผ่าน Messaging API ได้สูงสุด 20 จุด
ทิ้งท้ายกับ Rich Menu
เห็นแล้วใช่ไหมว่า Rich Menu เป็นฟีเจอร์ที่มีประโยชน์มว๊ากกก ก ไก่ ล้านตัว เราสามารถนำเสนอเมนูให้ผู้ใช้งานเข้าถึงบริการของเราแบบง่ายๆ ไม่ต้องจดจำคำสั่ง แถมหน้าตาสวยเกร๋น่าใช้งาน ที่สำคัญมันช่วยให้ Chatbot ของเรามีคุณภาพ(On demand) ได้อีกด้วยนะ ดังนั้นใครอ่านมาถึงตรงนี้ก็จงกลับไปสร้าง Rich menu ให้ Chatbot ของตัวเองกันเถอะ วันนี้ขอตัวลาไปก่อน พบกันใหม่บทความหน้า ราตรีสวัสดิ์นักพัฒนาชาวไทย