리치 미디어 권장 사항
리치 미디어 권장 사항 템플릿을 표시하려면 필요한 태그와 API 호출을 페이지에 추가합니다.
-
페이지 머리글에서:
- RTP 태그를 설치합니다.
- 권장 사항을 채우는 GET 호출을 추가합니다.
- 템플릿을 구성하는 SET 호출을 추가합니다.
-
페이지 본문에서:
- 템플릿을 표시할 위치에 템플릿 태그(div 클래스)를 배치합니다.
자세한 내용은 웹 리치 미디어에 대한 예측 콘텐츠 사용을 참조하세요.
템플릿 태그
div에 일치하는 템플릿을 삽입합니다. 허용되는 값: template1, template2, template3.예
권장 사항을 가로로 표시하려면 "template1"을 사용합니다.
<div class="RTP_RCMD2" data-rtp-template-id="template1"></div>
권장 사항을 세로로 표시하려면 "template2"를 사용하십시오.
<div class="RTP_RCMD2" data-rtp-template-id="template2"></div>
제목과 설명만 사용하여 권장 사항을 세로로 표시하려면 "template3"을 사용합니다.
<div class="RTP_RCMD2" data-rtp-template-id="template3"></div>
템플릿 정렬 예제를 참조하십시오.
권장 사항 채우기
이 메서드는 페이지의 모든 리치 미디어 <divs>을(를) 권장 사항으로 채웁니다.
사용
rtp('get', 'rcmd', 'richmedia');
템플릿 구성 변경
이 메서드는 기본 템플릿 구성을 변경합니다.
rtp(‘get’,‘rcmd’, ‘richmedia’)를 호출하기 전에 이 메서드를 호출합니다.
사용
rtp('set', 'rcmd', 'richmedia', 'template_id', conf_obj);
예
이 예제에서는 템플릿의 제목 텍스트를 변경합니다.
rtp("set", "rcmd", "richmedia","template1",
{
"rcmd.title.text": "RECOMMENDED CONTENT"
}
);
이 예제에서는 템플릿에 대한 범주 및 여러 구성 속성을 설정합니다.
rtp("set", "rcmd", "richmedia",
{
"template1":
{
"rcmd.title.text": "RECOMMENDED CONTENT",
"rcmd.general.font.family": "arial",
"category":
[
"webinar",
"blog posts",
"pricing_page_category",
"product_a_category"
]
}
}
);
"카테고리"를 사용하여 예측 콘텐츠 권장 사항에 표시되는 콘텐츠를 필터링합니다. 활성화된 모든 컨텐츠에 대해 예측 컨텐츠를 사용하려면 "카테고리"를 비워 둡니다.
리치 미디어 템플릿에서 특정 콘텐츠만 추천하려면 콘텐츠 설정 페이지에서 콘텐츠에 대한 범주를 추가합니다. 그런 다음 해당 범주를 권장 사항 템플릿 코드와 연결합니다. 예를 들어 웹 사이트의 제품 또는 솔루션 섹션별로 관련 콘텐츠를 분류합니다.
이 예제에서는 템플릿에 대한 여러 구성 속성을 설정합니다.
rtp("set", "rcmd", "richmedia",
{
"template1":
{
"rcmd.title.text": "RECOMMENDED CONTENT",
"rcmd.general.font.family": "arial"
}
}
);
구성 속성
구성 지원은 템플릿에 따라 달라질 수 있습니다.
기본 예
이 예는 하나의 템플릿에 세 개의 권장 사항을 표시합니다. 예를 HTML 페이지에 복사한 다음 RTP 태그를 태그로 바꿉니다.
<!DOCTYPE>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>RTP recommendation</title>
<!-- RTP tag -->
<script type='text/javascript'>
// This tag needs to be replaced with your account tag
(function(c,h,a,f,i,e){c[a]=c[a]||function(){(c[a].q=c[a].q||[]).push(arguments)};
c[a].a=i;c[a].e=e;var g=h.createElement("script");g.async=true;g.type="text/javascript";
g.src=f+'?aid='+i;var b=h.getElementsByTagName("script")[0];b.parentNode.insertBefore(g,b);
})(window,document,"rtp","//example.rtp.com/rtp-api/v1/rtp.js","account_id");
// Send page view (required by the recommendation)
rtp('send','view');
// Populate recommendation
rtp('get','rcmd', 'richmedia');
</script>
<!-- End of RTP tag -->
</head>
<body>
<div class="RTP_RCMD2" data-rtp-template-id="template1"></div>
</body>
</html>
고급 예
이 예는 하나의 템플릿에 세 개의 권장 사항을 표시합니다. 템플릿 제목은 "RECOMMENDED CONTENT"이고 버튼 텍스트는 "Read More"입니다. 예를 HTML 페이지에 복사한 다음 RTP 태그를 태그로 바꿉니다.
<!DOCTYPE>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>RTP recommendation</title>
<!-- RTP tag -->
<script type='text/javascript'>
// This tag needs to be replaced with your account tag
(function(c,h,a,f,i,e){c[a]=c[a]||function(){(c[a].q=c[a].q||[]).push(arguments)};
c[a].a=i;c[a].e=e;var g=h.createElement("script");g.async=true;g.type="text/javascript";
g.src=f+'?aid='+i;var b=h.getElementsByTagName("script")[0];b.parentNode.insertBefore(g,b);
})(window,document,"rtp","//example.rtp.com/rtp-api/v1/rtp.js","account_id");
// Send page view (required by the recommendation)
rtp('send','view');
// Populate the recommendation zone
rtp('get', 'campaign',true);
// Change template configuration
rtp('set', 'rcmd', 'richmedia',
{
template1 :
{
"rcmd.title.text" : "RECOMMENDED CONTENT",
"rcmd.cta.text" : "Read More"
}
}
);
// Populate recommendation
rtp('get','rcmd', 'richmedia');
</script>
<!-- End of RTP tag -->
</head>
<body>
<div class="RTP_RCMD2" data-rtp-template-id="template1"></div>
</body>
</html>
리치 미디어 추천 템플릿 #1의 예
이름: template1
설명: 이미지, 제목, 설명 및 call-to-action 단추가 포함된 가로 콘텐츠
리치 미디어 추천 템플릿 #2의 예
이름: template2
설명: 이미지, 제목, 설명 및 call-to-action 단추가 포함된 세로 컨텐츠입니다.
리치 미디어 추천 템플릿 #3의 예
이름: template3
설명: 제목과 설명만 포함하는 세로 컨텐츠입니다. 마우스를 가져가면 헤더가 색상 및 콘텐츠 URL에 대한 링크를 변경합니다. 또한 설명은 색상을 변경하지 않고 콘텐츠에 연결됩니다.
