Premium
See what's included in Target Premium.

디자인 만들기

디자인은 페이지에 권장 사항이 어떻게 나타나는지를 정의합니다.

기본 디자인을 사용하거나 사용자 지정 디자인을 만들어 권장 사항 디자인을 만들 수 있습니다. 다음 Recommendations > 디자인 화면에는 기본 디자인 카드와 계정에서 만든 모든 디자인이 표시됩니다.

디자인 작업 시 다음 정보를 염두에 두십시오.

  • 기본 디자인을 사용하여 권장 사항 디자인을 만들거나 사용자 지정 디자인을 만들 수 있습니다.
  • 기본 디자인은 편집하거나 삭제할 수 없습니다.
  • 사용자 지정 디자인을 편집, 복사 또는 삭제할 수 있습니다.
  • 기본 디자인을 기반으로 디자인을 생성하려면 먼저 디자인을 복사한 다음 복사본을 편집해야 합니다.

이 그림은 기본 1 x 4 디자인을 보여 줍니다.

1 x 4 기본 디자인

이 그림은 사용자 정의 디자인을 보여 줍니다.

사용자 정의 디자인

VEC(시각적 경험 작성기) 내에서 또는 활동 작성 외부의 디자인 라이브러리에서 활동 작성 프로세스 중에 디자인을 만들 수 있습니다. 다음 섹션에서는 라이브러리에서 디자인을 생성하는 것으로 가정하지만 단계는 유사합니다.

디자인 만들기

기본 디자인을 기반으로 디자인을 만들거나 사용자 지정 디자인을 만들 수 있습니다.

기본 디자인을 기반으로 디자인 만들기

  1. 클릭 Recommendations > 디자인 을(를) 표시하려면 디자인 라이브러리입니다.

    디자인 라이브러리

  2. 만들려는 디자인에 대한 카드 위로 마우스를 가져간 다음 복사 아이콘.

    Card_CopyDesign 이미지

    다음 디자인 만들기 대화 상자가 표시됩니다.

    createDesign 이미지

  3. 다음에서 정보 패널, 추가 컨텐츠 이름 및 디자인 카드에 표시할 선택적 미리 보기 이미지

    기본 디자인을 사용하면 디자인 이름과 "복사본"이 컨텐츠 이름 필드. 이름을 편집할 수 있습니다. 디자인 카드에 표시할 이미지를 선택할 수도 있습니다.

  4. (조건부) 디자인 편집 코드, 원하는 대로

    권장 디자인은 오픈 소스 Velocity 디자인 언어를 사용합니다. Velocity에 대한 정보는 다음 위치에서 찾을 수 있습니다. https://velocity.apache.orgVelocity를 사용하여 디자인 사용자 지정.

    디자인은 HTML 또는 비 HTML일 수 있습니다. 기본적으로 HTML 디자인은 웹 환경에서 클릭 추적을 수행할 수 있도록 <div> 태그로 래핑되어 있습니다. 비 HTML 디자인은 클릭 추적이 불가능한 웹이 아닌 환경을 위한 것입니다. 슬라이드 HTML 디자인 HTML이 아닌 코드를 사용하려면 "끄기" 위치로 전환합니다.

    note note
    NOTE
    하드 코딩되거나 루프를 통해 디자인에서 참조할 수 있는 최대 개체 수는 99개입니다.
  5. 저장 ​을 클릭합니다.

사용자 지정 디자인 만들기

  1. 클릭 Recommendations > 디자인 을(를) 표시하려면 디자인 라이브러리입니다.

  2. 클릭 디자인 만들기.

    새 사용자 지정 디자인을 기존 디자인에 적용하려면 원하는 디자인 위로 마우스를 가져간 다음 복사 아이콘. 그런 다음 사본을 편집하여 새 사용자 정의 디자인을 만들 수 있습니다.

  3. 추가 컨텐츠 이름 및 선택적 미리 보기 이미지

  4. (조건부) 디자인 편집 코드, 원하는 대로

    자세한 내용은 위의 4단계 정보를 참조하십시오.

  5. 저장 ​을 클릭합니다.

