STUDIO로 만든 사이트는 보기 좋게 완성됩니다. 그런데 공개하고 얼마 지나면 문의 폼에 같은 질문이 쌓이기 시작합니다. "요금은 얼마인가요" "대응 지역은 어디까지인가요" "도입까지 얼마나 걸리나요".

사이트 어딘가에는 적혀 있는데 방문자는 찾지 못하고 폼을 엽니다. 그리고 답장을 기다리는 사이에 다른 회사에 문의하고 있습니다. 그 자리에서 답하는 창구가 있으면 이 놓침을 줄일 수 있습니다.

이 글에서는 STUDIO 사이트에 AI 챗봇을 설치하는 절차를 실제 설정 화면의 흐름에 따라 설명합니다. 아울러 STUDIO 특유의 "미리보기에서는 나오지 않는" 사양과, 임베드 박스(Embed)를 쓰면 안 되는 이유도 다룹니다. 이 두 가지를 모르면 제대로 붙여 놓고도 고장 났다고 착각하게 됩니다.

이 글에서 알 수 있는 것

STUDIO에서 챗봇 설치 경로가 "커스텀 코드" 하나뿐인 이유
3단계의 구체적인 설치 절차
유료 플랜이 필요한 이유와 그 비용을 보는 관점
"붙였는데 안 나온다"의 대부분을 차지하는, STUDIO 특유의 사양
LINE이나 온라인 스토어와 조합할 때의 역할 분담

1. STUDIO의 설치 위치는 "커스텀 코드"

STUDIO에는 HTML 파일을 직접 편집하는 기능이 없습니다. 디자인 에디터에서 만든 내용이 그대로 공개 사이트가 됩니다. 그래서 외부 스크립트를 넣는 창구는 커스텀 코드로 한정됩니다.

커스텀 코드는 </head> 직전과 </body> 직전에 직접 작성한 코드를 넣을 수 있는 기능입니다. 분석 태그나 광고 태그를 넣을 때도 쓰는 표준적인 구조이고, 챗봇도 여기에 넣습니다.

임베드 박스(Embed)로는 잘 되지 않는다

STUDIO에는 코드를 다룰 수 있는 곳이 하나 더 있습니다. 추가 패널에서 배치하는 임베드 박스(Embed / Blank 박스)입니다. 여기에도 HTML과 JavaScript를 쓸 수 있어서 이쪽에 붙이려는 분이 많은데, 챗 위젯에는 맞지 않습니다.

이유는 임베드 박스의 내용이 iframe으로 전개되기 때문입니다. iframe은 자기 틀 안만을 그리는 영역으로 삼습니다. 챗봇은 화면 오른쪽 아래에 고정으로 떠 있다가 클릭하면 크게 열리는 구조이므로, 상자 안에 갇히면 버튼이 잘리고, 열어도 틀 밖으로 나올 수 없는 상태가 됩니다.

챗봇처럼 페이지 전체에 대해 띄우고 싶은 것은 반드시 커스텀 코드 쪽에 넣으세요. 임베드 박스가 맞는 것은 지도, 동영상, 폼처럼 "이 자리에 이 크기로 두고 싶은" 것들입니다.

2. 설치 절차 (3단계)

여기서는 저희가 제공하는 Monoshiri AI를 예로 설명합니다. 소요 시간은 5분 정도이고, 코드를 쓰는 장면은 없습니다.

1단계: 임베드 코드 가져오기

Monoshiri AI에 계정을 만들고, 관리 화면에서 위젯을 생성해 "임베드 코드"를 복사합니다. 형태는 이런 한 줄짜리 script 태그입니다.

<script async src="https://monoshiri.ai/widget/embed.js" data-api-key="（발급된 본인 키）" data-api-url="https://api.monoshiri.ai"></script>

설치할 도메인을 미리 등록할 필요는 없습니다. studio.site 서브도메인이든, 독자 도메인을 연결한 사이트든 같은 코드가 그대로 동작합니다.

2단계: 커스텀 코드 설정 열기

STUDIO 디자인 에디터에서 대상 프로젝트를 열고 커스텀 코드 입력란을 엽니다. 화면 바깥쪽(회색 영역)을 클릭해 오른쪽 패널을 열면, 사이트 전체에 적용하는 설정과 페이지별로 적용하는 설정이 탭으로 나뉘어 있습니다.

