その他の機能

​

デフォルトの auto プロパティ

デフォルトの auto プロパティを使用して、選択した要素のサイズと位置を定義できます。この場合、ブラウザーは使用中のデバイスに応じて要素のサイズと位置を計算します。

​

モードの切り替え

モバイルモードまたはタブレットモードに切り替えてアプリケーション上の要素を編集することもでき、さまざまなプラットフォームで Web サイトをよりレスポンシブかつダイナミックにできます。

• Interact mode では、ページをブロックしているポップアップを閉じたり、ビジュアルエディターを使用して Web ページに加えたすべての変更を表示したりできます。

​

設定

​

エディター設定

このエディター設定では、Web ページの表示方法を設定できます。 Responsive design: このオプションでは、現在のバリエーションの変更やパーソナライズされたエクスペリエンスを、すべてのデバイスに適用するか、現在のデバイスのみに適用するかを選択できます。 Element selector: このオプションでは、HTML ID と CSS セレクターを使用して Web ページ上の要素を識別できます。

​

要素の HTML ID を使用する

HTML 要素 ID は、Web ページ上の特定のセクションや要素にラベルを付けるために Web サイトのコードで使用される一意の識別子です。Web ページの特定の部分を特定して操作するのに役立ちます。 要素の HTML ID を使用すると、以下に示すように、選択した要素の HTML ID が表示されます。 要素の CSS セレクターを使用する CSS セレクターの使用は、HTML ドキュメント内の特定の要素を識別して選択し、スタイルを適用する方法です。このパスには、要素、ID、クラス、その他の属性を含めることができ、スタイルを設定したい要素または要素グループを正確に特定できます。これは、対象の要素に到達するために HTML ドキュメント構造内でたどる要素のチェーンを定義します。 要素の CSS を使用すると、以下に示すように、選択した要素の CSS が表示されます。 デフォルトでは、MoEngage Personalize エディターは ID を使用して要素を識別するように設定されています。ID が存在しない、または指定されていない場合、MoEngage は要素の HTML セレクターパスを使用します。
動的 ID を持つ要素がある Web ページ

• Web ページには、動的 ID を持つ要素が含まれる場合があります。動的 ID とは、ページが読み込まれるたびに、またはユーザーの操作やページ上で実行されるスクリプトの結果として変化する ID です。
• CSS スタイリングや JavaScript による操作では、識別子が一貫していないため、動的 ID の扱いが難しい場合があります。

このような場合は、MoEngage エディターで Element ID セレクターを無効にし、要素の HTML セレクターパスを使用することをお勧めします。

​

リセット

Reset オプションでは、すべてのデバイスまたは特定のデバイスで現在のバリエーションに加えられたすべての変更を削除できます。

• Reset ではバリエーションに加えたすべての変更を一度に削除できるのに対し、Changes ではそのバリエーションの各要素に加えた個々の変更を削除または編集できます。
  選択したバリエーションの各要素に加えられたすべての変更は、Changes ドロップダウンに記録されます。Changes ドロップダウンをクリックし、削除アイコンを選択すると、その要素に関連する変更を元に戻すことができます。以下の GIF は、以前に削除した Shop now ボタンをリセットする例を示しています。変更をリセットするとすぐに、ボタンが元の位置に再び表示されます。