디자인 편집, 복사 또는 삭제

기본 디자인은 편집하거나 복사할 수 없으며 기본 디자인만 복사할 수 있습니다.

에서 원하는 디자인 위로 마우스 오버 디자인 라이브러리를 클릭한 다음 편집, 복사 또는 삭제 아이콘을 클릭합니다.

디자인의 마우스로 아이콘

기존 디자인을 복사하여 수정할 수 있는 중복 디자인을 생성할 수 있습니다. 이를 통해 적은 노력으로 유사한 디자인을 만들 수 있습니다.

디자인은 전체 계정에서 사용할 수 있습니다. 디자인을 삭제하기 전에 이를 고려하십시오. 삭제된 디자인을 복구할 수 없습니다.

JSON 예 section_75BFB2537CFF4FBD9B560F59EB32C8DD

다음 예제에서는 양식 기반 편집기를 통해 활동을 구성할 때 JSON 응답을 반환하는 방법을 보여 줍니다.

  1. 디자인 라이브러리 내에서 또는 양식 기반 워크플로 내에서 디자인을 만듭니다. 시각적 경험 작성기(VEC) 워크플로에서 이 작업을 수행하려고 하면 HTML 디자인 이외의 항목을 만들 수 없습니다. <div> 클릭 추적 목적으로.

  2. "HTML 디자인" 선택 사항이 꺼져 있는지 확인합니다.

    html_design_toggle 이미지

  3. 다음 코드는 디자인에 붙여넣을 수 있는 사항의 예입니다.

    code language-javascript
        #*
        * "Return a simple list of recommended entity ids"
        *#
    
        {
          "notes":{
          "purpose": "Return a simple list of recommended entity ids",
          "use-case": "Use this approach if you prefer to do a real-time lookup of entity attribute details (such as inventory, price, rating) from another system (such as a CMS, PIM or ecommerce platform)",
          "version": "01"
          },
          "recommendedItems": {
            "key": "$key.id",
            "slot-01": "$entity1.id",
            "slot-02": "$entity2.id",
            "slot-03": "$entity3.id",
            "slot-04": "$entity4.id",
            "slot-05": "$entity5.id",
            "slot-06": "$entity6.id",
            "slot-07": "$entity7.id",
            "slot-08": "$entity8.id",
            "slot-09": "$entity9.id",
            "slot-10": "$entity10.id"
          }
        }
    
  4. 양식 기반 설정 Recommendations 이 디자인을 사용하는 활동입니다.

    1. 다음 위치로 이동 활동 페이지를 가리키도록 업데이트하는 중입니다.
    2. 클릭 활동 만들기 > Recommendations.
    3. 아래 경험 작성기 선택, 선택 양식 ​을 클릭한 다음 을 클릭합니다 다음.
    4. 위치 아래에 "Sample_Recs_Response"라는 텍스트를 입력합니다.
    5. 기본 컨텐츠 아래에서 아래쪽 화살표를 클릭한 다음 권장 사항 추가 ​를 클릭합니다.
    6. 페이지 유형을 선택합니다. 이 유형은 그 다음 화면의 초기 필터링을 결정합니다.
    7. 기준 카드를 선택한 후, 다음을 클릭합니다.
    8. 이전 단계에서 만든 디자인을 선택한 다음, 다음.
    9. 설정 프로세스를 완료합니다.
    10. 비활성 옆의 오른쪽 화살표를 클릭한 다음, 활성화 ​를 선택합니다.
  5. 활동이 설정되고 활성화된 후 깨끗한 JSON 응답을 다시 가져오는 샘플 요청을 설정할 수 있습니다.

    활동을 저장할 때부터 Target 선택한 기준 구성을 지원하는 모델을 구축해야 합니다. 요소의 수에 따라 시간이 다소 걸릴 수 있습니다. 모델이 만들어지면 결과가 표시됩니다.

    예:

    code language-none
    https://[YOUR_CLIENT_CODE].tt.omtrdc.net/m2/YOUR_CLIENT_CODE/ubox/raw?mbox=[YOUR_MBOX_NAME]&mboxContentType=text/html&mboxXDomain=disabled&entity.id=[ENTITY_ID]&mboxHost=rawbox_sample&at_property=[AT_PROPERTY_TOKEN]&mboxNoRedirect=true&mboxPC=1234-4321&mboxSession=9876-7000
    

    where

    table 0-row-2 1-row-2 2-row-2 3-row-2 4-row-2
    매개 변수
    [YOUR_CLIENT_CODE] Target 클라이언트 코드(/docs/target/target/products.html에서 사용 가능#recsSettings > Recommendations API 토큰 > 클라이언트 코드.
    [YOUR_MBOX_NAME] 양식 기반 Recommendations의 "위치" 섹션에서 선택한 이름입니다. 이 경우 Sample_Recs_Response입니다.
    [ENTITY_ID 카탈로그에 있는 항목의 entity.id입니다.
    [AT_PROPERTY_TOKEN] (선택 사항) 활동 설정 중에 속성(엔터프라이즈 권한의 일부)을 선택한 경우 추가하십시오.

알고리즘이 실행되고 결과가 나오면, 응답은 다음과 같은 모습이어야 합니다.

json_recommendation 이미지

추가 JSON 개체 팁 및 요령 section_C305673C68944749969DB239E3221DC2

다음 구문으로 디자인을 설정하여 간단한 쉼표로 구분된 항목 목록만 다시 전송할 수도 있습니다.

entity1.id, $entity2.id, $entity3.id, $entity4.id, $entity5.id,

또는 응답에서 추가 정보를 전송할 수도 있습니다. 다음 코드 파일은 연결된 슬롯(순서)이 있는 엔티티 ID보다 훨씬 더 많은 내용을 반환하는 더 복잡한 예입니다. 이 디자인 예는 활동 세부 사항, Target 프로필 세부 사항(해당하는 경우) 및 기타 도 반환합니다 entity.attributes 반환된 항목과 연결됩니다.

    {
     "adobeRecommendations": {
      "notes": {
       "purpose": "Return a list of entity ids with their associated entity.attributes",
       "use-case": "Use this approach to avoid looking up attribute details after receiving a response from Target",
       "version": "01"
      },
      "recommendedItems": {
       "slot-01": "$entity1.id",
       "slot-02": "$entity2.id",
       "slot-03": "$entity3.id",
       "slot-04": "$entity4.id",
       "slot-05": "$entity5.id",
       "slot-06": "$entity6.id",
       "slot-07": "$entity7.id",
       "slot-08": "$entity8.id",
       "slot-09": "$entity9.id",
       "slot-10": "$entity10.id"
      },
      "activityDetails": {
       "mbox.name": "email-mbox",
       "campaign.name": "\${campaign.name}",
       "campaign.id": "\${campaign.id}",
       "campaign.recipe.name": "\${campaign.recipe.name}",
       "campaign.recipe.id": "\${campaign.recipe.id}",
       "offer.name": "\${offer.name}",
       "offer.id": "\${offer.id}",
       "criteria.title": "$criteria.title",
       "algorithm.name": "$algorithm.name",
       "algorithm.dayCount": "$algorithm.dayCount"
      },
      "visitorProfile": {
       "profile.favorite-category": "\${profile.favorite-category}",
       "profile.test": "\${profile.test}",
       "user.endpoint.lastPurchasedEntity": "\${user.endpoint.lastPurchasedEntity}",
       "user.endpoint.lastViewedEntity": "\${user.endpoint.lastViewedEntity}",
       "user.endpoint.mostViewedEntity": "\${user.endpoint.mostViewedEntity}",
       "user.endpoint.categoryAffinity": "\${user.endpoint.categoryAffinity}",
       "profile.geolocation.city": "\${profile.geolocation.city}",
       "profile.geolocation.dma": "\${profile.geolocation.dma}",
       "profile.geolocation.state": "\${profile.geolocation.state}",
       "profile.geolocation.country": "\${profile.geolocation.country}",
       "profile.sessionCount": "\${profile.sessionCount}",
       "profile.averageDaysBetweenVisits": "\${profile.averageDaysBetweenVisits}",
       "profile.browserTime": "\${profile.browserTime}",
       "user.activeActivities": "\${user.activeActivities}",
       "user.pcId": "\${user.pcId}",
       "user.isFirstSession": "\${user.isFirstSession}",
       "user.isNewSession": "\${user.isNewSession}",
       "user.header": "\${user.header}",
       "user.parameter": "\${user.parameter}"
      },
      "recKey": {
       "recKeyDetails": {
        "id": "$key.id",
        "name": "$key.name",
        "category": "$key.category",
        "pageUrl": "$key.pageUrl",
        "thumbnailUrl": "$key.thumbnailUrl"
       }
      },
      "recDetailedResults": {
       "recEntity1Details": {
        "id": "$entity1.id",
        "name": "$entity1.name",
        "category": "$entity1.category",
        "pageUrl": "$entity1.pageUrl",
        "thumbnailUrl": "$entity1.thumbnailUrl"
       },
       "recEntity2Details": {
        "id": "$entity2.id",
        "name": "$entity2.name",
        "category": "$entity2.category",
        "pageUrl": "$entity2.pageUrl",
        "thumbnailUrl": "$entity2.thumbnailUrl"
       },
       "recEntity3Details": {
        "id": "$entity3.id",
        "name": "$entity3.name",
        "category": "$entity3.category",
        "pageUrl": "$entity3.pageUrl",
        "thumbnailUrl": "$entity3.thumbnailUrl"
       },
       "recEntity4Details": {
        "id": "$entity4.id",
        "name": "$entity4.name",
        "category": "$entity4.category",
        "pageUrl": "$entity4.pageUrl",
        "thumbnailUrl": "$entity4.thumbnailUrl"
       },
       "recEntity5Details": {
        "id": "$entity5.id",
        "name": "$entity5.name",
        "category": "$entity5.category",
        "pageUrl": "$entity5.pageUrl",
        "thumbnailUrl": "$entity5.thumbnailUrl"
       },
       "recEntity6Details": {
        "id": "$entity6.id",
        "name": "$entity6.name",
        "category": "$entity6.category",
        "pageUrl": "$entity6.pageUrl",
        "thumbnailUrl": "$entity6.thumbnailUrl"
       },
       "recEntity7Details": {
        "id": "$entity7.id",
        "name": "$entity7.name",
        "category": "$entity7.category",
        "pageUrl": "$entity7.pageUrl",
        "thumbnailUrl": "$entity7.thumbnailUrl"
       },
       "recEntity8Details": {
        "id": "$entity8.id",
        "name": "$entity8.name",
        "category": "$entity8.category",
        "pageUrl": "$entity8.pageUrl",
        "thumbnailUrl": "$entity8.thumbnailUrl"
       },
       "recEntity9Details": {
        "id": "$entity9.id",
        "name": "$entity9.name",
        "category": "$entity9.category",
        "pageUrl": "$entity9.pageUrl",
        "thumbnailUrl": "$entity9.thumbnailUrl"
       },
       "recEntity10Details": {
        "id": "$entity10.id",
        "name": "$entity10.name",
        "category": "$entity10.category",
        "pageUrl": "$entity10.pageUrl",
        "thumbnailUrl": "$entity10.thumbnailUrl"
       }
      }
     }
    }

교육 비디오: Recommendations에서 사용자 지정 디자인 만들기(3:20) 개요 배지

이 비디오에는 다음 정보가 포함됩니다.

  • 사용자 지정 디자인 만들기
  • 디자인에서 디스플레이 변수를 참조하는 방법 이해하기
recommendation-more-help
3d9ad939-5908-4b30-aac1-a4ad253cd654