เพิ่มแชท Kick ลงใน OBS (chat dock และโอเวอร์เลย์แชท)

การเพิ่มแชท Kick ลงใน OBS มี 2 วิธี และสตรีมเมอร์ส่วนใหญ่อยากได้ทั้งคู่ Chat dock แสดงแชทในหน้าต่าง OBS คุณจึงอ่านแชทได้ระหว่างสตรีม ส่วนโอเวอร์เลย์แชทเป็น browser source ในซีน ผู้ชมจึงเห็นแชทบนสตรีม เช่น ใน VOD หรือคลิป

Dock ใช้แชทแบบป๊อปเอาต์ของ Kick เอง ส่วนโอเวอร์เลย์ต้องใช้วิดเจ็ตแชทจากเครื่องมืออย่าง KickBot หรือ Streamlabs ทั้งสองแบบใช้เวลาตั้งค่าไม่กี่นาที

Dock หรือโอเวอร์เลย์?

	Chat dock	โอเวอร์เลย์แชท
ใครเห็น	คุณคนเดียวใน OBS	ผู้ชมของคุณบนสตรีม
คืออะไร	แผงในหน้าต่าง OBS	browser source ในซีน
มาจากไหน	URL แชทแบบป๊อปเอาต์ของ Kick	วิดเจ็ตแชท (KickBot, Streamlabs และอื่น ๆ)
พิมพ์ในนั้นได้ไหม	ไม่ได้	ไม่ได้

เพิ่ม chat dock ของ Kick ใน OBS

ขั้นตอนนี้มาจากไกด์ของ Kick How to create a Kick chat dock in OBS (วิธีสร้าง chat dock ของ Kick ใน OBS)

1. เปิด OBS
2. ที่แถบเมนู คลิก Docks > Custom Browser Docks (Dock เบราว์เซอร์แบบกำหนดเอง)
3. ใส่ชื่อ เช่น “Kick Chat”
4. ใส่ URL แชทแบบป๊อปเอาต์ของคุณ: https://kick.com/popout/yourchannel/chat เปลี่ยน yourchannel เป็นชื่อผู้ใช้ Kick ของคุณ
5. คลิก Apply (นำไปใช้) แล้วคลิก Close (ปิด)
6. คลิก Docks แล้วเลือก Kick Chat เพื่อแสดง ลากไปวางตรงที่ต้องการในหน้าต่าง OBS

Kick ระบุข้อจำกัดของ dock ไว้ดังนี้:

• ล็อกอินหรือส่งข้อความจาก dock ไม่ได้ ถ้าอยากพิมพ์ ให้เปิด kick.com ไว้ในเบราว์เซอร์
• แบนเนอร์คุกกี้อาจบังแชทบางส่วน ให้ขยาย dock ให้กว้างขึ้นเพื่อไม่ให้บังข้อความ
• “Disconnected” แปลว่าคุณไม่ได้ล็อกอิน ข้อความใหม่ยังขึ้นตามปกติ

เพิ่มโอเวอร์เลย์แชท Kick ลงในสตรีม

โอเวอร์เลย์แสดงแชทซ้อนบนเกมหรือกล้อง โดยมีพื้นหลังโปร่งใส คุณเพิ่มเป็น source แบบ Browser นี่คือขั้นตอนเมื่อใช้วิดเจ็ตแชทของ KickBot ซึ่งใช้ฟรี

1. ติดตั้งวิดเจ็ตแชทใน KickBot

1. สมัครบัญชี KickBot และเชื่อมช่อง Kick ถ้ายังไม่ได้ทำ
2. เปิดคลังวิดเจ็ต
3. เปิด Basic Chat Widget (วิดเจ็ตทางการของ KickBot) หรือแชทสไตล์อื่นที่ชอบ
4. คลิก ติดตั้งวิดเจ็ต วิดเจ็ตจะถูกเพิ่มลงใน วิดเจ็ตที่บันทึกไว้
5. ในวิดเจ็ตที่บันทึกไว้ คลิก คัดลอก URL บนวิดเจ็ต ถ้าอยากเปลี่ยนหน้าตา ให้คลิก แก้ไข ก่อน

2. เพิ่ม browser source ใน OBS

