ポップアップの閉じるボタンを編集する – Rtoaster サポートセンター

Rtoaster action+を利用したポップアップではデフォルトでポップアップコンテンツの右上に
閉じるボタン(×ボタン)が表示されます。

この閉じるボタンを任意に編集することができます。

▼ 目次

ポップアップを閉じるボタンのアイコンを差し替える
ポップアップを閉じるボタンのアイコンを非表示にする
ポップアップに任意の閉じるボタンを設置する
設置した閉じるボタンのクリック計測を無効化する
折りたたみ表示時の最小化ボタンのサイズを変更する

ポップアップを閉じるボタンのアイコンを差し替える

ポップアップを閉じるボタンのアイコンを差し替えるには、ポップアップコードを含むRtoasterレコメンドコード内で、Rtoaster.Popup.closeIconSrcを使用します。

記述例

<script type="text/javascript" src="//js.rtoaster.jp/Rtoaster.Popup.js"></script>
<script type="text/javascript">
  Rtoaster.Popup.closeIconSrc="/image/close.png";
  Rtoaster.Popup.register("element_id");
  Rtoaster.recommendNow("element_id");
</script>

Rtoaster.Popup.closeIconSrcに差し替えたい画像のURLを指定してください。

ポップアップを閉じるボタンのアイコンを非表示にする

ポップアップを閉じるボタンのアイコンを非表示にするには、ポップアップコードを含むRtoasterレコメンドコード内で、Rtoaster.Popup.closeIconSrcを使用します。

記述例

<script type="text/javascript" src="//js.rtoaster.jp/Rtoaster.Popup.js"></script>
<script type="text/javascript">
  Rtoaster.Popup.closeIconSrc=""; 
  Rtoaster.Popup.register("element_id");
  Rtoaster.recommendNow("element_id");
</script>

Rtoaster.Popup.closeIconSrcに空文字を指定してください。

ポップアップに任意の閉じるボタンを設置する

ポップアップに任意の閉じるボタンを設置するには、Rtoaster.Popup.close()を使用します。
ポップアップコンテンツテンプレートでHTMLを選択し、コンテンツ内に記述してください。

記述例

<button onclick="javascript:Rtoaster.Popup.close('element_id');">ポップアップを閉じる</button>

Rtoaster.Popup.close()を除き、ポップアップコンテンツ内でのJavaScriptの利用は
動作保証対象外となりますのでご注意ください。

設置した閉じるボタンのクリック計測を無効化する

Rtoaster.Popup.close()の第二引数にtrueを指定することでクリック計測を無効化できます。

記述例

<button onclick="javascript:Rtoaster.Popup.close('element_id',true);">ポップアップを閉じる</button>

※引数なし(デフォルト)の場合、falseとなり、設置した閉じるボタンのクリックが計測されます。

クリック計測を無効化しているとき、ポップアップコンテンツ内で何らかのクリックをした後、
トラッキングが行われずにRtoaster.Popup.close()が実行された場合には、
クリック計測は行われません。

折りたたみ表示有効時の最小化ボタンのサイズを変更する

Rtoaster action+を利用したポップアップの折りたたみ表示で最小化ボタンのアイコンを差し替えて利用している場合等で、最小化ボタンの画像サイズを任意に変更する場合は以下のCSS記述例をご参考ください。

最小化ボタンサイズを30px × 30pxに調整する場合の記述例

<style>
  #element_id > img:last-child {
    width:30px !important;
    height: 30px !important;
  }
</style>

上記をサイトのHTMLまたはCSSに記述してください。