フラグメントオーサリング
フラグメントを作成した後、ビジュアルデザインスペースを使用して、フラグメント内の構造とコンテンツコンポーネントをオーサリングします。
構造とコンテンツの追加 design-fragment
-
コンテンツデザインを開始するには、構造からアイテムをドラッグして、キャンバスにドロップします。
必要な数だけ 構造 の項目を追加し、右側のペインで各項目の設定を編集します。
note tip TIP n:n列 コンポーネントを選択して、選択した列数（3 ～ 10個）を定義します。 列の下にある矢印を移動して、各列の幅を定義することもできます。 {width="800" modal="regular"}
各列のサイズは、構造コンポーネントの全幅の10%未満にすることはできません。 削除できるのは空の列のみです。
これらのコンポーネントの使用と書式設定について詳しくは、構造コンポーネント を参照してください。
-
「コンテンツ」セクションを展開し、必要な数のコンテンツコンポーネントを1つ以上の構造コンポーネントに追加します。
-
必要に応じて、設定またはスタイル タブで、各コンポーネントに対して追加のカスタマイズを行うことができます。
例えば、各コンポーネントのテキストスタイル、パディング、マージンを変更できます。
-
条件付きコンテンツを追加し、条件付きルールに基づいてターゲットプロファイルにコンテンツを適応させるには、コンテンツコンポーネントを選択し、コンポーネントツールバーの「条件付きコンテンツを有効にする」アイコンをクリックします。
詳しくは、条件付きコンテンツ を参照してください。
アセットの追加 add-assets
ビジュアルデザイン領域で、左側のナビゲーションバーのAssets （
）アイコンを選択し、Marketo Optimizer アセットライブラリから画像アセットを参照して選択します。
画像アセットを選択、置換、またはアップロードする手順については、 コンテンツのオーサリングにアセットを使用を参照してください。
レイヤー、設定、スタイルの移動 navigate-layers-settings-styles
ビジュアルデザイン空間でコンテンツを操作する際は、ナビゲーションツリーを使用して、コンポーネント、列、コンテンツ要素にアクセスできます。 左側のナビゲーションツリー アイコン（
）をクリックすると、ツリーが表示されます。
{width="800" modal="regular"}
次の例では、構造コンポーネント内のパディングと垂直方向の整列を列で調整する手順の概要を示します。
-
構造コンポーネントの列をキャンバスで直接選択するか、左側に表示されている ナビゲーションツリー を使用して選択します。
-
列ツールバーで、列を選択 ツールをクリックし、編集するツールを選択します。
構造ツリーから選択することもできます。 その列の編集可能なパラメーターは、右側の設定 タブとスタイル タブに表示されます。
ビジュアルデザイナーに表示される
-
列のプロパティを編集するには、右側の「スタイル」タブをクリックし、必要に応じて変更します。
-
背景の場合、必要に応じて背景色を変更します。
透明な背景の場合は、チェックボックスをオフにします。 背景画像設定を有効にして、単色の代わりに画像を背景として使用します。
-
線形の場合、上位、中央、または下位 アイコンを選択します。
-
パディングの場合、すべての側面のパディングを定義します。
パディングを微調整する場合は、「各辺に異なるパディングを使用」を選択します。 同期を解除するには、ロック アイコンをクリックします。
-
詳細 セクションを展開して、列のインラインスタイルを定義します。
-
-
必要に応じて、これらの手順を繰り返して、コンポーネント内の他の列の整列とパディングを調整します。
-
変更を保存します。
コンテンツのパーソナライズ personalize-content
Marketo Optimizerは、パーソナライゼーションにHandlebars構文を使用しています。 トークンは、送信時に各受信者のプロファイルデータの値に置き換えられます。
パーソナライゼーションを追加するには:
- テキストコンポーネントを選択し、ツールバーの「パーソナライゼーションを追加」（
- パーソナライゼーションダイアログで、左側のスキーマツリーを参照し、プロファイル属性を選択します。 エディターは、対応するHandlebars式（例：
{{profile.firstName}}）を挿入します。 - 必要に応じて、欠落しているデータを処理するフォールバック値（例：
{{profile.firstName | default: "there"}}）を追加します。 - 確認または 挿入 をクリックします。 式がフィールド内にインラインで表示されます。
式エディターツールと構文について詳しくは、Personalization エディターを参照してください。
リンクされたURL トラッキングを編集 edit-linked-url-tracking
リンクトラッキングパネルには、コンテンツ内の各URLを簡単に見つけることができる一元的なビューが用意されています。 左側のリンク アイコン（
）をクリックすると、コンテンツ内のすべてのリンク URLが表示されます。 テキストコンポーネント、ボタンコンポーネント、画像コンポーネント内のリンクです。
リストされたコンテンツリンクのトラッキングを定義するには、編集 （
）アイコンをクリックし、トラッキングタイプまたは ラベル を変更します。