Google Sites에 Asyntai AI 챗봇을 추가하는 방법
Google Sites를 위한 단계별 가이드
1단계: 임베드 코드 가져오기
먼저 Asyntai 대시보드로 이동하여 "Embed Code" 섹션까지 아래로 스크롤하세요. 다음과 같은 고유한 임베드 코드를 복사하세요:
<script>(function(){var l=function(){var s=document.createElement("script");s.src="https://widget.asyntai.com/static/js/chat-widget.js";s.async=true;s.setAttribute("data-asyntai-id","YOUR_WIDGET_ID");document.head.appendChild(s)};if(document.readyState==="complete"){l()}else{window.addEventListener("load",l)}})();</script>
참고: 위의 코드는 예시일 뿐입니다. 개인 위젯 ID가 포함된 고유한 임베드 코드를 대시보드에서 복사해야 합니다.
2단계: 임베드 기능을 사용하여 코드 추가
Google Sites는 사용자 정의 HTML 및 JavaScript 코드를 추가하기 위해 임베드 기능을 사용합니다:
- 컴퓨터에서 Google Sites로 사이트를 여세요
- 챗봇을 추가할 페이지로 이동하세요
- 오른쪽 패널에서 "Insert"를 클릭하세요
- 옵션에서 "Embed"를 선택하세요
- 상단의 "Embed code" 탭을 클릭하세요
- 텍스트 상자에 Asyntai 임베드 코드를 붙여넣으세요
- "Next"를 클릭하여 어떻게 보일지 미리 확인하세요
- "Insert"를 클릭하여 페이지에 코드를 추가하세요
- 오른쪽 상단의 "Publish"를 클릭하여 변경 사항을 적용하세요
팁: Google Sites는 임베드를 iframe으로 감싸므로 챗봇은 브라우저 모서리에 고정되지 않고 임베드 영역 내부에 나타납니다. 최상의 경험을 위해 임베드 요소를 페이지 콘텐츠 맨 하단에 배치하여 챗봇 버튼을 쉽게 찾을 수 있게 하세요.
여러 페이지에 추가
Google Site의 여러 페이지에 챗봇을 추가하려면:
- 챗봇을 원하는 각 페이지에 대해 임베드 과정을 반복하세요
- 페이지가 많은 사이트의 경우 먼저 주요 랜딩 페이지에 추가하는 것을 고려하세요
참고: Google Sites에는 사이트 전체에 적용되는 코드를 넣을 단일 위치가 없습니다. 챗봇을 표시하려는 각 페이지에 임베드 코드를 추가하세요.
Google Sites가 임베드된 코드를 처리하는 방법
Google Sites가 코드를 처리하는 방법 이해하기:
- Google Sites는 코드를 <iframe> 요소 안에 표시합니다
- JavaScript는 <script> 태그 내에 있어야 합니다 (Asyntai 코드에 이미 포함되어 있음)
- 외부 JavaScript 파일(예: Asyntai 위젯)을 참조할 수 있습니다
중요: Google Sites는 코드를 iframe 안에 표시하므로 일부 기능이 다른 웹사이트와 다르게 작동할 수 있습니다. Asyntai 챗봇은 이 iframe 안에서 작동하도록 설계되었습니다.
3단계: 설치 확인
변경 사항을 게시한 후 새 브라우저 탭이나 시크릿 창에서 Google Sites 사이트를 방문하세요. 페이지의 임베드 영역 안에 채팅 위젯 버튼이 표시되어야 합니다. 버튼을 클릭하여 제대로 열리고 작동하는지 확인하세요.
위젯이 보이지 않나요? 사이트를 게시했는지 확인하세요 (저장만 한 것이 아닌지). 캐싱을 우회하기 위해 시크릿 창에서 확인해 보세요. 브라우저 콘솔(F12)에서 오류를 확인하세요. 페이지를 편집하고 임베드 요소를 확인하여 임베드가 올바르게 삽입되었는지 확인하세요.
Weebly