# Duda 웹사이트에 하이퍼클래스 채팅 위젯 추가하기

## Duda 웹사이트에 하이퍼클래스 채팅 위젯 추가하기

웹사이트 방문자와 쉽게 소통하고 고객으로 전환할 방법을 찾고 계신가요? Duda용 하이퍼클래스 웹채팅이 완벽한 솔루션입니다! 이 가이드에서는 Duda용 하이퍼클래스 웹채팅을 시작하는 단계를 차근차근 안내해드리겠습니다.

***

**이 가이드에서 다루는 내용:**

[**웹사이트용 웹채팅 임베드 코드를 가져오는 방법:**](#웹사이트용-웹채팅-임베드-코드를-가져오는-방법)

[**다양한 방법으로 Duda 웹사이트에 커스텀 채팅 위젯을 추가하는 자세한 단계:**](#다양한-방법으로-duda-웹사이트에-커스텀-채팅-위젯을-추가하는-자세한-단계)

*

[**방법 1:**](#방법-1)

*

[**방법 2:**](#방법-2)

***

## 웹사이트용 웹채팅 임베드 코드를 가져오는 방법:

Sites(사이트) > Chat Widget(채팅 위젯) > Get Code(코드 가져오기)에서 임베드 코드를 복사합니다.

![채팅 위젯 임베드 코드 복사하기](https://s3.amazonaws.com/cdn.freshdesk.com/data/helpdesk/attachments/production/48297297829/original/oKtzhm7Qaeia1e1Pzl-q2_GbFteEF8ZoBw.gif?1683912268)

***

### 다양한 방법으로 Duda 웹사이트에 커스텀 채팅 위젯을 추가하는 자세한 단계:

#### 방법 1:

* Duda 계정에 로그인: Duda 대시보드에 로그인하고 웹사이트의 편집 모드를 엽니다.
* 사이트 편집: 채팅 위젯을 추가할 사이트로 이동한 후 "Edit Site(사이트 편집)" 버튼을 클릭합니다.

![Duda 사이트 편집 버튼](https://s3.amazonaws.com/cdn.freshdesk.com/data/helpdesk/attachments/production/48297320884/original/wBO0Ap0VVrjoUxrDNads9rKtzUtTk8IuFg.jpeg?1683922795)

* 왼쪽 컬럼에서 Settings(설정)을 클릭합니다.
* 그 다음 Head HTML을 클릭합니다.
* 임베드 코드 붙여넣기: 채팅 위젯의 임베드 코드를 편집기에 붙여넣습니다.

![Duda Head HTML 섹션에 코드 붙여넣기](https://s3.amazonaws.com/cdn.freshdesk.com/data/helpdesk/attachments/production/48297320881/original/hlGsehMfpbnRSL1HLQtvFzqWsVKnjg7edQ.jpeg?1683922795)

* 변경 사항 저장: "Save(저장)" 버튼을 클릭하여 변경 사항을 저장합니다.
* 채팅 위젯 미리보기: 사이트를 미리보기하여 위젯이 올바른 위치에 나타나고 예상대로 작동하는지 확인합니다.

***

#### **방법 2:**

편집기에서 HTML 요소를 사용하여 채팅 위젯을 추가할 수도 있습니다.

* HTML 요소 추가: 편집기에서 채팅 위젯을 표시할 페이지 위치로 HTML 요소를 드래그 앤 드롭합니다.
* HTML 편집기 열기: 방금 추가한 HTML 요소를 더블클릭하여 HTML 편집기를 엽니다.
* 임베드 코드 붙여넣기: 채팅 위젯의 임베드 코드를 HTML 편집기에 붙여넣습니다.
* 변경 사항 저장: "Save(저장)" 버튼을 클릭하여 변경 사항을 저장합니다.

***

*원문 최종 수정: 2024년 10월 11일* *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/add-highlevel-s-chat-widget-to-your-duda-website.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.