# Squarespace 웹사이트에 Hyperclass 채팅 위젯 추가하기

웹사이트 방문자와 쉽게 소통하고 고객으로 전환시킬 수 있는 방법을 찾고 계신가요? Squarespace용 Hyperclass 웹채팅이 완벽한 솔루션입니다!

이 가이드에서는 Squarespace용 Hyperclass 웹채팅을 시작하는 단계를 안내해드리겠습니다.

#### 이 가이드에서 다룰 내용:

#### [웹사이트용 웹채팅 임베드 코드 얻는 방법](#웹사이트용-웹채팅-임베드-코드-얻는-방법)

#### [여러 방법으로 Squarespace 웹사이트에 커스텀 채팅 위젯을 추가하는 상세 단계](#여러-방법으로-squarespace-웹사이트에-커스텀-채팅-위젯을-추가하는-상세-단계)

* **방법 1:** 코드 인젝션을 사용한 커스텀 채팅 위젯 추가
* **방법 2:** 임베드 블록을 사용한 커스텀 채팅 위젯 추가

## 웹사이트용 웹채팅 임베드 코드 얻는 방법

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

![Hyperclass 채팅 위젯 코드 가져오기](https://s3.amazonaws.com/cdn.freshdesk.com/data/helpdesk/attachments/production/48297297829/original/oKtzhm7Qaeia1e1Pzl-q2_GbFteEF8ZoBw.gif?1683912268)

## 여러 방법으로 Squarespace 웹사이트에 커스텀 채팅 위젯을 추가하는 상세 단계

### 방법 1: 코드 인젝션을 사용한 커스텀 채팅 위젯 추가

* 위에서 설명한 대로 채팅 위젯(Chat Widget) 코드를 가져오세요.
* Squarespace 계정에 로그인하고 채팅 위젯을 추가하려는 웹사이트로 이동하세요.
* 메인 메뉴에서 "Settings"을 클릭하세요.

![Squarespace 설정 메뉴](https://s3.amazonaws.com/cdn.freshdesk.com/data/helpdesk/attachments/production/48297298463/original/7osDmJaDbDDGyz3eoae8jWLZgNntqPfhXQ.jpeg?1683912499)

* "Website" 섹션에서 "Developer Tools"를 선택하세요.

![Squarespace 개발자 도구](https://s3.amazonaws.com/cdn.freshdesk.com/data/helpdesk/attachments/production/48297298462/original/lEupdS6onJfVFtT3B7N2vJtchbGiLmOkcg.jpeg?1683912499)

* "Code Injection"을 클릭하세요.

![Squarespace 코드 인젝션](https://s3.amazonaws.com/cdn.freshdesk.com/data/helpdesk/attachments/production/48297298464/original/avj99lSZILiLAh4n0vlBtaJvR05DoOeg-w.jpeg?1683912499)

* "Header" 또는 "Footer" 필드에 채팅 위젯 코드를 붙여넣으세요.

![Squarespace 코드 붙여넣기](https://s3.amazonaws.com/cdn.freshdesk.com/data/helpdesk/attachments/production/48297298461/original/PuvfzPL-G4QWwZZBSituwfgcKuI0inTvbQ.jpeg?1683912498)

* "Save"를 클릭하여 변경 사항을 저장하세요.
* 웹사이트를 미리 보기하여 채팅 위젯이 올바르게 표시되는지 확인하세요.

***

### 방법 2: 임베드 블록을 사용한 커스텀 채팅 위젯 추가

* Squarespace 계정에 로그인하고 채팅 위젯을 추가하려는 페이지로 이동하세요.
* 페이지 편집기를 클릭하고 채팅 위젯을 추가하려는 섹션을 선택하세요.
* 플러스 아이콘을 클릭하여 새 콘텐츠 블록을 추가하고 드롭다운 메뉴에서 "Embed"를 선택하세요.
* "Code Snippet" 필드에 채팅 위젯 코드를 붙여넣으세요.
* "Apply"를 클릭하여 변경 사항을 적용하세요.
* 웹사이트를 미리 보기하여 채팅 위젯이 올바르게 표시되는지 확인하세요.

***

*원문 최종 수정: Fri, 2 May, 2025 at 10:08 AM* *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-squarespace-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.