他社ツールのポップアップとの重なり順を変更する方法

Ptengine Experienceで配信したポップアップは、デフォルトでサイト上の最前面に表示されます。

この記事では、他社ツールのチャットボットやバナーをサイトに設置している場合に、Ptengineのポップアップとの重なり順を任意で設定する方法をご紹介します。

また、Ptengineのポップアップを2つ以上同じページに使用したい場合の表示仕様はこちらの記事をご確認ください。

表示ロジック #

ポップアップの重なり順は、CSS の z-index 属性の値で設定できます。

z-index をより高い値にすると、その要素がより上（前面）に表示され、 z-index の値より低くすれば、その要素がより下（背面）に表示されます。

編集方法 #

ここでは、Ptengineで使用しているチャットボットツール（画面右下の水色アイコン）を例にとって、重なり順の編集方法をご説明します。

• 1チャットボットツールの z-index を探します（例：2147483000）



• 2Ptengineで作成したポップアップのIDを探します（例：silex-id-1594006965020-1）



• 3体験の編集画面に入り、右上のポップアップコードを編集に入ります。CSSのコード欄で、ポップアップの id を指定し、1で探した z-index より低い値を与えてください。



• 4体験を保存、してプレビューを確認し、公開します。