Craft CMS에 Asyntai AI 챗봇을 추가하는 방법

Craft CMS 웹사이트를 위한 단계별 가이드

임베드 코드 받기

플랫폼:

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

먼저 Asyntai 대시보드로 이동하여 "임베드 코드" 섹션까지 아래로 스크롤하십시오. 다음과 같은 형태의 고유 임베드 코드를 복사하십시오:

<script async src="https://asyntai.com/static/js/chat-widget.js" data-asyntai-id="YOUR_WIDGET_ID"></script>

참고: 위의 코드는 예시일 뿐입니다. 개인 위젯 ID가 포함된 고유한 임베드 코드를 대시보드에서 복사해야 합니다.

2단계: 레이아웃 템플릿 편집 (권장)

모든 페이지에 챗봇을 추가하는 가장 쉬운 방법은 메인 레이아웃 템플릿을 편집하는 것입니다:

FTP, SSH 또는 코드 편집기를 통해 Craft CMS 프로젝트 파일에 접속하세요
templates/ 디렉토리로 이동하세요
메인 레이아웃 파일을 찾으세요 (일반적으로 _layout.twig, _layout.html이거나 templates/_layouts/에 위치합니다)
닫는 </body> 태그를 찾으세요
</body> 태그 바로 앞에 Asyntai 삽입 코드를 붙여넣으세요
파일을 저장하세요

팁: 닫는 </body> 태그 앞에 스크립트를 추가하면 페이지 콘텐츠 이후에 로드되며, 이는 채팅 위젯에 권장되고 페이지 로딩 속도를 저하시키지 않습니다.

Alternative: Using Twig {% js %} Tag (Craft CMS 3.x+)

Craft CMS는 JavaScript를 등록하기 위한 내장 Twig 태그를 제공합니다:

메인 레이아웃 템플릿을 여세요
닫는 </body> 태그 앞에 다음 코드를 추가하세요:
{% js %} (function() { var script = document.createElement('script'); script.async = true; script.src = 'https://asyntai.com/static/js/chat-widget.js'; script.setAttribute('data-asyntai-id', 'YOUR_WIDGET_ID'); document.body.appendChild(script); })(); {% endjs %}
YOUR_WIDGET_ID를 실제 위젯 ID로 교체하세요
파일을 저장하세요

참고: The {% js %} tag automatically handles script registration and prevents duplicate loading if the same code appears multiple times.

대안: 별도의 포함 파일 생성

더 나은 구성을 위해 전용 포함 파일을 생성하세요:

새 파일을 생성하세요: templates/_includes/chatbot.twig (또는 .html)
이 파일에 Asyntai 삽입 코드를 추가하세요:
<script async src="https://asyntai.com/static/js/chat-widget.js" data-asyntai-id="YOUR_WIDGET_ID"></script>
메인 레이아웃 템플릿의 </body> 앞에 이 파일을 포함하세요:
{% include '_includes/chatbot' %}
두 파일을 모두 저장하세요

팁: 포함 파일을 사용하면 한 줄만 주석 처리하여 전체 사이트에서 챗봇을 쉽게 활성화/비활성화할 수 있습니다.

대안: 조건부 로딩

특정 페이지나 섹션에서만 챗봇을 로드하려면:

레이아웃이나 페이지 템플릿에서 Twig 조건문을 사용하세요:
{% if entry.showChatbot ?? true %} <script async src="https://asyntai.com/static/js/chat-widget.js" data-asyntai-id="YOUR_WIDGET_ID"></script> {% endif %}
또는 특정 섹션을 확인하세요:
{% if craft.app.request.segments[0] != 'admin' %} <script async src="https://asyntai.com/static/js/chat-widget.js" data-asyntai-id="YOUR_WIDGET_ID"></script> {% endif %}

3단계: 설치 확인

변경 사항을 저장한 후, 새 브라우저 탭이나 시크릿 창에서 Craft CMS 웹사이트를 방문하세요. 오른쪽 하단에 채팅 위젯 버튼이 표시되어야 합니다. 클릭하여 올바르게 열리고 작동하는지 확인하세요.

위젯이 보이지 않나요? 템플릿 파일을 저장했는지, 페이지에서 사용하는 올바른 레이아웃 템플릿을 편집하고 있는지 확인하세요. 브라우저 캐시를 지우거나 시크릿 창에서 확인하세요. 템플릿 캐싱을 사용하는 경우, 제어판의 Utilities > Clear Caches에서 Craft CMS 캐시를 지우세요.

템플릿 위치: Craft CMS 템플릿 위치는 프로젝트 설정에 따라 다를 수 있습니다. 일반적인 위치는 templates/_layout.twig, templates/_layouts/main.twig 또는 templates/_base.twig입니다. 기존 템플릿에서 </body> 태그가 정의된 위치를 확인하세요.