> ## Documentation Index
> Fetch the complete documentation index at: https://guide.dorothy.land/llms.txt
> Use this file to discover all available pages before exploring further.

# 도로시 채팅창 OBS / PRISM 설정

> 채팅 오버레이 공개 URL을 브라우저 소스로 추가해 채팅과 시청자 수를 방송 화면에 표시합니다.

도로시의 **채팅 오버레이** 공개 URL을 브라우저 소스로 추가하면 여러 플랫폼의 채팅과 시청자 수를 방송 화면에 표시할 수 있어요.

## 공개 URL 준비하기

1. [채팅 오버레이](https://dorothy.land/workspace/chat)를 엽니다.
2. 화면 위쪽의 **공개 URL**에서 가려진 값을 눌러 확인합니다.
3. **복사**를 누릅니다.
4. **열기**로 새 화면을 확인해도 좋습니다.

<Warning>
  공개 URL은 프리셋마다 따로 만들어집니다. 주소를 아는 사람은 위젯 화면에 접근할 수 있어요. 주소가 방송 화면이나 게시글에 노출됐다면 **URL 재생성**을 누른 뒤 OBS·PRISM의 기존 주소도 새 주소로 교체해 주세요. 프리셋을 삭제해도 기존 URL은 즉시 사용할 수 없게 됩니다.
</Warning>

## OBS Studio에 추가하기

1. 채팅창을 넣을 **장면**을 선택합니다.
2. **소스 → + → 브라우저**를 선택합니다.
3. 알아보기 쉬운 이름을 입력합니다. 예: `도로시 채팅창`
4. **URL**에 도로시 공개 URL을 붙여 넣습니다.
5. 가로·세로 크기를 방송 화면에 맞게 정합니다. 전체 화면 위에서 자유롭게 배치하려면 먼저 방송 캔버스 크기와 같게 설정한 뒤 조절하면 편합니다.
6. 배경이 투명하게 보이는지 확인하고 **확인**을 누릅니다.
7. 미리보기에서 위치와 크기를 조절합니다.

실시간 채팅 연결을 유지하려면 **소스가 보이지 않을 때 종료**와 **장면이 활성화될 때 브라우저 새로고침**은 특별한 이유가 없다면 꺼 두는 것을 권장합니다.

## PRISM Live Studio에 추가하기

1. 채팅창을 넣을 장면을 선택합니다.
2. \*\*Sources(소스) → +\*\*를 누릅니다.
3. \*\*Browser Capture(브라우저 캡처)\*\*를 선택합니다.
4. URL 입력란에 도로시 공개 URL을 붙여 넣습니다.
5. 소스 크기를 방송 해상도 또는 원하는 채팅 영역에 맞춥니다.
6. 저장한 뒤 미리보기에서 위치와 크기를 조절합니다.

<Info>
  PRISM 공식 안내에서 Browser Capture는 실시간 차트·알림 위젯처럼 웹 콘텐츠를 방송 화면에 넣는 소스입니다. 도로시 채팅창과 GIF TALK도 같은 방식으로 추가합니다.
</Info>

## 잘 보이는지 테스트하기

도로시 **채팅 오버레이** 화면 아래의 미리보기에서 다음을 확인할 수 있습니다.

* 치지직·유튜브 등 플랫폼별 테스트 채팅
* 시청자 수 표시
* 테스트 유형과 플랫폼 선택
* 닉네임과 채팅 메시지 입력
* **채팅 전송** 테스트

설정을 바꿨다면 **저장하기**를 누른 뒤 OBS 또는 PRISM의 브라우저 소스를 새로고침해 주세요.

### 유튜브 채팅을 연결할 때

유튜브 방송을 시작한 뒤 [방송 설정](https://dorothy.land/workspace/broadcast)에서 **현재 라이브 불러오기**를 눌러 주세요. 현재 라이브 영상이 연결되어야 도로시 채팅창에서 해당 방송의 채팅을 불러올 수 있습니다.

## 문제 해결

### 투명해야 할 곳이 검게 보여요

* 도로시의 **배경 스타일 → 배경** 투명도가 `0%`인지 확인합니다.
* OBS 브라우저 소스의 기본 투명 배경 CSS를 지우지 않았는지 확인합니다.
* PRISM 브라우저 캡처의 배경 또는 투명도 옵션을 확인합니다.

### 채팅이 갱신되지 않아요

* 도로시에서 플랫폼 연결이 유지되고 있는지 확인합니다.
* 브라우저 소스를 한 번 새로고침합니다.
* URL을 재생성했다면 새 URL로 바꿨는지 확인합니다.

### 글자가 잘려요

* 브라우저 소스의 가로·세로 크기를 늘립니다.
* 도로시에서 글자 크기와 아이콘 크기를 낮춥니다.
* 미리보기와 실제 방송 캔버스 비율이 같은지 확인합니다.

## 참고

* [OBS 공식 Browser Source 안내](https://obsproject.com/kb/browser-source)
* [PRISM Desktop 공식 시작 가이드](https://guide.prismlive.com/desktop/guides/getting-started-with-prism-desktop)
* [PRISM 공식 FAQ](https://prismlive.com/ko_kr/faq/faq.html)
