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

> 2 วิธีใส่แชท Kick ใน OBS: chat dock เพื่ออ่านแชทระหว่างไลฟ์ และโอเวอร์เลย์แชทพื้นหลังโปร่งใสให้ผู้ชมเห็นบนสตรีม

Source: https://kickbot.com/th/guides/setup/add-kick-chat-to-obs

การเพิ่มแชท 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](https://help.kick.com/en/articles/7978574-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](https://kickbot.com/th/docs/getting-started/create-your-account) และเชื่อมช่อง Kick ถ้ายังไม่ได้ทำ
2. เปิด[คลังวิดเจ็ต](https://kickbot.com/dashboard/widget-library)
3. เปิด **Basic Chat Widget** (วิดเจ็ตทางการของ KickBot) หรือแชทสไตล์อื่นที่ชอบ
4. คลิก **ติดตั้งวิดเจ็ต** วิดเจ็ตจะถูกเพิ่มลงใน **วิดเจ็ตที่บันทึกไว้**
5. ใน[วิดเจ็ตที่บันทึกไว้](https://kickbot.com/dashboard/saved-widgets) คลิก **คัดลอก 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](https://obsproject.com/kb/browser-source)) บนซีนจึงเห็นแค่ข้อความแชท

การตั้งค่าวิดเจ็ตทั้งหมดและแชทสไตล์อื่น ๆ ดูได้ที่[โอเวอร์เลย์แชท](https://kickbot.com/th/docs/widgets/chat-overlay) ส่วนวิธีใช้ browser source ใน OBS, Streamlabs Desktop และ Meld ดูได้ที่[เพิ่ม browser source](https://kickbot.com/th/docs/getting-started/add-browser-source-obs)

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

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

- **Streamlabs** Streamlabs บอกว่ามีวิดเจ็ต chat box สำหรับสตรีม Kick ([Streamlabs](https://streamlabs.com/content-hub/post/how-to-live-stream-to-kick-using-streamlabs-desktop)) ดู[ใช้ Streamlabs กับ Kick](https://kickbot.com/th/guides/setup/streamlabs-and-kick)
- **Web Go Live** ถ้าคุณสตรีมจากเบราว์เซอร์ด้วย Web Go Live ของ Kick จะมีวิดเจ็ต **Chat Box** ในตัว ไม่ต้องใช้ OBS ([ศูนย์ช่วยเหลือของ Kick](https://help.kick.com/en/articles/15952303-kick-studio-web-go-live))

## แก้ปัญหา

**โอเวอร์เลย์ว่างเปล่า** ส่งข้อความทดสอบในแชท 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 ไว้ในเบราว์เซอร์หรือในมือถือเพื่อพิมพ์