---
sourceDocument: 호주 고객 서비스 관리
sourceDocumentLink: https://servicenow-prod.fluidtopics.net/r/ko-KR/customer-service-management

 Release :

    - australia

ft:locale :

    - ko-KR

ft:publication_title :

    - 호주 고객 서비스 관리

ft:clusterId :

    - csm

bundleId :

    - csm

workflow :

    - Customer and Industry


---

# UI 빌더에서 지침 상세 정보 경험 사용자 지정

# UI 빌더에서 지침 상세 정보 경험 사용자 지정 {#ariaid-title1}

* 릴리스 버전: Australia
* 
* 업데이트 날짜 2026년 03월 12일
* 
* ![](https://www.servicenow.com/docs/portal-asset/ico-clock) 소요 시간: 4분

UI 빌더를 사용하여권장 작업 카드의 상황별 측면 패널이나 하위 탭에서 상세 정보 경험의 모습을 사용자 지정합니다. 상세 정보 경험에는 사용자 입력 및 드릴다운 작업과 같은 요소가 포함될 수 있습니다.

## 시작하기 전에

필요한 역할: sn_nb_action.next_best_action_author 및 ui_builder_admin, admin

## 이 태스크 정보

먼저 상세 정보 환경의 UI 페이지 변형을 만들어서 시작합니다. 페이지 템플릿에서 UI 페이지 변형을 만들 때는 사용자 지정할 수 있는 기본 구조부터 시작합니다. 구성요소를 구성하고 구성요소 속성을 사용하여 상황별 측면 패널이나 하위 탭에서 상세 정보 경험의 모습을 변경할 수 있습니다.

## 프로시저

1. 다음으로 이동 모두권장 작업작업 유형안내.
2. 지침 목록에서 지침을 선택합니다.
3. 상세 정보 UI 생성을 선택하여 상세 정보 UI의 UI 페이지 변형을 만듭니다.  
   이 페이지에는 다음 테이블에 나열된 속성이 있는 빈 컨테이너가 포함되어 있습니다.{#customize-ra-detail-experience__table_eq3_zhc_xvb__entry__2}

   | 속성 | 설명 |
   |-|-|
   | guidanceInputs | 지침을 수행하는 데 필요한 입력입니다. |
   | guidanceOutputs | 지침의 출력입니다. |
   | 상태 | 지침의 상태입니다. |
   | guidanceMessage | 상세 정보 경험에 대한 메시지입니다. |
   | guidanceActions | 상세 정보 뷰의 지침 작업입니다. |
   | errorMessages | 권장 사항이 표시되지 않을 때 표시되는 오류 메시지입니다. |
   [표 1. 상세 정보 경험 속성]

   {#customize-ra-detail-experience__table_eq3_zhc_xvb}

   다음 예에서는 세부 정보 경험에 대한 속성 및 샘플 값을 보여줍니다.

       {
           "guidanceInputs": {},
           "guidanceOutputs": {
               "meta": []
           },
           "status": "waiting",
           "guidanceMessage": "",
           "guidanceActions": [
               {
                   "label": "Attach",
                   "action_sys_id": "1e8392aa436f0210f81d92621ab8f291",
                   "variant": "primary",
                   "isExecuted": false,
                   "completionMessage": "Knowledge article successfully attached.",
                   "action_behaviour": "contextual_side_panel",
                   "primary": true
               }
           ],
           "errorMessage": "",
           "actionConfigurations": {},
           "guidanceId": "",
           "tableName": "sn_customerservice_case",
           "bare": true,
           "scrollable": "none"
       }

4. UI 빌더에서 상세 정보 편집을 선택합니다.  
   UI 페이지 변형이 열리 UI 빌더며 여기에서 구성요소를 추가하고 구성하여 상세 정보 환경의 모양과 느낌을 사용자 지정할 수 있습니다. 자세한 내용은 [UI 빌더에서 구성요소 작업을 참조하세요.](https://www.servicenow.com/docs/access?context=work-components&version=australia&pubname=australia-application-development&ft:locale=en-US)
5. 미리 보기 경험 속성을 사용자 지정 상세 정보 UI에 바인딩합니다.  
   데이터 바인딩은 에 있는 UI 빌더구성 패널의 구성 탭에 있습니다. 자세한 내용은 [UI 빌더의 데이터 자원을](https://www.servicenow.com/docs/access?context=data-resources&version=australia&pubname=australia-application-development&ft:locale=en-US) 참조하십시오.
6. 이벤트 핸들러를 사용하여 이벤트를 디스패치함으로써 해당 페이로드로 권장 사항을 실행하거나, 건너뛰거나, 완료했다고 표시하기 위해 사용자 지정 상세 정보 UI의 구성요소에 스크립트를 추가하고 바인딩합니다.  
   {#customize-ra-detail-experience__table_grp_flc_xvb__entry__2}

   | 처리된 이벤트 | 설명 |
   |-|-|
   | GUIDANCE_ACTION_CLICKED | 선택된 작업입니다. 이 이벤트는 선택한 작업을 페이로드에 전달합니다. api.emit( 'GUIDANCE_ACTION_CLICKED',{ model: { fields: [{'name': 'input', 'value':  '100'}] }, action: api.context.props.guidanceActions.find(action => action.label == "guidance action label"); } ); 주: 응답의 `guidanceActions[n]` 속성에 적용하려는 작업의 인덱스 번호를 제공합니다. |
   | SKIP_GUIDANCE | 지침을 건너뜁니다. api.emit( 'SKIP_GUIDANCE' ); |
   | GUIDANCE_MESSAGE_PUBLISHED | 데이터를 업스트림 애플리케이션에 전달합니다. api.emit( 'SN_GUIDANCE_EXPERIENCE_CONNECTED#GUIDANCE_MESSAGE_PUBLISHED', { name:'decision-tree-payload' jsonPayload: jsonObject } ); |
   | GUIDANCE_MARK_COMPLETE | 사용자 지정 지침을 완료됨으로 표시합니다. api.emit( 'GUIDANCE_MARK_COMPLETE' ); |
   | GO_BACK_GUIDANCE | 결정 트리의 이전 노드로 돌아갑니다. api.emit( 'GO_BACK_GUIDANCE' ); |
   | ACTION_TRIGGERED_PROPAGATION | 지침 작업에 대한 UI별 동작을 추가할 수 있습니다. 이 이벤트는 페이로드 상세 정보를 이 이벤트를 처리할 수 있는 상위 항목으로 전파합니다. api.emit( 'SN_NEXT_BEST_ACTION_LIST_CONNECTED #ACTION_TRIGGERED', { "actionSysId":api.context.props.guidanceId, "actionName": api.context.props.actionConfigurations[api.context.props.guidanceId]["actionName"] "actionType": "guidance", "eventName": "<eventName>", "payload": {} |
   [표 2. 상세 정보 경험 이벤트]

   {#customize-ra-detail-experience__table_grp_flc_xvb}

   자세한 내용은 [구성요소에 클라이언트 스크립트 정의 및 바인딩](https://www.servicenow.com/docs/access?context=define-client-scripts&version=australia&pubname=australia-application-development&ft:locale=en-US)을 참조하세요.
{#customize-ra-detail-experience__steps_b33_gzj_wvb}