Rtoasterタグの実装

Rtoaster action+の仕組み上必要なタグを直接HTMLに実装する場合にご参照ください。

HTMLに実装するタグについて

Rtoaster action+でレコメンドを行う際に直接HTMLに実装するタグは、3箇所に実装が必要です。

tag01.png

  • Rtoaster基本コード
    トラッキングを行い、ユーザーのサイト内行動を蓄積するためのJavaScriptタグです。
  • レコメンド場所の指定
    レコメンドの差し込み箇所にid属性(エレメントID)を実装します。
  • Rtoasterレコメンドコード
    レコメンドリクエストを行うためためのJavaScriptタグです。

ポップアップレコメンドの場合はレコメンド場所の指定は不要です。

レコメンドまでの動作

実装したコードが読み込まれることで、Rtoaster action+との間で様々な処理が行われます。
Rtoaster action+がレコメンドを返すまでのシステム動作は以下のようなイメージです。

tag02.png

Rtoaster基本コード

Rtoaster基本コードとは

Rtoaster action+を動作させるために、Webページに実装する必要があるJavaScriptタグです。
Rtoaster action+でトラッキング／レコメンド／スコアリングする全てのページが実装対象となるため、
サイト内の全ページに実装することを推奨しています。

《注意事項》

  • Rtoaster基本コードが実装されていないページへユーザーがアクセスした場合、
    Rtoaster側ではその情報を取得することができません。
  • レコメンド・効果測定を行うためには、レコメンドをクリックした後のリンク先(遷移先)のページにも、Rtoaster基本コードが実装されている必要があります。

Rtoaster基本コード取得

管理画面のRtoasterタグ取得から、Rtoaster基本コードを取得します。

▼Rtoaster基本コード サンプル

「RTA-XXXX-XXXXXXXXXXXX」の箇所は、お客様固有のトラッキングIDとなります。

Rtoaster基本コードの実装

Webページのヘッダ部分(<head></head>で閉じられる部分)に実装してください。
タグは手動で追加するか、テンプレートまたはインクルードを使用して追加します。

《Rtoaster基本コード実装時の注意点》

  • <head>…</head>タグ内に base タグが存在するページでは base タグより前、または bodyタグ内にRtoaster 基本コードを挿入してください。
    上記以外の場所に挿入した場合、Internet Explorer 6 以前のバージョンでエラーが発生する可能性があります。

エレメントID

エレメントIDとは

Rtoaster action+でレコメンドを実施するWebサイトコンテンツの場所(レコメンド場所)を指定するために必要なid属性です。

tag03.png

  • 上のイメージ図のうちid属性として、element_id1、element_id2で指定している箇所が「エレメントID」です。
  • <div></div>タグに限定されるわけではありません。

エレメントIDの実装

レコメンドを実施したいWebサイトコンテンツの一部のコンテンツ(テキスト、バナー、フラッシュなど)を <div></div> などのHTMLタグで囲うか、または既存のタグに、id属性(エレメントID)を付与します。

▼サンプル
  • エレメントIDをレコメンド表示を実施する場所に挿入してください。
  • エレメントIDはWebレコメンド設定で設定したエレメントIDを使用します。

《注意事項》

  • エレメントIDを挿入するタグにreadonly属性が設定されているとレコメンド表示が行えません。
    ※以下のタグではレコメンド表示が行えません 。 ご注意ください。
    • COL
    • COLGROUP
    • FRAMESET
    • HEAD
    • HTML
    • STYLE
    • TABLE
    • TBODY
    • TFOOT
    • THEAD
    • TITLE
    • TR 
  • エレメントIDは以下の条件を満たしている必要があります。
    • Webページ内で重複しないこと
    • 最初の文字は半角英字(a～z,A～Z)であること
    • 2文字目以降は半角英字(a～z,A～Z)、半角数字(0～9)、ハイフン(-)、 アンダースコア(_)、コロン(:)、ピリオド(.)を使用すること

サブエレメントIDの実装