챗봇은 모든 페이지에 띄우는 것이므로 사이트 전체 쪽을 선택합니다.

에디터 UI는 업데이트될 수 있습니다. 메뉴 이름이 글과 다르면 STUDIO 공식 도움말에서 "커스텀 코드"를 검색해 최신 위치를 확인하세요.

3단계: `</body>` 직전에 붙여 넣고 공개하기

커스텀 코드에는 </head> 직전과 </body> 직전, 두 자리가 있습니다. 챗봇은 </body> 직전에 넣습니다.

</head> 쪽은 페이지 본체가 그려지기 전에 실행되므로 표시 속도에 영향을 주기 쉬운 자리입니다. 챗 위젯처럼 "페이지가 표시된 뒤 오른쪽 아래에 나오면 되는 것"은 종료 태그 직전이 적합합니다.

붙여 넣었으면 저장하고 공개(Publish)합니다. 여기가 가장 중요합니다. 자세한 내용은 다음 장에서 설명합니다.

더 자세한 요건과 화면이 포함된 절차는 STUDIO 연동 페이지에 정리해 두었습니다. STUDIO 외의 사이트를 포함한 위젯 전반의 사고방식은 챗 위젯 도입 가이드를 참고하세요.

3. 막히는 대부분은 "미리보기에서 확인하고 있다"

STUDIO에서 가장 많은 걸림돌이 이것입니다.

커스텀 코드는 디자인 에디터와 미리보기에서는 동작하지 않습니다. STUDIO 공식 도움말에도, 추가한 코드는 디자인 에디터나 라이브 미리보기에서는 실행되지 않으므로 공개된 사이트에서 테스트하라고 명시되어 있습니다.

즉, 제대로 붙였는데도 미리보기를 보고 있는 한 오른쪽 아래에는 아무것도 나오지 않습니다. 여기서 "설정이 잘못됐다"고 판단해 다시 붙이거나 임베드 박스로 옮기면 오히려 헤매게 됩니다.

확인 순서는 이렇게 하세요.

커스텀 코드에 붙여 넣고 저장한다
공개(Publish)한다
공개 URL(studio.site 또는 독자 도메인)을 브라우저로 연다
그래도 안 나오면 강력 새로고침(Windows: Ctrl+F5 / Mac: Command+Shift+R)으로 다시 확인한다

그래도 표시되지 않으면 Monoshiri AI 쪽에서 위젯이 공개 상태인지 확인합니다. 관리 화면에서 초안 상태면 코드를 붙여도 아무것도 나오지 않습니다.

알아 두면 헤매지 않는 사양

공식 도움말에 나온 사양 중 실무에서 효과가 있는 것들입니다.

</head> 직전에 쓸 수 있는 태그는 제한적입니다(link / meta / style / script / noscript). 챗봇은 script 태그라 양쪽 다 가능하지만 </body> 직전을 권장합니다
코드 블록은 </head> 쪽·</body> 쪽 각각 최대 10개, 한 필드당 30,000자까지입니다. 분석 태그와 함께 써도 일반적인 운용에서는 상한에 닿지 않습니다
사이트 전체와 페이지별 양쪽 모두 설정할 수 있습니다. 페이지별에 넣으면 그 페이지에서만 표시됩니다. 챗봇은 사이트 전체 쪽에 넣으세요

4. 유료 플랜이 필요한 이유와 비용을 보는 관점

솔직히 씁니다. STUDIO의 커스텀 코드는 유료 플랜 전용 기능입니다. 무료(Free) 플랜에서는 입력란 자체를 쓸 수 없어 이 방법으로 챗봇을 설치할 수 없습니다.

STUDIO의 유료 플랜은 Mini부터 시작합니다. 2026년 9월 시점에 연간 결제 시 월 590엔 정도, 월간 결제 시 월 1,290엔 정도입니다. 플랜 구성과 요금은 변경될 수 있으므로, 계약 전에 반드시 STUDIO 공식 요금 페이지에서 최신 조건을 확인하세요.

여기서 관점을 정리합니다. STUDIO로 만든 사이트를 사업에 쓴다면 독자 도메인 연결이나 배너 제거를 위해 언젠가는 유료 플랜으로 올리게 됩니다. 커스텀 코드만을 위해 올린다기보다, 유료 플랜으로 올렸을 때 쓸 수 있게 되는 기능 중 하나로 보는 편이 실제에 가깝습니다.

