Adobe Commerce (Magento)에 Asyntai AI 챗봇을 추가하는 방법

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

임베드 코드 받기

플랫폼:

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

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

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

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

2단계: Page Builder 사용 (권장)

챗봇을 추가하는 가장 쉬운 방법은 Page Builder의 HTML Code 블록을 사용하는 것입니다:

Magento 관리자 패널에 로그인하세요
Content → Pages로 이동하세요
홈 페이지(또는 챗봇을 원하는 페이지)를 편집하세요
Page Builder에서 "HTML Code" 요소를 페이지에 드래그하세요
Asyntai 임베드 코드를 붙여넣으세요
"Save"를 클릭하세요
캐시를 플러시하세요: System → Cache Management → Flush Magento Cache

중요: Page Builder를 사용하면 개별 페이지에만 코드가 추가됩니다. 사이트 전체 설치의 경우 아래의 Layout XML 방법을 사용하세요.

대체 방법: Layout XML 사용 (모든 페이지)

모든 페이지에 챗봇을 추가하려면 테마에 레이아웃 파일을 만드세요:

테마 폴더로 이동하세요: app/design/frontend/[Vendor]/[theme]/
폴더 구조가 없으면 만드세요: Magento_Theme/layout/
default_head_blocks.xml 파일을 만들거나 편집하세요
다음 코드를 추가하세요:
<?xml version="1.0"?> <page xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" xsi:noNamespaceSchemaLocation="urn:magento:framework:View/Layout/etc/page_configuration.xsd"> <head> <script src="https://asyntai.com/static/js/chat-widget.js" src_type="url" async="true" data-asyntai-id="YOUR_WIDGET_ID"/> </head> </page>
YOUR_WIDGET_ID를 실제 위젯 ID로 교체하세요
실행: bin/magento cache:flush
실행: bin/magento setup:static-content:deploy -f (프로덕션 모드인 경우)

대체 방법: CMS 블록 사용

CMS 블록을 만들어 푸터에 포함할 수도 있습니다:

Content → Blocks로 이동하세요
"Add New Block"을 클릭하세요
"Asyntai Chatbot"과 같은 제목을 설정하세요
식별자를 asyntai_chatbot으로 설정하세요
콘텐츠 편집기에서 HTML 모드로 전환하고 임베드 코드를 붙여넣으세요
"Save Block"을 클릭하세요
다음을 사용하여 블록을 푸터 템플릿에 추가하세요: {{block id="asyntai_chatbot"}}
캐시를 플러시하세요

3단계: 설치 확인

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