Prostir

실전 가이드

웹사이트에 AI 에이전트 위젯을 추가하는 방법

단계별 기사: 웹사이트에 AI 에이전트 위젯을 추가하는 방법. Prostir 에이전트를 생성 및 게시하고, 채널을 열고, 웹 위젯을 선택하고, 사이트에 허용되는 정확한 HTTPS 허용 원본을 추가하고, 채팅 위젯의 스타일을 지정하고, 저장을 누르고, 포함 스크립트를 복사하여 웹 사이트에 붙여넣고, 라이브 페이지에서 웹 사이트 챗봇을 테스트합니다.

01

시작하기 전에 필요한 것

  • 명시적인 채널 런타임 모델, 에이전트 수준에서 켠 Channels 스위치, hosted model용 양수 Model Usage Credits 또는 저장된 BYOK 키를 갖춘 게시된 Prostir 에이전트입니다.
  • 위젯이 실행될 정확한 공개 사이트 원본(예: https://example.com.) HTTPS를 사용하고 올바른 하위 도메인을 포함하고/pricing과 같은 경로를 붙여넣지 마십시오.
  • </body> 앞이나 사이트 전체 사용자 정의 코드 필드에 작은 스크립트를 붙여넣을 수 있는 웹사이트 빌더, CMS, 태그 관리자 또는 HTML 템플릿에 액세스합니다.
02

AI 에이전트 위젯을 추가하는 방법

패턴은 간단합니다. 에이전트를 게시하고 웹 위젯 채널을 생성하고 저장하고 스크립트를 복사하여 사이트에 붙여넣은 다음 허용된 원본에서 테스트합니다.

  1. 01
    Prostir에 AI 에이전트를 생성합니다.

    웹사이트 에이전트가 수행해야 할 작업을 작성하고 사용할 수 있는 페이지, FAQ, 문서, 가격 정보, 지원 규칙 및 도구를 추가합니다. 방문자에게 공개하기 전에 모델을 선택하세요.

  2. 02
    에이전트를 게시합니다.

    웹사이트 위젯은 게시된 에이전트 런타임을 사용합니다. 에이전트가 여전히 초안 전용인 경우 포함 스크립트는 신뢰할 수 있는 공개 웹사이트 챗봇을 제공할 수 없습니다.

  3. 03
    Channels를 열고 웹 위젯을 선택하세요.

    에이전트 수준의 Channels 스위치를 켜고 웹 위젯을 선택합니다. 타사 토큰은 필요하지 않지만 런타임 검사를 통과할 때까지 채널은 비활성화 상태로 유지됩니다.

  4. 04
    허용되는 출처를 추가합니다.

    https://example.com 및 https://www.example.com.와 같이 위젯이 실행될 수 있는 각각의 정확한 HTTPS 원본을 추가합니다. Prostir는 목록에 없는 외부 원본을 차단하므로 다른 사이트에서 위젯 스크립트를 재사용할 수 없습니다.

  5. 05
    채팅 위젯을 디자인합니다.

    위치, 너비, 높이, 색상, 인사말 텍스트, 소개 텍스트, 입력 자리 표시자, 실행기 레이블 및 빠른 작업을 설정합니다. 가격, 예약, 지원, 주문 상태, 제품 적합성 등 방문자가 실제로 묻는 질문에 가깝게 첫 번째 제안 조치를 유지하세요.

  6. 06
    저장을 누르세요.

    저장은 설정을 보관하고 게시, 명시적 런타임 모델, 에이전트 Channels 스위치, allowed origins, 구성, hosted credits 또는 BYOK 검사를 모두 통과한 경우에만 웹 위젯을 활성화합니다. 그렇지 않으면 눈에 보이는 오류와 함께 비활성화 상태로 유지됩니다.

  7. 07
    삽입 스크립트를 복사합니다.

    반환된 widgetEmbedUrl을 복사합니다. 게시된 slug와 정확한 channel id를 항상 사용합니다: https://{slug}.ai.prostir.build/widget/embed.js?channelId={id}.

  8. 08
    웹사이트에 스크립트를 붙여넣으세요.

    직접 코딩한 사이트의 경우 </body> 앞에 붙여넣으세요. Webflow, WordPress, Shopify, Wix, Squarespace, Framer 또는 기타 빌더에서는 사이트 전체 사용자 정의 코드, 포함 코드 또는 사용자 정의 HTML 영역을 사용합니다.

  9. 09
    실제 사이트에서 테스트해 보세요.

    임의의 미리보기 URL이 아닌 실제 허용된 도메인을 엽니다. 실제 질문을 하고, 답변을 확인하고, 대화가 채널에 나타나는지 확인하세요.

03

저장 전 준비사항

좋은 웹사이트 AI 에이전트에는 런처 버블 이상의 것이 필요합니다.

docagent instructionsWhat the widget should answer, what it should refuse, and when it should ask for a human.
docwebsite knowledgePricing, services, FAQs, docs, policies, booking details, support rules, and source pages.
codeembed scriptProstir에서 복사한 한 줄 스크립트: <script src="https://{slug}.ai.prostir.build/widget/embed.js?channelId={id}" async></script>.
04

최종 Prostir 단계: 웹 위젯, 저장, 스크립트

채널, 웹 위젯, 허용된 출처, 저장.

Prostir Studio

내 지원 에이전트를 게시했고 이를 내 웹사이트에 AI 챗봇 위젯으로 표시하고 싶습니다.

Prostir에서 에이전트를 열고 채널로 이동하여 웹 위젯을 선택한 후 사이트에 대한 정확한 HTTPS 원본을 추가하세요.

위젯은 오른쪽 하단에 나타나며 가격, 예약 및 지원 질문으로 시작됩니다.

위치, 실행기 라벨, 인사말 텍스트, 빠른 동작 및 색상을 설정합니다. 저장을 누른 다음 포함 스크립트를 복사합니다.

Prostir

웹 위젯이 저장되었습니다. 모든 런타임 검사를 통과한 경우에만 채널이 활성화되며, 그렇지 않으면 눈에 보이는 오류와 함께 비활성화 상태로 유지됩니다.

Live

웹사이트 챗봇 연결됨 · 삽입 스크립트 복사됨 · 채널에 대화 표시됨

05

웹사이트에서 위젯 테스트

  • 허용 출처에 기재된 실제 도메인을 사용하세요. 다른 미리보기 원본에서 테스트하는 경우 위젯이 의도적으로 닫히지 않을 수 있습니다.
  • 가격, 가용성, 다음 단계, 핏, 지원, 환불, 구현 시간 등 리드가 묻는 것과 동일한 질문을 해보세요.
  • 답변이 약할 경우 Prostir에서 에이전트 지침이나 지식을 업데이트하고 다시 게시하면 웹사이트를 다시 구축하지 않고도 내장된 위젯이 향상된 에이전트를 선택합니다.

게시 내용

결국 사이트는 위젯 포함 스크립트를 통해 Prostir AI 에이전트를 로드합니다. 방문자가 채팅 위젯을 열고 질문을 하면 동일한 게시된 에이전트가 지침, 지식, 도구, 모델 및 채널 설정을 통해 답변합니다.

솔루션

방문자의 다음 행동을 돕는 웹사이트 AI 상담·판매 에이전트

웹에서 상황에 맞는 대화를 제공하고 무리하게 구매를 약속하지 않으면서 문의나 구매 같은 분명한 다음 행동을 안내할 수 있습니다.

솔루션

웹사이트가 답하지 못한 질문 찾기

실제 질문과 안내할 다음 행동을 알려 주세요.