챗봇 쪽 비용은 별도로 듭니다. 참고로 Monoshiri AI의 숫자를 들어 둡니다.

	Free	Light	Standard	Pro
월액(세금 포함)	0엔	2,980엔	7,980엔	29,800엔
AI 답변 수(월간)	150회	1,000회	3,000회	20,000회
폴더 수	1	5	10	30
폴더당 파일 수	30건	100건	300건	300건
챗 위젯	1개(월 150회)	1개	1개	1개

2026년 9월 시점. 최신 내용은 요금 플랜에서 확인하세요.

무료 플랜은 "내 사이트에서 쓸 수 있는지 확인하기 위한 것"으로 보는 편이 현실적입니다. 챗봇이 작동하기 시작하면 월 150회는 하루 5회 페이스로 도달합니다. 반대로 몇 달이 지나도 상한에 닿지 않는다면 "문의 모수 자체가 적다"는 사실을 알게 된 것이고, 그것대로 유용한 정보입니다.

"무료"의 내용을 나누는 방법은 WordPress에 챗봇을 무료로 넣는 방법에서 세 가지 유형으로 정리했습니다. 사고방식은 STUDIO에서도 그대로 씁니다.

5. LINE이나 온라인 스토어와 조합하기

LINE 동선과 AI 챗은 역할이 다르다

STUDIO 사이트에 LINE을 두고 싶다는 상담은 자주 있습니다. 여기는 정리해 둘 필요가 있습니다.

LINE 공식 계정 쪽에서 제공되는 것은 친구 추가를 위한 동선이 중심입니다. LINE 대화 화면 자체를 사이트 안에 삽입해 그 자리에서 대화를 끝내는 구조가 아닙니다(사양은 바뀔 수 있으므로 최신 내용은 LINE 공식 문서를 확인하세요).

즉, 사이트에 LINE 동선을 두면 방문자는 "LINE 앱으로 이동해서, 친구 추가하고, 그다음에 질문한다"는 흐름이 됩니다. 지금 바로 묻고 싶을 뿐인 사람에게는 턱이 세 개 있는 셈입니다.

현실적인 조합은 이렇습니다.

사이트에서 지금 바로 묻고 싶은 질문 → 챗 위젯으로 즉답
지속적으로 연락하고 싶은 상대 → LINE 친구 추가로 유도

Monoshiri AI는 LINE 연동도 지원하므로, 웹 챗 위젯과 LINE 공식 계정의 자동 응답에서 같은 자료를 바탕으로 같은 답변을 돌려줄 수 있습니다. 창구마다 답변을 따로 만들 필요가 없습니다. 사고방식은 LINE으로 사내 지식에 답하게 하기에 정리했습니다.

온라인 스토어를 다른 서비스로 운영하는 경우

STUDIO로 기업 사이트를 만들고 판매는 별도 이커머스 서비스에서, 라는 구성도 흔합니다. 이 경우 양쪽에 같은 임베드 코드를 붙이면 어느 쪽에서도 같은 챗봇이 동작합니다. 도메인별 등록이 필요 없으므로 붙이기만 하면 됩니다.

이커머스 쪽 설치 절차는 Shopify에 챗봇을 설치하는 방법과 BASE에 챗봇을 설치하는 방법에 정리했습니다.

6. 무엇을 답하게 할지는 넣는 자료로 정해진다

설치만 해서는 챗봇은 아무것도 답하지 못합니다. AI가 읽는 자료의 질이 그대로 답변의 질이 됩니다.

시나리오나 예상 문답의 분기를 만들 필요는 없습니다. 텍스트나 PDF를 업로드하면 AI가 그 내용을 바탕으로 답합니다. STUDIO로 많이 만들어지는 기업 사이트·서비스 사이트라면 처음에 넣어야 할 것은 다음 다섯 가지입니다.

서비스 소개 자료 — 제공 내용, 대응 범위, 다른 곳과의 차이
요금표 — 플랜, 옵션, 초기 비용 유무
FAQ 페이지의 내용 — 이미 사이트에 있는 것을 그대로 복사하면 충분합니다
도입 흐름 — 문의부터 시작까지의 기간과 단계
회사 개요·대응 지역 — 소재지, 영업시간, 대응 가능한 지역