ルールベースレコメンド・自動レコメンドで複数枠でレコメンド場所を指定する場合に、
サブエレメントIDを利用します。

tag04.png

  • 上のイメージ図のうちid属性として、element_id_1、element_id_2、element_id_3で指定している箇所が「サブエレメントID」です。
  • エレメントIDに紐付いた、複数表示枠でのレコメンドを行う際に必要なid属性です。
  • 1つのレコメンド場所に複数商品を表示したい場合に必要となります。
▼サンプル

  • サブエレメントIDは、親となるエレメントIDに「_n」(nには1から始まる連続した数字)を付与して記述します。

Rtoasterレコメンドコード

Rtoasterレコメンドコードとは

Rtoaster action+でレコメンドを表示するために、Webページに実装する必要があるJavaScriptタグです。
レコメンドを行う全てのページに実装します。 

レコメンドが実行されるページには、Rtoaster基本コードとRtoasterレコメンドコードの2種が実装されることになります。

《注意事項》

Rtoaster基本コードを実装せずにRtoasterレコメンドコードのみ実装した場合、
JavaScriptエラーとなりますのでご注意ください

Rtoasterレコメンドコード取得

管理画面のRtoasterタグ取得から、Rtoasterレコメンドコードを取得します。

▼Rtoasterレコメンドコード サンプル
  • レコメンド場所が変更・追加されると、Rtoasterレコメンドコードも変更・追加されますのでご注意ください。
  • ポップアップレコメンドを実施する場合は、ポップアップコードの実装が必要です。

Rtoasterレコメンドコードの実装

<body>…</body>タグの中に実装します。

  • エレメントIDを引数として渡す必要があります。エレメントIDに「,」をつけて複数渡すことも可能です。
  • 引数の左から順にレコメンド表示されます。
  • そのページ内に存在しないエレメントIDを引数に渡しても無視され(エラーになることはありません)、存在するエレメントIDに対してのみレコメンド表示されます。

《Rtoasterレコメンドコード実装時の注意点》

  • </body>の直前、且つその他のJavaScriptタグよりも優先的に呼び出させる位置に貼り付けることを推奨いたします。
  • 他のWeb ビーコン型のJavaScriptタグやセキュアサイトシール等の取得に時間がかかるタグが存在する場合、該当タグよりも前に （優先的に呼び出させる位置に）「Rtoasterレコメンドコード」を挿入することを推奨いたします。（レコメンド実行速度に影響します。）
  • HEAD タグ内に BASE タグが存在するページでは、基本コードを BASE タグより前、または BODY タグ内に挿入して頂く必要があります。 上記以外の場所に挿入した場合、 Microsoft Internet Explorer 6.0 以前のバージョンでエラーが発生する可能性があります。
  • Rtoaster.recommendNow()を同一ページ内に複数実装した場合は、動作保証対象外となります。
  • Rtoaster基本コードを実装せずに、レコメンドコードのみ実装した場合、
    JavaScriptエラーが発生しますのでご注意ください。
  • 必ずページ内の全てのレコメンド場所より後にレコメンドコードを挿入してください。
    レコメンドコードの挿入場所よりも前に存在するレコメンド場所以外はレコメンドが実行されません。 

ポップアップコードとは

Rtoasterのレコメンドでポップアップコンテンツを表示するために、Webページに実装する必要があるJavaScriptタグです。

ポップアップコード取得

管理画面のRtoasterタグ取得から、ポップアップコードを含むRtoasterレコメンドコードを取得します。

▼ポップアップコードを含むRtoasterレコメンドコード サンプル

ポップアップコードの実装

Rtoasterレコメンドコードの実装に準じます。

《関連記事》

 

《ポップアップコード実装時の注意点》

  • ポップアップコードを使用する場合はエレメントIDをHTMLに実装する必要はありません。
  • Rtoaster.Popup.register()の引数に渡すエレメントIDはRtoaster.recommendNow()にも渡す必要があります。
  • Rtoaster.Popup.register()の引数に渡すエレメントIDは1つのみとなります。