チュートリアル: Preference Center のカスタマイズ
Preference Center により、ユーザーは参加したいマーケティング キャンペーンを指定でき、希望する場合は今後のすべてのメール キャンペーンをオプトアウトできます。Preference Center のデフォルトの Sitecore ブランドを変更して、重要な設定を指定できます。以下の例では、デフォルトのブランドが左側に表示され、カスタム ブランドが右側に表示されています。

以下をカスタマイズできます。
-
1. Preference Center のタイトルと色
-
2. ヘッダーのロゴとはじめに
-
3. マーケティング カテゴリー、タイトル、説明文
-
4. 購読中止のテキスト
-
5. [購読更新] ボタン
このトピックでは、次の方法について説明します。
マーケティング キャンペーン カテゴリー、タイトル、説明文を定義する
デフォルトのレイアウトを使用すると、定義した各カテゴリーが Preference Center で個別のセクションとして表示されます。マーケティング キャンペーン カテゴリーは、マーケティング カテゴリー グループごとに Preference Center に追加されます。

マーケティング キャンペーン カテゴリーを定義するには:
-
コンテンツ エディターで、[マーケティング コントロール パネル] (sitecore/System/Marketing Control Panel) に移動します。
-
[タクソノミー] フォルダーを展開し、[マーケティング カテゴリー] を右クリックします。そして、挿入、フォルダーをクリックして、マーケティング カテゴリー グループに追加します。
-
新しく作成したフォルダーを右クリックして、[挿入、テンプレートから挿入] をクリックします。
-
[テンプレートから挿入] ダイアログ ボックスでTemplates/System/Analytics/Marketing Taxonomy/Marketing categoryに移動し、[マーケティング カテゴリー] を選択します。
-
[アイテム名] フィールドに、サブスクリプション カテゴリーの名前 (たとえば、ニュースレター) を入力して、[挿入] をクリックします。
-
追加のサブスクリプション セクションを定義するには、手順 3 ~ 5 を繰り返します。
-
コンテンツ ツリーで先ほど定義したサブスクリプション カテゴリーの 1 つをクリックし、[コンテンツ] タブの [全般] セクションの [説明] フィールドで、[エディターを表示] ハイパーリンクをクリックします。
-
[リッチ テキスト エディター] ダイアログ ボックスで、キャンペーン カテゴリーの説明を入力し、[OK] をクリックします。
-
すべてのマーケティング カテゴリーを定義したら、コンテンツ ツリーで sitecore/System/Marketing Control Panelに移動します。そこで、[タクソノミー] フォルダーを展開してから、[キャンペーン グループ] をクリックします。
-
リボンで、[タクソノミー] タブをクリックしてから、[デプロイ] をクリックします。
メディア ライブラリに新しいロゴをアップロードする
ロゴをメール設定センターに表示するには、まずロゴをメディア ライブラリにアップロードしてから、サイトを再びパブリッシュする必要があります。
ロゴをアップロードするには:
-
コンテンツ エディターのコンテンツ ツリーで、sitecore/Media Library/Imagesに移動します。
-
[フォルダー] タブで [アップロード] をクリックします。
-
[アップロード] ダイアログ ボックスで [ファイルを選ぶ] をクリックし、ロゴ画像ファイルが保存されている場所を参照します。
-
ロゴファイルを選択して [開く] をクリックしてから、[アップロード] をクリックします。
-
リボンの [保存] をクリックします。
ブランドのスタイルを適用する
ロゴと画像を Preference Center に表示するには、最初に設定する必要があります。
ロゴと画像を設定するには:
-
コンテンツ エディターのコンテンツ ツリーで、Preference Center のオプションを定義するマネージャー ルートを選択します。
-
[コンテンツ] タブをクリックします。
-
[メッセージ生成] セクションの [ベース URL] フィールドに、メール メッセージ内のリンクおよび Web サイトでホストされている画像 (たとえば、http://your.host) の Web サイト アドレスを指定します。
-
Embed Images
チェック ボックスを選択します。 -
[デフォルトのメッセージ ヘッダー] セクションの [差出人のアドレス] フィールドに、送信者のメール アドレス (たとえば、SendersName@abc.com) を入力します。
-
[ブランディング] セクションで、ブランド名とロゴを指定します。Preference Center のデフォルト設定を使用すると、購読中止メッセージでブランド名が使用され、Preference Center の上部にロゴが挿入されます。
-
[マーケティング カテゴリー] セクションで、最初の手順の手順 2 で定義したマーケティング カテゴリー グループをダブルクリックして、[選択済み] リストに移動します。
-
変更を保存します。
Preference Center のルック アンド フィールを変更する
会社のブランドを反映するように Preference Center をカスタマイズできます。デフォルトでは、Preference Center マーケティング グループ HTML には、マーケティング グループのサブスクリプション オプションと、マーケティング ルートに対して定義したカテゴリーが表示されます。
Preference Center のルック アンド フィールを変更するには:
-
コンテンツ エディターで、選択した Preference Center のオプションを定義するマネージャー ルートを使用して、[コンテンツ] タブをクリックします。
-
[Preference Center] セクションまで下にスクロールします。
-
[Preference Center タイトル] フィールドで、[Preference Center] ダイアログ ボックスのタイトルを指定します。
-
[Preference Center イントロ] で、[エディターを表示する] ハイパーリンクをクリックし、ユーザーに Preference Center を紹介します。
-
[Preference Center レイアウト HTML] セクションで、[HTML を編集する] ハイパーリンクをクリックします。
-
ヘッダーと送信ボタンの色を変更するには、以下を変更します。
-
[header] セクションを以下と置き換えます。
RequestResponseshellheader { height: 90px; border-top: 4px solid #9D008D; background-color: rgba(0,0,0,.8); padding: 0 15px; color: #fff; }
-
[header.before] セクションを以下と置き換えます。
RequestResponseshellheader:before { position: absolute; right: 0; top: 0px; display: block; background-repeat: no-repeat; width: 113px; height: 90px; content: ""; border-top: 4px #9D008D; }header:before { position: absolute; right: 0; top: 0px; display: block; background-repeat: no-repeat; width: 113px; height: 90px; content: ""; border-top: 4px #9D008D; and background-color: rgba(0,0,0,.8); }
-
[.exmPreferenceCenter form button] セクションで、[背景色] および [ボーダーの色] 属性を変更します。
-
.exmPreferenceCenter label .description .title] セクションで、行
color: #9D008D;
を追加します。
-
-
[OK] をクリックして変更を保存します。
変更をパブリッシュする
Preference Center への変更を表示するには、サイトの変更をパブリッシュする必要があります。
サイトの変更をパブリッシュするには:
-
リボンで、[パブリッシュ] タブをクリックします。
-
[パブリッシュ、サイトのパブリッシュ] をクリックします。
-
デフォルト (スマート パブリッシュ) を受け入れ、[パブリッシュ] をクリックします。
-
サイトがパブリッシュされたら、[閉じる] をクリックします。
変更を確認するには、Email Experience Manager で、左画像ブロックテンプレートを使用してメール キャンペーンを作成し、送信します。