Backdrop CMS에 Asyntai AI 챗봇을 추가하는 방법
Backdrop CMS 웹사이트를 위한 단계별 가이드
1단계: 임베드 코드 가져오기
먼저 Asyntai 대시보드로 이동하여 "임베드 코드" 섹션까지 아래로 스크롤하십시오. 다음과 같은 형태의 고유 임베드 코드를 복사하십시오:
<script async src="https://asyntai.com/static/js/chat-widget.js" data-asyntai-id="YOUR_WIDGET_ID"></script>
참고: 위의 코드는 예시일 뿐입니다. 개인 위젯 ID가 포함된 고유한 임베드 코드를 대시보드에서 복사해야 합니다.
2단계: 테마 템플릿에 추가 (권장)
Backdrop CMS는 테마에서 .tpl.php 템플릿 파일을 사용합니다. 권장 방법은 활성 테마의 페이지 템플릿에 직접 임베드 코드를 추가하는 것입니다:
- FTP 또는 파일 관리자를 통해 Backdrop CMS 설치에 접근하세요
- 활성 테마의 디렉토리로 이동하세요: themes/yourtheme/
- page.tpl.php 파일을 여세요 (테마에 따라 layout.tpl.php일 수 있음)
- 닫는 </body> 태그 또는 <?php print $page_bottom; ?> 줄을 찾으세요
- 해당 줄 바로 앞에 Asyntai 임베드 코드를 붙여넣으세요
- 파일을 저장하세요
<!-- Asyntai AI Chatbot -->
<script async src="https://asyntai.com/static/js/chat-widget.js" data-asyntai-id="YOUR_WIDGET_ID"></script>
<?php print $page_bottom; ?>
</body>
팁: <?php print $page_bottom; ?> 또는 닫는 </body> 태그 바로 앞에 코드를 배치하면 페이지 콘텐츠 이후에 챗봇이 로드되어 더 나은 페이지 로드 성능을 제공합니다. 이 방법은 이 테마를 사용하는 모든 페이지에 자동으로 챗봇을 추가합니다.
대체 방법 1: 사용자 정의 모듈 사용
backdrop_add_js()를 사용하여 챗봇 스크립트를 주입하는 간단한 Backdrop CMS 모듈을 만들 수 있습니다:
- 모듈 디렉토리를 만드세요: modules/custom/asyntai_widget/
- 다음 코드로 모듈 파일 asyntai_widget.module을 만드세요:
// modules/custom/asyntai_widget/asyntai_widget.module
function asyntai_widget_init() {
backdrop_add_js('https://asyntai.com/static/js/chat-widget.js', array(
'type' => 'external',
'scope' => 'footer',
'attributes' => array('async' => 'async', 'data-asyntai-id' => 'YOUR_WIDGET_ID'),
));
} - asyntai_widget.info 파일을 만드세요:
name = Asyntai AI Chatbot Widget
description = Adds the Asyntai AI chatbot widget to all pages.
backdrop = 1.x
package = Custom
type = module - Backdrop 관리 패널에서 기능(admin/modules)으로 이동하세요
- Custom 패키지에서 "Asyntai AI Chatbot Widget"을 찾아 활성화하세요
- "설정 저장"을 클릭하세요
참고: 모듈 코드의 YOUR_WIDGET_ID를 Asyntai 대시보드에서 가져온 실제 위젯 ID로 교체하세요. 사용자 정의 모듈 접근 방식은 업그레이드에 안전하며 테마를 업데이트할 때 덮어쓰이지 않습니다.
대체 방법 2: Backdrop의 "Add to Head" 모듈 사용
제공된 "Add to Head" 모듈은 코드를 편집하지 않고 스크립트를 주입하는 쉬운 방법을 제공합니다:
- Backdrop CMS 웹사이트에서 "Add to Head" 기여 모듈을 다운로드하고 설치하세요
- 구성 > 개발 > Add to Head로 이동하세요
- 푸터 섹션에 Asyntai 임베드 코드를 추가하세요
- "설정 저장"을 클릭하세요
팁: "Add to Head" 모듈을 사용하는 것은 테마 파일을 편집하거나 사용자 정의 모듈을 만들지 않으려는 경우 가장 쉬운 방법입니다. 주입된 스크립트를 관리하기 위한 간단한 관리자 인터페이스를 제공합니다.
대체 방법 3: 블록 시스템 사용
Backdrop CMS의 레이아웃 및 블록 시스템을 사용하여 챗봇을 추가할 수도 있습니다:
- Backdrop CMS 관리 패널에 로그인하세요
- 구조 > 레이아웃으로 이동하세요
- 편집할 레이아웃을 선택하세요 (예: 기본 레이아웃)
- 푸터 영역에서 "블록 추가"를 클릭하세요
- "사용자 정의 블록"을 선택하세요
- 블록 형식을 "Full HTML" 또는 "Raw HTML"로 설정하세요
- 블록 본문에 Asyntai 임베드 코드를 붙여넣으세요
- 블록에 제목을 지정하고 (예: "Asyntai Chatbot") 선택적으로 "제목 숨기기"를 체크하세요
- "블록 저장"을 클릭한 다음 "레이아웃 저장"을 클릭하세요
중요: 스크립트 태그가 제거되지 않도록 텍스트 형식을 "Full HTML" 또는 "Raw HTML"로 설정하세요. 기본 "Filtered HTML" 형식은 보안상의 이유로 스크립트 태그를 제거합니다.
3단계: 캐시 지우기 및 확인
변경 사항을 적용한 후 Backdrop CMS의 캐시를 지우고 설치를 확인하세요:
- 관리자 패널에서 구성 > 성능으로 이동하세요
- \"모든 캐시 지우기\"를 클릭하세요
- 새 브라우저 탭이나 시크릿 창에서 웹사이트를 여세요
- 오른쪽 하단에 채팅 위젯 버튼이 표시되어야 합니다
- 클릭하여 올바르게 열리고 작동하는지 확인하세요
위젯이 보이지 않나요? 구성 > 성능에서 Backdrop CMS의 캐시를 지웠는지 확인하세요. 시크릿 창에서 사이트를 보거나 브라우저 캐시를 지워보세요. 브라우저 콘솔(F12)을 열어 JavaScript 오류가 있는지 확인하세요. 커스텀 모듈 방법을 사용한 경우, 기능에서 모듈이 활성화되어 있는지 확인하세요.
Weebly