요령은 이미 사이트에 적혀 있는 내용을 그대로 파일로 만드는 것입니다. 새로 글을 쓰려고 하면 그것만으로 도입이 멈춥니다.

STUDIO로 만든 사이트는 디자인을 우선해 정보량을 줄인 경우가 많아, "적혀 있지 않아서 묻는" 질문이 모이기 쉬운 경향이 있습니다. 챗봇에 넣는 자료는 사이트에 다 담지 못한 상세 정보의 보관처로도 기능합니다.

7. 설치하고 나서가 본편

챗봇은 "두면 끝"인 도구가 아닙니다. 효과가 나는지는 설치 후 대화 로그를 보는지 여부로 거의 결정됩니다.

Monoshiri AI에서는 관리 화면에서 방문자의 질문, AI의 답변, 평가를 확인할 수 있습니다. 여기서 봐야 할 것은 잘 답한 대화가 아니라 답하지 못한 대화입니다. 그것은 그대로 "사이트에 적혀 있지 않은 정보"의 목록이 됩니다.

자주 있는 패턴은 이렇습니다.

대응 지역 질문이 많다 → 대응 지역 자료를 추가하고 사이트에도 명기한다
"개인도 의뢰할 수 있나요"가 반복된다 → 서비스 소개 페이지에 한 문장을 더한다
요금의 세부 조건을 묻는다 → 요금표에 조건을 덧붙인다

세 번째가 핵심입니다. 챗봇에 모이는 질문은 사이트의 개선 목록이기도 합니다. 문의를 줄이는 가장 효과적인 수단은 애초에 묻지 않아도 되는 상태를 만드는 것입니다.

그 밖의 걸림돌

오른쪽 아래에서 버튼이 겹친다: STUDIO 사이트에는 페이지 맨 위로 돌아가는 버튼 등 오른쪽 아래에 놓이는 요소가 있습니다. 겹치면 Monoshiri AI 관리 화면에서 버튼 위치를 왼쪽 아래로 바꿀 수 있습니다.

모바일에서의 모습: 많은 위젯은 스마트폰에서 전체 화면 표시로 전환됩니다. 설치 후에는 반드시 실제 스마트폰으로 열어 확인하세요. PC 브라우저 폭을 좁히는 것만으로는 알아채지 못하는 깨짐이 있습니다.

애니메이션과의 간섭: 챗 위젯은 독립된 스크립트로 오른쪽 아래에 표시되므로 STUDIO의 스크롤 연출이나 인터랙션과 간섭하지 않습니다.

예약이나 결제는 할 수 없다: 챗봇이 할 수 있는 것은 자료에 근거해 질문에 답하는 것입니다. 예약 확정이나 결제 처리는 하지 않습니다. 위젯 설정에 문의 폼 URL을 등록해 두면 AI가 다 답하지 못할 때 보낼 곳이 마련됩니다.

정리

STUDIO의 설치 위치는 커스텀 코드 하나. 임베드 박스는 iframe에 갇히므로 오른쪽 아래 고정 챗 위젯에는 쓸 수 없다
절차는 임베드 코드 취득 → 커스텀 코드 열기 → </body> 직전에 붙이고 공개의 3단계. 5분 정도이고 코드를 쓰지 않는다
가장 큰 걸림돌은 커스텀 코드가 에디터와 미리보기에서 동작하지 않는 것. 반드시 공개한 사이트에서 확인한다
커스텀 코드는 유료 플랜 전용. 무료 플랜에서는 설치할 수 없고, 요금은 바뀌므로 계약 전에 공식 페이지에서 확인한다
코드 블록은 각 쪽 최대 10개, 한 필드 30,000자까지
임베드 코드는 도메인별 등록이 불필요. studio.site에서도 독자 도메인에서도 그대로 동작한다
LINE은 사이트 안에서 대화를 끝내는 구조가 아니므로 그 자리의 질문은 위젯, 지속 연락은 LINE으로 역할을 나눈다
답변의 질은 넣는 자료의 질로 정해진다. 서비스 소개, 요금표, FAQ, 도입 흐름, 회사 개요를 기존 페이지에서 복사해 넣는다
설치 후에는 대화 로그를 보고, 답하지 못한 질문을 자료와 사이트 본체에 반영한다

STUDIO에 챗봇을 설치하는 방법｜커스텀 코드로 삽입하는 절차 【2026년판】

이 글에서 알 수 있는 것