정적 선택 또는 동적 선택 통제에 헤더 카드 삽입

  • 릴리스 버전: Zurich
  • 업데이트 날짜 2025년 07월 31일
  • 소요 시간: 2분
  • 주제를 만들 가상 에이전트 때 정적 선택 및 동적 선택 사용자 입력 컨트롤에 이미지와 YouTube 비디오를 포함할 수 있습니다.

    시작하기 전에

    필요한 역할: virtual_agent_admin 또는 admin

    프로시저

    1. 다음으로 이동 모두 > 대화형 인터페이스 > 가상 에이전트 > 디자이너 을 클릭하고 주제를 열거나 새 주제를 생성합니다.
    2. 플로우 탭에서 정적 선택 또는 동적 선택 사용자 입력 컨트롤을 캔버스로 끌어옵니다.
    3. 속성 시트에서 고급(선택 사항)으로 이동한 다음 헤더 카드 섹션을 확장합니다.
    4. 삽입 토글 스위치를 밀어 활성화합니다.
      그림 1. 헤더 카드 삽입
      동적 선택 사용자 입력 컨트롤의 헤더 카드 섹션으로, 삽입 토글 및 도움을 받으시겠습니까 라디오 버튼이 활성화된 상태입니다.
    5. 아래에서 Would you like help? 또는 아니요를 선택합니다. 스크립트를 사용합니다.
      • 예를 선택한 경우 카드 추가를 선택하고 다음 양식 필드를 작성합니다.
        표 1. 카드 추가 대화 상자
        필드 설명
        카드 유형 헤더 카드의 유형:
        • 텍스트가 있는 큰 이미지
        • 텍스트가 있는 작은 이미지
        • Youtube 비디오 카드

        대화 상자의 필드는 사용자의 선택에 따라 변경됩니다.

        직위 이미지 또는 비디오 제목입니다. 텍스트 필드에 직접 입력하거나 데이터 정제 또는 스크립트를 사용하여 값을 제공할 수 있습니다.
        제목 링크 비디오 제목 하이퍼링크에 사용할 URL입니다. 텍스트 필드에 직접 입력하거나 데이터 정제 또는 스크립트를 사용하여 값을 제공할 수 있습니다. 이 필드가 비어 있으면 제목이 일반 텍스트로 표시됩니다.

        이 필드는 YouTube 비디오 카드 옵션에만 사용할 수 있습니다.

        설명 이미지 또는 비디오에 대한 간략한 설명입니다.
        이미지 URL 링크 이미지의 URL 링크입니다. 텍스트 필드에 직접 입력하거나 데이터 정제 또는 스크립트를 사용하여 값을 제공할 수 있습니다. 이미지 업로드를 선택하여 이미지를 업로드할 수도 있습니다.

        이 필드는 대형 및 소형 이미지 카드 옵션에만 사용할 수 있습니다.

        이미지 대체 텍스트 대체로, 이미지를 설명하는, 화면에서 읽을 수 있는 텍스트입니다. 접근성 프로그램에 사용됩니다.

        이 필드는 대형 및 소형 이미지 카드 옵션에만 사용할 수 있습니다.

        Youtube 비디오 ID YouTube URL 끝에 있는 영숫자 문자열입니다. 예를 들어 https://www.youtube.com/watch?v=AacDp2mUQ1I URL에서 YouTube 동영상 ID는 AacDp2mUQ1I입니다.

        이 필드는 YouTube 비디오 카드 옵션에만 사용할 수 있습니다.

      • 아니요, 스크립트를 사용합니다를 선택한 경우 스크립트 대화 상자의 예제에 따라 스크립트 추가를 선택하여 원하는 미디어를 표시하는 스크립트를 입력합니다.
        그림 2. 헤더 카드 스크립트 예
        function() {
            /*
                var cardName = "Large image with text";
                var cardData = {
                    title: 'Choose color',
                    description: 'choose the right color of the flowers in the image',
                    image: 'https://homepages.cae.wisc.edu/~ece533/images/tulips.png',
                    imageAlt: 'Choose color'
                }
                var template = "";
                if (vaSystem.isAMBClient(vaContext.deviceType))
                    template = vaSystem.fillTemplateFromData(cardName, JSON.stringify(cardData));
              return {
                  cardTemplate: template,
                  cardName: cardName,
                  cardData: JSON.stringify(cardData),
                  renderStyle: "card"
              };
            */
            }
    6. 저장을 선택합니다.