【ご注意】
本ページで解説している「ダイレクトコード実装」は、過去の仕様に基づいた実装方法です。新規でDLPOを導入される場合は、「DLPOタグ実装」を推奨しています。 現在ダイレクトコードをご利用中のお客様、または特殊な要件がある場合のみご覧ください。
ダイレクトコード実装とは
DLPOタグ実装では対応できない詳細な制御を行うために、「エリアタグ」「コンバージョンタグ」を個別に施策ページへ設置する手法です。
設定手順
1.DLPOタグの設置
DLPOを動作させるために、該当ページにDLPOタグを設置してください。詳細は「ページ設定とは - 設定手順 - 4.DLPOタグの設置」をご覧ください。
2.エリアタグの設置
エリアタグは、表示切り替えを行う領域(エリア)を指定するタグです。クリエイティブ配信箇所(表示切り替え箇所)のHTMLソースを囲むように設置します。以下の例を参照してください。
クリエイティブ配信箇所(表示切り替え箇所)は、DLPOのキャンペーン非稼働時、キャンペーンのセグメント設定によりセグメントに合致しない場合に表示されます。また、通信環境の遅延や、何らかの原因でDLPOサーバーから応答がない場合も表示されますので、必ずデフォルトのHTMLは記載してください。
※クリエイティブとしてCSSやJavaScriptなどを使用する場合は、デフォルトHTMLの記載が不要な場合があります。
例えば、通常は<head>で読み込まれるCSSファイルのスタイルが適用され、クリエイティブが配信された際にはエリアタグ部分に吐き出されたスタイルが適用される、という動作をさせる場合はデフォルトHTMLは空にし、エリアタグのみを設置することで対応いただけます。また、JavaScriptを使用したリダイレクトによるスプリットランテストを行う場合などは<body>開始直後にデフォルトHTMLは空にしてエリアタグのみを設置してください。
例)
【エリアタグ設置前のクリエイティブ配信箇所(表示切り替え箇所)】
<a href="/test.html"><img src="img/main_bnr.jp" alt="メインバナー"></a>↓
【エリアタグ設置後のクリエイティブ配信箇所(表示切り替え箇所)】
<div class='ADLPODefault'>
<a href="/test.html"><img src="img/main_bnr.jp" alt="メインバナー"></a>
</div>
<script type='text/javascript'>adlpoMain('main','lc=os','ch=Shift-JIS');</script>表示切り替え箇所(エリア)ごとに、adlpoMain()の引数の設定が必要になります。
| 引数:例 | 項目名 | 設定内容 |
| 第1引数:main | エリア名 |
エリアを識別するための名称を半角英数字で設定してください。(半角英数字に加え、記号の"_"(アンダーバー)が使用できます) ※大文字小文字は区別されません。(例えば"main"と"MAIN"は同じエリアと認識されます) ※すでに使用されているエリア名は使用できません |
| 第3引数:Shift-JIS | 文字コード | 対象ページで使用されている文字コード(UTF-8、Shift-JIS等)を設定してください。 文字コードが異なると、配信されたクリエイティブのテキストが文字化けすることがありますのでご注意ください。 |
※エリアタグ設置時はタグの設置により表示崩れが発生しないかどうか必ずご確認ください。既存の<div>タグをまたいだり、<table>の<tr>や<td>タグをまたいでエリアタグを設置すると表示が崩れますのでご注意ください。
※LPには必ず「DLPOタグ」を設置してから(もしくは同時に)エリアタグを設置してください。DLPOタグを設置せずにエリアタグを設置するとエラーとなりますのでご注意ください。
3.コンバージョンタグの設置
コンバージョンタグは、成果地点(コンバージョンページ)に設置する計測タグです。コンバージョンを計測したいページに、以下の形式で設置します。
計測タイミングより設置方法が異なります。クリック時に計測したい場合はクリック計測箇所に、それ以外はコンバージョン計測ページの</body>の直前に設置してください。
計測タイミングについての詳細は「コンバージョン計測のタイミング設定」をご覧ください。
例)計測タイミング「ページビュー」
【設置箇所:</body>直前に設置】
<script type='text/javascript'>adlpoMain('cv','pr=cv','img=beacon');</script>
</body>例)コンバージョンタグ設置:計測タイミング「クリック」
【設置箇所:クリック計測箇所に設置】
<a noadlpo href="form.html" onclick="adlpoMain('cv','pr=cv','img=beacon');">お申込み</a>例)コンバージョンタグ設置:計測タイミング「滞在時間」
【設置箇所:</body>直前に設置】
setTimeoutの第2引数「30000」は滞在時間をミリ秒で設定してください。「30000」ミリ秒は「30」秒となります。
<script type="text/javascript">
setTimeout(function(){ adlpoMain('cv','pr=cv','img=beacon') }, 30000);
</script>
</body>adlpoMain()を直接呼び出す際、コンバージョンポイントごとに引数の設定が必要になります。
| 引数:例 | 項目名 | 設定内容 |
| 第1引数:cv | コンバージョンポイント名 |
コンバージョンポイントを識別するための名称を半角英数字で設定してください。(半角英数字に加え、記号の"_"(アンダーバー)が使用できます) ※大文字小文字は区別されません。(例えば"cv"と"CV"は同じエリアと認識されます) ※すでに使用されているコンバージョンポイント名は使用できません |
※コンバージョンタグ設置ページには必ず「DLPOタグ」を設置してから(もしくは同時に)コンバージョンタグを設置してください。DLPOタグを設置せずにコンバージョンタグを設置するとエラーとなりますのでご注意ください。
例)コンバージョンタグ設置:計測タイミング「スクロール」
【設置箇所:</body>直前に設置】
ページのスクロール量が指定した割合(%)に達したタイミングでCVとして計測する処理「dlpoScrollCv」を、50%、100%(最下部)で呼び出しています。ページの上部から50%の位置に到達したタイミングで「cv_50」、最下部まで到達した場合に「cv_100」のCVが計測されます。
<script type="text/javascript">
(function () {
function dlpoScrollCv(type, ratio, isJoin) {
function getPageHeight() {
var d = document.documentElement;
var b = document.body;
return Math.max(
d.scrollHeight, b.scrollHeight,
d.offsetHeight, b.offsetHeight,
d.clientHeight, b.clientHeight
);
}
function onScroll() {
var d = document.documentElement;
var b = document.body;
var st = window.pageYOffset || d.scrollTop || b.scrollTop;
var wh = window.innerHeight || d.clientHeight;
var dh = getPageHeight();
if (st + wh >= dh * (ratio / 100)) {
window.removeEventListener('scroll', onScroll);
if (typeof window.adlpoMain === 'function') {
var firstArg = isJoin ? type + '_' + ratio : type;
adlpoMain(firstArg, 'pr=cv', 'img=beacon');
}
}
}
window.addEventListener('scroll', onScroll);
}
dlpoScrollCv('cv_50', 50);
dlpoScrollCv('cv_100', 100);
})();
</body>dlpoScrollCvの第1引数にコンバージョンポイント名、第2引数に割合を指定してください。第3引数は任意となります。
| 引数:例 | 項目名 | 設定内容 |
| 第1引数:cv_50,cv_100 | コンバージョンポイント名 |
コンバージョンポイントを識別するための名称を半角英数字で設定してください。(半角英数字に加え、記号の"_"(アンダーバー)が使用できます) ※大文字小文字は区別されません。(例えば"cv"と"CV"は同じエリアと認識されます) ※すでに使用されているコンバージョンポイント名は使用できません |
| 第2引数:50,100 | スクロール位置 | 上部からスクロールした際に、発火させたい位置を割合(%)で指定してください。 |
| 第3引数:未指定 | 連結フラグ | trueを指定すると、コンバージョンポイント名は「{第1引数の値}_{第2引数の値}」の形式で作成されます。 未指定、falseの場合は、第1引数に指定した値がコンバージョンポイント名となります。 |
※コンバージョンタグ設置ページには必ず「DLPOタグ」を設置してから(もしくは同時に)コンバージョンタグを設置してください。DLPOタグを設置せずにコンバージョンタグを設置するとエラーとなりますのでご注意ください。
※「dlpoScrollCv」内部で「adlpoMain」を実行しています。「adlpoMain」実行時の引数については、「表2:コンバージョンタグのadlpoMain引数」をご覧ください。