# 라이브 채팅 위젯에서 파일 첨부 기능 사용하기

이 가이드는 웹사이트 방문자가 채팅 위젯에서 이미지와 PDF를 공유할 수 있도록 설정하고, 팀이 인박스에서 해당 파일을 확인하는 방법을 단계별로 설명합니다. 관리자와 상담원을 위한 실무 관점의 가이드입니다.

***

## 목차

* [채팅 파일 첨부란?](#채팅-파일-첨부란)
* [지원되는 파일 형식 및 제한사항](#지원되는-파일-형식-및-제한사항)
* [사전 준비사항](#사전-준비사항)
* [파일 업로드 (방문자 화면)](#파일-업로드-방문자-화면)
* [파일 확인 (상담원 화면)](#파일-확인-상담원-화면)
* [선택사항: AI 봇이 이미지에 응답하도록 설정하기](#선택사항-ai-봇이-이미지에-응답하도록-설정하기)
* [모범 사례](#모범-사례)
* [자주 묻는 질문](#자주-묻는-질문)
* [문제해결](#문제해결)

***

## 채팅 파일 첨부란?

채팅 파일 첨부 기능을 통해 방문자는 채팅 메시지에 **파일**을 포함시킬 수 있습니다. 위젯은 **이미지와 PDF**를 지원하며, 업로드 진행 상황을 명확하게 표시합니다. 상담원은 팀 인박스(CRM 대화)에서 파일을 받아 미리 보거나 다운로드할 수 있습니다.

이 기능은 라이브 채팅 위젯(웹사이트 채팅)에서만 적용됩니다. 위젯 빌더에서 별도 설정은 필요하지 않지만, 방문자의 사용 경험에 대해 설명합니다.

***

## 지원되는 파일 형식 및 제한사항

* **파일 형식:** .jpg, .jpeg, .png, .heic (아이폰 사진), .pdf
* **파일당 크기 제한:** 최대 25MB
* **메시지당 파일 개수:** **최대 5개**
* **미리보기 동작:**
  * **JPG/PNG:** 채팅 말풍선과 인박스에서 작은 인라인 미리보기 제공
  * **HEIC/PDF:** 파일명으로 표시되며 다운로드 옵션 제공 (인라인 미리보기 없음)
* **전송 규칙:** 첨부 파일을 보내려면 **짧은 텍스트 메시지가 필수**입니다

***

## 사전 준비사항

* 웹사이트에 라이브 채팅이 설치되어 있어야 함
* 상담원이 팀 인박스(CRM 대화)에 접근 권한이 있어야 함

***

## 파일 업로드 (방문자 화면)

**데스크톱**

* 채팅 입력창에서 **클립 아이콘**을 클릭하거나, **파일 탐색기**에서 채팅으로 파일을 **드래그**해주세요.

![채팅 위젯의 파일 첨부 버튼](https://s3.amazonaws.com/cdn.freshdesk.com/data/helpdesk/attachments/production/155055904013/original/ZXst3mJDzZlMeZxLLl3FBhqQ-1Y4cHhjcQ.png?1760401242)

* 지원되는 파일을 **최대 5개**까지 선택하세요 (각각 25MB 이하).
* **짧은 메시지를 입력**한 후 (필수) **전송**을 클릭하세요.

![채팅에서 파일 업로드 화면](https://s3.amazonaws.com/cdn.freshdesk.com/data/helpdesk/attachments/production/155055904053/original/e1tgELP7W8PSn_ImAPFToA4uUCTxb2Kvsw.png?1760401431)

**모바일**

* **클립 아이콘**을 탭하세요.
* **카메라** 또는 **갤러리**를 선택하세요.
* 파일을 선택한 후, **짧은 메시지를 추가**하고 **전송**하세요.

방문자가 보는 화면:

* **JPG/PNG**는 대화창에서 작은 미리보기로 표시됩니다.
* **HEIC/PDF**는 파일명과 다운로드 옵션으로 나타납니다.

***

## 파일 확인 (상담원 화면)

**팀 인박스**에서:

* **JPG/PNG**를 클릭하면 미리보기 또는 다운로드할 수 있습니다
* **HEIC/PDF**를 클릭하면 다운로드됩니다

![인박스에서 첨부 파일 확인 화면](https://s3.amazonaws.com/cdn.freshdesk.com/data/helpdesk/attachments/production/155055904048/original/NSaaI6xl2aapkqbk5t8wPKDRXlQzlDn5hA.png?1760401397)

**팁**: 브라우저에서 HEIC 파일 미리보기가 되지 않는다면, 파일을 다운로드하여 로컬에서 열어보세요.

***

## 선택사항: AI 봇이 이미지에 응답하도록 설정하기

대화 AI 에이전트를 사용 중이고 방문자가 보낸 **이미지에 응답**하도록 설정하려면:

* `Settings(설정) > Labs` (하위 계정 탭)로 이동하여 **이미지 응답** 기능을 활성화하세요.

![Labs에서 이미지 응답 설정](https://s3.amazonaws.com/cdn.freshdesk.com/data/helpdesk/attachments/production/155055904055/original/cTw-bHgXQ1STiF5nxjns26Z7YIZQcFU-sA.png?1760401450)

* **AI 에이전트** 설정을 열고 "이 봇이 이미지에 응답하도록 허용"을 토글하세요.

![AI 에이전트에서 이미지 응답 설정](https://s3.amazonaws.com/cdn.freshdesk.com/data/helpdesk/attachments/production/155055904058/original/NYFHKggKLiFd3MPRb-YC9NXcOm6-p7Jc-w.png?1760401459)

**현재 제한사항:** 봇은 **이미지에만** 응답할 수 있습니다. PDF는 아직 지원되지 않습니다.

***

## 모범 사례

* **파일명을 깔끔하게 유지하세요**: 영문자, 숫자, 하이픈/언더스코어를 사용하고, 연속된 공백이나 특수 문자는 피하세요
* **느린 네트워크에서는 큰 이미지를 압축**한 후 전송하세요

***

## 자주 묻는 질문

1. **방문자가 여러 파일을 보낼 수 있나요?** 네. 메시지당 **최대 5개** 파일까지 가능합니다.
2. **왜 메시지를 입력해야 하나요?** 대화를 명확하고 검색 가능하게 유지하기 위해서입니다. 첨부파일에는 짧은 텍스트가 필요합니다.
3. **일부 파일이 미리보기가 안 되는 이유는?** **JPG/PNG**만 인라인 미리보기됩니다. **HEIC/PDF**는 다운로드 가능한 파일로 표시됩니다.
4. **위젯 빌더에서 파일을 업로드할 수 있나요?** 아니요. 파일은 **방문자 채팅**에서 첨부되며, 상담원은 팀 인박스(CRM 대화)에서 확인합니다.

***

## 문제해결

* **"이 파일은 이미 첨부되었습니다"**: 중복 파일을 제거하고 다른 파일을 첨부하세요.
* **"파일이 너무 큽니다"**: 25MB 이하로 줄이거나 이미지를 압축하세요.
* **"지원되지 않는 파일 형식입니다"**: JPG/PNG/HEIC/PDF로 변환하세요.
* **드래그 앤 드롭이 작동하지 않아요**: 파일 탐색기에서 드래그하거나 클립 선택기를 사용해보세요.
* **업로드가 느려요**: 큰 파일이나 느린 연결로 인해 시간이 걸릴 수 있습니다. 필요하면 압축하세요.

***

*원문 최종 수정: 2025년 10월 14일* *Hyperclass 사용 가이드 — hyperclass.ai*


---

# Agent Instructions: Querying This Documentation

If you need additional information that is not directly available in this page, you can query the documentation dynamically by asking a question.

Perform an HTTP GET request on the current page URL with the `ask` query parameter:

```
GET https://hyperclass.gitbook.io/hyperclass-docs/and-sites/xml-sitemaps/how-to-use-chat-attachments-in-live-chat-widgets.md?ask=<question>
```

The question should be specific, self-contained, and written in natural language.
The response will contain a direct answer to the question and relevant excerpts and sources from the documentation.

Use this mechanism when the answer is not explicitly present in the current page, you need clarification or additional context, or you want to retrieve related documentation sections.