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

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

임베드 코드 받기

플랫폼:

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

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

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

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

2단계: 마스터 페이지 템플릿에 코드 추가 (권장)

Kentico 웹사이트의 모든 페이지에 챗봇을 한 번에 추가하려면 마스터 페이지 템플릿 방법을 사용하세요:

Kentico Admin에 로그인하고 Page templates 애플리케이션으로 이동하세요
마스터 페이지 템플릿(모든 페이지에서 사용되는 템플릿)을 찾아 여세요
템플릿 편집기에서 Header 탭을 클릭하세요
헤더 섹션에 Asyntai 임베드 코드를 붙여넣으세요
또는 닫는 </head> 태그 앞에 템플릿 레이아웃에 코드를 추가하세요
Save를 클릭하여 변경 사항을 적용하세요
사이트의 캐시를 지우고 라이브 사이트에서 변경 사항을 확인하세요

팁: 마스터 페이지 템플릿을 사용하면 이 템플릿을 상속하는 모든 페이지에 챗봇이 표시됩니다. 이것은 Kentico에서 사이트 전체 배포를 위한 가장 효율적인 방법입니다.

대체 방법 1: 페이지 템플릿 헤더

특정 페이지 템플릿에만 챗봇을 추가하려면:

Kentico Admin의 Page templates 애플리케이션으로 이동하세요
편집하려는 특정 페이지 템플릿을 선택하세요
Header 탭을 클릭하세요
스크립트 태그를 사용하여 Asyntai 임베드 코드를 추가하세요:

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

Save를 클릭하세요
이 템플릿을 사용하는 모든 페이지에 이제 챗봇이 포함됩니다

참고: 이 방법은 전체 사이트가 아닌 동일한 페이지 템플릿을 공유하는 사이트의 특정 섹션에 챗봇을 추가하려는 경우 유용합니다.

대체 방법 2: HEAD HTML 웹 파트

특정 페이지에 대한 더 세밀한 제어 또는 하위 페이지에 상속 가능한 JavaScript의 경우:

Kentico Page 편집기에서 편집하려는 페이지를 여세요
페이지에 새 웹 파트를 추가하세요 (상속을 위해 상위 페이지에 추가하는 것이 좋음)
HEAD HTML 웹 파트를 검색하여 선택하세요
웹 파트 설정에 Asyntai 임베드 코드를 붙여넣으세요
하위 페이지에도 챗봇을 적용하려면 웹 파트를 상속 가능하도록 설정하세요
OK를 클릭하여 웹 파트를 저장하세요
페이지를 저장하고 게시하세요

팁: HEAD HTML 웹 파트는 상위 페이지에 코드를 추가하여 모든 하위 페이지에 자동으로 전파하는 섹션 전체 설치를 만드는 데 적합합니다.

대체 방법 3: 사용자 정의 JavaScript 파일 (고급)

스크립트를 파일로 관리하는 것을 선호하는 개발자의 경우:

Kentico 프로젝트에서 ~/CMSScripts/Custom/ 디렉토리로 이동하세요
새 JavaScript 파일을 만드세요 (예: asyntai-widget.js)
Asyntai 위젯을 동적으로 로드하는 코드를 추가하세요:

(function() {
    var script = document.createElement('script');
    script.src = 'https://asyntai.com/static/js/chat-widget.js';
    script.setAttribute('data-asyntai-id', 'YOUR_WIDGET_ID');
    script.async = true;
    document.head.appendChild(script);
})();

마스터 페이지 템플릿의 헤더에서 이 파일을 참조하세요:

<script src="~/CMSScripts/Custom/asyntai-widget.js"></script>

중요: 이 고급 방법은 파일 시스템 접근 권한과 Kentico의 디렉토리 구조에 대한 지식이 필요합니다. 적절한 권한이 있는지 확인하고 항상 스테이징 환경에서 먼저 테스트하십시오.

3단계: 설치 확인

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

위젯이 보이지 않나요? 모든 변경 사항을 저장하고 Kentico 캐시를 지웠는지 확인하세요 (Settings > System > Clear cache). 시크릿 창에서 사이트를 확인해 보세요. 브라우저 콘솔(F12)에서 위젯 로딩을 방해할 수 있는 JavaScript 오류가 있는지 확인하세요.