1. ใน OBS เลือกซีนของคุณ
2. ใต้ Sources (แหล่งที่มา) คลิก + แล้วเลือก Browser
3. ตั้งชื่อ เช่น “Kick chat overlay” แล้วคลิก OK
4. วาง URL ของวิดเจ็ตในช่อง URL
5. ตั้ง Width (ความกว้าง) เป็น 800 และ Height (ความสูง) เป็น 600 (ขนาดของ Basic Chat Widget) ค่อยปรับทีหลังให้เข้ากับเลย์เอาต์
6. คลิก OK แล้วลากและปรับขนาดโอเวอร์เลย์ในหน้าตัวอย่าง

browser source ของ OBS มี custom CSS เริ่มต้นที่ทำให้พื้นหลังของหน้าโปร่งใส (OBS browser source) บนซีนจึงเห็นแค่ข้อความแชท

การตั้งค่าวิดเจ็ตทั้งหมดและแชทสไตล์อื่น ๆ ดูได้ที่โอเวอร์เลย์แชท ส่วนวิธีใช้ browser source ใน OBS, Streamlabs Desktop และ Meld ดูได้ที่เพิ่ม browser source

คำเตือน

เก็บ URL ของวิดเจ็ตไว้เป็นความลับ อย่าโชว์บนสตรีมหรือในภาพหน้าจอ

วิธีอื่นในการแสดงแชท Kick บนสตรีม

• Streamlabs Streamlabs บอกว่ามีวิดเจ็ต chat box สำหรับสตรีม Kick (Streamlabs) ดูใช้ Streamlabs กับ Kick
• Web Go Live ถ้าคุณสตรีมจากเบราว์เซอร์ด้วย Web Go Live ของ Kick จะมีวิดเจ็ต Chat Box ในตัว ไม่ต้องใช้ OBS (ศูนย์ช่วยเหลือของ Kick)

แก้ปัญหา

โอเวอร์เลย์ว่างเปล่า ส่งข้อความทดสอบในแชท Kick แล้วรอสักครู่ ถ้ายังไม่มีอะไรขึ้น ให้คลิกขวาที่ source เลือก Properties (คุณสมบัติ) แล้วคลิก Refresh cache of current page (รีเฟรชแคชของหน้าปัจจุบัน)

โอเวอร์เลย์มีพื้นหลังทึบ เช็กว่าช่อง Custom CSS ใน browser source ยังมีพื้นหลังโปร่งใสตามค่าเริ่มต้น ถ้าคุณเคยแก้ ให้ลบส่วนที่แก้ออก

แชทถูกตัดหรือเล็กเกินไป เปลี่ยน Width และ Height ใน properties ของ source แทนการยืด source การยืดทำให้ตัวหนังสือเบลอ

Dock แสดงแบนเนอร์คุกกี้ นี่เป็นข้อจำกัดที่รู้กันอยู่แล้วของแชทแบบป๊อปเอาต์ของ Kick เมื่อใช้ใน dock ให้ขยาย dock ให้กว้างขึ้น

คำถามที่พบบ่อย

เพิ่มแชท Kick ลงใน OBS ยังไง?

ถ้าต้องการแชทไว้อ่านเอง ให้เพิ่ม custom browser dock ใน OBS ด้วย URL https://kick.com/popout/yourchannel/chat ถ้าต้องการแชทบนสตรีม ให้เพิ่ม URL ของวิดเจ็ตแชท (เช่น จาก KickBot) เป็น source แบบ Browser ในซีน

ทำโอเวอร์เลย์แชท Kick พื้นหลังโปร่งใสยังไง?

ใช้วิดเจ็ตแชทที่ทำมาสำหรับ OBS เช่น วิดเจ็ตแชทของ KickBot แล้วเพิ่มเป็น source แบบ Browser OBS ทำให้พื้นหลังของหน้าโปร่งใสโดยค่าเริ่มต้น

พิมพ์แชท Kick จาก OBS ได้ไหม?

ไม่ได้ Kick บอกว่าล็อกอินหรือส่งข้อความจาก dock ไม่ได้ ให้เปิด kick.com ไว้ในเบราว์เซอร์หรือในมือถือเพื่อพิมพ์