WEB – カスタマーサポートサイト

Webパーソナライズ機能を利用することで、ウィジェットパーツのコンテンツを特定のリードへ表示したり、Webサイトへの訪問回数等を条件としたコンテンツの動的表示を行うことができます。

またこの機能を活用することで、表示するコンテンツの簡易なABテストを行うことも可能です。

設定内容と活用方法

Webパーソナライズ機能を利用することで、特定のサイト訪問者宛にポップアップや申込フォームを任意のWebページに表示させることが可能になります。

また、挿し込んだポップアップや申込フォームは訪問者の状況や期間、曜日・時間帯などで表示をコントロールしたり、訪問者の特性によりコンテンツを出し分けることにより、サイトの訪問者にとって、どのコンテンツを表示させることが最適かどうかをパターン別にテスト（ABテスト）することができます。

ここでは、Webパーソナライズ機能を利用して、ターゲットをパターン別に分けてコンテンツを表示させる方法と、ABテストの実行結果確認方法についてご紹介します。

手段

Webパーソナライズ機能は以下の3つの要素で構成されており、それぞれの機能は下記になります。

パーソナライズドウィジェット
Webパーソナライズ機能のコントローラーとして機能します。
ウィジェットターゲット
ウィジェットを表示する対象となるWeb訪問者の条件を指定します。
ウィジェットパーツ
実際に表示させるコンテンツを作成します。画面上でテンプレートを選択し、そのテンプレートに要素を埋めることでコンテンツを作成することができます。

なお、ABテストの実行結果については、パーソナライズドウィジェット詳細画面より、[使用中ウィジェットパーツ]から確認が可能です。

詳細については、下記のパーソナライズ機能についてまとめたチュートリアル動画をご参照ください。

設定方法

WEBパーソナライズ機能を使用する際の事前準備については、下記マニュアルを確認し、設定いただくようおねがいいたします。

ABテストを目的としたパーソナライズドウィジェットの設定手順

１.[WEB]タブ＞サイドメニューの[パーソナライズドウィジェット]をクリックし、パーソナライズドウィジェットの一覧ページが表示されたら左上にある[新規登録]ボタンをクリックします。

図:パーソナライズドウィジェット画面

2.「作成するパーソナライズドウィジェットタイプを選んでください」と表示されるので、[ポップアップ]か[埋め込み]を選択します。

図:パーソナライズドウィジェット登録画面

ポップアップの場合

ポップアップウィジェットを作成します。

図:ポップアップウィジェットの作成方法

埋め込みフォームの場合

埋め込みウィジェットを作成します。

図:埋め込みウィジェットの作成方法

3.ウィジェットの作成が完了し、[パーソナライズドウィジェット詳細]画面に遷移したら、[新規ウィジェットターゲットを作成して追加]をクリックします。

図:パーソナライズドウィジェット詳細画面

4.ウィジェットターゲット登録画面に遷移したら、ABテストの対象となるターゲットを設定します。

今回は、「リードに対して、AとBのコンテンツを出し分けて、反応の違いをみる」というテストを行うために、下記の設定を行います。

■パターンA

対象範囲	項目	項目名	条件	価
リードのみ	リード	リードID	偶数	-

■パターンB

対象範囲	項目	項目名	条件	価
リードのみ	リード	リードID	奇数	-

ウィジェットターゲットを設定する際の注意点については下記マニュアルをご参照ください。

注意事項

検索条件は、「トラッキング」「リード」「リスト」のブロックから設定することが可能ですが、匿名者はSMP上で管理されていないので、「リード」「リスト」情報を持ちません。

また、「両方（匿名およびリード）」を選択した場合でも、「匿名」が含まれるので、同じく「リード」や「リスト」で検索条件の設定を行った場合、条件を満たすことができない可能性があります。

そのため、匿名ユーザーを対象にして、デモグラフィック属性や、地理的属性を条件にテストを行うことはできません。

匿名ユーザーを対象にする場合は、トラッキングブロックでの条件指定を推奨しています、詳細については下記FAQをご参考にしてください。

・【FAQ】ウィジェットターゲットを「匿名のみ」に設定した場合、条件設定をしなくても訪れたすべてのユーザーに表示されるか?

5.ウィジェットターゲットを設定したら、それぞれのターゲット宛に表示させるコンテンツ[ウィジェットパーツ]の作成をします。

[WEB]タブ＞サイドメニューの[ウィジェットパーツ]

図:ウィジェットパーツ一覧画面

6.[ウィジェットパーツ一覧画面]の左上にある[新規登録]ボタンをクリックし、登録情報を設定します。

ウィジェットパーツを表示させたいターゲットは、4で設定したAとBになるので、AとBのそれぞれのターゲットに紐づけた2つのウィジェットパーツを作成します。

ウィジェットパーツの編集とターゲットとの紐づけを行う方法については下記のマニュアルをご参照ください。

注意事項

※登録情報の[使用するウィジェットターゲット]ではABテスト対象のウィジェットターゲットを設定してください。

※ABテストの対象のターゲットごとのウィジェットパーツを作成する際は、登録情報の[キャンペーン]に共通のキャンペーンを設定するようにしてください。

※ウィジェットパーツ選択画面では、作成するウィジェットパーツの用途と種別を選択します。この画面は、新規登録時のみに表示されます。

ウィジェットパーツ選択画面の設定内容により、登録情報の設定フォーマットが変わります。それぞれの画面詳細については下記マニュアルをご参照ください。

・[マニュアル]Webパーソナライズ機能　ウィジェットパーツ

7.[パーソナライズドウィジェット]＞[詳細]＞[タグ取得]より、タグを取得し、表示させたいサイトに挿入します。

タグの挿入位置については、ページの<body>の最下部付近を推奨しています。

図:パーソナライズドウィジェット詳細画面

なお、上記の設定をしたにも関わらず、ページに表示されない場合の対処法等については下記マニュアルをご確認ください。

実行結果

1.[WEB]タブ＞サイドメニューの[パーソナライズドウィジェット]をクリックし、パーソナライズドウィジェットの一覧ページが表示されたら、アクセス状況を見たいパーソナライズドウィジェットの[詳細]をクリックします。

図:パーソナライズドウィジェット画面

2.パーソナライズドウィジェット詳細画面が表示されたら、一番下にあるブロック[使用中ウィジェットパーツ]を確認します。

各項目の意味については以下のとおりになります。

図:使用中ウィジェットパーツ

項目	内容
ウィジェットパーツID	ウィジェットパーツのIDです。システムが自動で発番します。
ウィジェットパーツ名	管理者が任意で命名することができるウィジェットパーツの名前です。
用途	ウィジェットパーツの用途です。「ポップアップ」か「埋め込み」のいずれかになります。
種別	ウィジェットパーツの種別です。「HTMLページ」または「申込フォーム」のいずれかになります。
有効	ウィジェットパーツが表示されるかどうかのステータスが表示されます。リンクをっクリックすることで有効・無効を切り替えることができます。編集でウィジェットパーツの紐付けを外すことができますが、外した場合はこの一覧の実績に表示されなくなりますので、ご注意ください。
表示回数	そのウィジェットパーツを表示した回数です。
表示者数	そのウィジェットパーツを表示した人数です。
表示リード数	そのウィジェットパーツを表示したリード数です。
URLクリック数	（HTMLページのみ）HTMLページにURLリンクがあった場合、そのURLリンクをクリックした回数です。
URLクリック者数	（HTMLページのみ）そのウィジェットパーツのURLリンクをクリックした人数です。
URLクリックリード数	（HTMLページのみ）そのウィジェットパーツのURLリンクをクリックしたリード数です。
申込数	（申込フォームのみ）そのウィジェットパーツから申込が行われた回数です。
申込者数	（申込フォームのみ）そのウィジェットパーツから申込が行われたリード数です。

3.「レポート期間」を入力し、適用ボタンをクリックすることで、表示回数や表示リード数などの集計項目について指定した期間の実績に絞り込にで表示させることが可能です。

初期状態では全期間の実績が集計されています。

注意事項

・ウィジェットパーツは1つのパーソナライズドウィジェットにのみ紐付けることができます。他のパーソナライズドウィジェットで使用しているウィジェットパーツは使用することはできません。使用したい場合はウィジェットパーツ画面でコピーをして紐付けしてください。

・使用中のウィジェットターゲットを他のパーソナライズドウィジェットに使用することはできません。使用したい場合はウィジェットターゲット画面で対象のウィジェットターゲットをコピーをしてからパーソナライズドウィジェットに紐付けを行ってください。

ファイルサイズ制限の確認方法

全キャンペーン（セミナー）管理モードを開きます。
[設定]タブ＞[システム設定一覧]の順にクリックします。
システム設定一覧の中の[公開資料アップロードのファイルサイズ制限(MB)]を確認します。

公開資料パフォーマンス FAQ 制限値

公開資料の制限事項（サイズ・拡張子）を知りたい

ここでは、Webページを修正するための「デザインテンプレート」の概要について紹介させていただきます。

1-1. デザインテンプレートができること

SMPではリードのデータ管理やメールなどの施策管理だけでなく、CMSとしてマイページや申込画面のコンテンツを管理することが可能です。中級編をマスターしていただくと、SMPで作成するページのコンテンツ・レイアウト・動きを、皆様の運用に合わせてカスタマイズすることができます。このコンテンツ・レイアウト・動きを決めているのが「デザインテンプレート」です。本編では、これをカスタマイズする方法をご紹介します。

1-2. デザインテンプレートの構成要素

図1:デザインテンプレート内のファイル

テンプレートの中には以下のファイルが含まれています。

・HTMLファイル：ページの見出し・本文・構造を決める

・CSSファイル：ページ内の色や配置などのレイアウトを決める

・javascriptファイル：ユーザーの閲覧や操作に応じてポップアップやデータの授受などの動きを決める

・画像ファイル：ページで表示する画像を決める

1-3. デザインテンプレートで編集できるページ

SMPでは下記図に示すページをご用意しています。これらのページ全てをSMPのデザインテンプレートで編集することができます。

図2:SMPサイトマップ(サイト構成/画面遷移図)

拡大版ダウンロード：【標準デザインテンプレート】SMPサイトマップ(サイト構成／画面遷移設計図)

大きく分けると以下の画面があります
・キャンペーン詳細、申込フォーム
・キャンペーン一覧(ポータルページ)
・マイページ
・ログイン
・そのほかエラーや配信停止

1-4. デザインテンプレートの種類

図3:デザインテンプレートのダウンロード画面

デザインテンプレートには以下２種類あり、それぞれ適用範囲が異なります。

・全キャンペーン管理画面(青色の画面)から取得・登録する「システムテンプレート=system.zip」

・個キャンペーン管理画面(オレンジ色の画面)から取得・登録する「キャンペーンテンプレート=seminar.zip」

■「システムテンプレート」の適用範囲

システムテンプレートの編集内容は、全てのキャンペーンの、全て画面(サイトマップ参照)に反映されます。

■「キャンペーンテンプレート」の適用範囲

キャンペーンテンプレートの編集内容は、そのキャンペーンの、ピンク領域の画面(サイトマップ参照)にのみ反映されます。

MEMO≫ 適用範囲の違いについて

サイトマップのピンク領域に含まれる画面は、個々のキャンペーン毎に用意されています。それに対してピンク領域以外は「マイページ」や「ログイン画面」など特定のキャンペーンに依存しない画面(システムに共通する１つの画面)なので、「システムテンプレート」でのみ編集可能です。

MEMO≫「キャンペーンテンプレート」で編集した画面を「システムテンプレート」で編集すると更新されるか？

この場合は更新されません。前提として、デザインテンプレートの適用優先度は以下です。

　　「キャンペーンテンプレート」>「システムテンプレート」

キャンペーンテンプレートを既に適用している場合、その後システムテンプレートを登録しても、そのキャンペーンに反映されません（反対に、システムテンプレート登録によるデザイン変更後、キャンペーンテンプレートを登録すると、デザインは適用されます）。

system.zip_inf.png

図4:デザインテンプレートの適用優先度

1-5. デザインテンプレートのフォルダ構成

図5:フォルダ構成

■テンプレートの構成

・キャンペーンテンプレートの中にはapplication,unsubscribeなどのフォルダがあり、これらの中にキャンペーン詳細画面、申込画面などのHTMLファイルが含まれています。また、Sharedの中にCSS,JS,画像ファイルが存在します。

・システムテンプレートの中にはlogin,mypageなどのフォルダがあり、これらの中にログイン画面やマイページ画面のHTMLファイルが含まれています。また、seminar_beseというフォルダがありますが、これは個別キャンペーンにまだキャンペーンテンプレートを適用していない場合にデフォルトで適用されるデザインです。実際にseminar_baseフォルダの中身を見ると構成がSeminar.zipと同じ(上記図参照)となっていますが、これは個別キャンペーンのデフォルトデザインだからです。

1-6. 画像・CSS・jsの編集方法

図6:ファイルパス指定

■ファイルの設置方法(フォルダの階層)

sharedの中に画像・CSS・JavaScriptのフォルダ・ファイルが用意されているので、これらの中に各種ファイルを設置してください。

■ファイルパス(相対パス)の指定方法

画像,CSS,jsが含まれるsharedフォルダは、キャンペーンテンプレートにもシステムテンプレート（seminar_beseフォルダ内）にも存在します。通常の運用であまり意識することはないですが、どのようなファイルパスを宣言するかによって、キャンペーンテンプレートのsharedフォルダ(画像,CSS,js)を読み込むか、システムテンプレートのsharedフォルダ(画像,CSS,js)を読み込むかを決めることができます。

具体的には、ファイルパスを

href="__base_system_path__/shared/css/***.css"

と書いた場合、それを宣言したHTMLファイルが仮にキャンペーンテンプレートのものであったとしても、システムテンプレートからファイルを読み込んできます。

href="__base_seminar_path__/shared/css/***.css"

と書いた場合、それを記載したHTMLファイルがシステムテンプレートのものであったとしても、キャンペーンテンプレートからファイルを読み込んできます。

MEMO≫ パスとは？

Webページで画像・CSS・JavaScriptを読み込むためには、その画面に対応するHTMLが読み込まれた際、そのHTMLからさらに画像・CSS・JavaScriptファイルを読み込む必要があります。その場所を指定するための宣言がファイルパスです。

1-7. 変数($FORM)の特徴

■変数とは

キャンペーンのタイトルを変更したいとき、あるいはフォームの入力項目の表示非表示を切り替えたいなどというとき、わざわざHTMLを書き替えるのは面倒ですよね。SMPでご用意している「変数」を予めHTMLに埋め込んでおけば、後の運用では管理画面から設定を少し変えるだけで、ページに出力される様々な内容を変えることができます。

■変数の仕組み

例として、管理画面で変更したキャンペーンタイトルがWebページに表示される仕組みは以下のようになっています。

1. サイト訪問者がブラウザでWebページ（キャンペーン詳細画面）を読み込む＝HTMLが読み込まれる

2. HTML内に埋め込んだ変数(例：$FORM{title})が読み込まれる

3. 変数に格納されているSMP設定項目の値(例：（キャンペーンタイトル）)が読み込まれる

4.SMP設定項目の値(例：（キャンペーンタイトル）)がWebページに表示される

このように、変数が管理画面の設定値を読み込み、その情報をページ上に表示してくれるため、HTMLを書き替える必要がなくなります。

図7:変数

MEMO≫ 変数($FORM)の入れ子構造

一部の変数では、上記のように管理画面の設定値を読み込むために使われるのではなく、別のHTMLファイルの内容を出力するためのものがあります。例えば、確認画面のHTMLである「confirm/index.html」ファイルには$FORM{cart}があります。この変数には下右図のように別のHTMLファイル「confirm/cart.html」が格納されています。これにより、確認画面を読み込む際は、下左図の＄FORM{cart}部分に「confirm/cart.html」の内容が挿入される形で表示されることになります。

図8:変数($FORM)の入れ子構造

この変数はHTMLの内容を分類整理するために使われる変数です。HTML編集を行う際は知っておくと便利ですので、覚えておきましょう。

仕様/条件利活用 $FORM・変数ご利用ガイド

1. デザインテンプレートの構成を知ろう

この記事ではマーケティング活動促進を目的とした動画視聴履歴機能の概要と活用方法についてご紹介します。動画視聴履歴機能概要、機能ご利用前の事前準備、利用シーン等につきましては、「動画視聴履歴機能の活用方法（活用事例１）目次１～３」でご紹介しておりますのでご参照ください。

1.活用の流れ

「動画視聴履歴機能の活用方法（活用事例１）の3-2.活用事例」で記載している活用例２の具体的な活用方法・実装手順について解説します。

図１：活用事例イメージ

下記の図では、SMPを利用して一度資料請求をしたものの、連絡がとれなくなってしまいそのまま休眠顧客となってしまったお客様を再びリードとして復活させるまでを表した運用イメージ図になります。

___.1.PNG

図２：運用イメージ図（全体）

上記、運用イメージ図のように、一度休眠顧客になってしまったお客様に対してアプローチを掛け、再び潜在顧客化することができます。過去に資料請求後、フォローコールで未応答になってしまったお客様の中には電話には出られなかったものの、興味のあるお客様がいる可能性があります。上記のようなお客様に対して会社紹介動画を作成し、再び興味を惹きつけることで、アポイント・商談化する確率を高めていきます。今回は、会社紹介動画作成からフォローまでの活用イメージをもとに実装手順について解説します。

_______.2.PNG

図３：ウェビナー終了後の活用イメージ

2.実装手順

実装手順は次の通りです。

2.1.会社紹介動画をページに表示する

このステップでは、作成した会社紹介動画情報をSMPに登録後、
サイトページに動画プレーヤーを表示するまでの手順をご紹介します。

実装手順は次の通りです。

実装手順

動画情報をSMPに登録する
会社紹介動画ページを作成する
自社サイトに会社紹介動画を表示する

2.1-1.動画情報をSMPに登録する

作成した動画をリードに案内するために、動画をSMPへ登録します。
動画をSMPに登録されていない場合は、以下マニュアルを参考に動画をSMPに登録してください。

対象の記事

・[マニュアル]動画情報を登録する

2.1-2.会社紹介動画ページを作成する

前項で登録した会社紹介動画を表示するページを作成します。ページの作成方法は大きく分けて3つあります。今回は自社のホームページサイトに会社紹介動画ページを設け特定のページに動画を表示する方法を解説します。

種類（動画表示方法）	メリット	デメリット
受講票に表示する	・URLクリックで視聴可能・設定作業が容易・個別キャンペーンで管理可能	受講票のURLに有効期限を設定する場合、システム全体共通の期限となる（個別キャンペーン毎に設定不可）
マイページに表示する	視聴可能なユーザを制限可能	マイページ機能の有効化が必要（オプション機能）
外部サイト(自社サイト)に表示する	自社サイトに情報を集約できる	サイト管理者でのサイト編集が必須

2.1-3.自社サイトに会社紹介動画を表示する

自社のホームページサイトに会社紹介動画を表示するには、動画プレーヤータグをサイトページに設置する必要があります。動画プレーヤータグの確認方法、設置方法（設置例）につきましては以下マニュアルをご参考ください。

対象のマニュアル

・タグを使用して設置する

2.2-1.休眠状態のリードを抽出する

休眠状態のリードを抽出する場合、「資料請求しているが、活動履歴が未応答」の人等を条件に複合検索を利用し抽出します。

_______.3.PNG

図４：複合検索例

上記の複合検索はキャンペーンカテゴリを使用している事が前提となります。
上記の複合検索は資料請求をしたリードに担当者が連絡後、未応対だった旨の履歴を活動履歴に登録している事が前提となります。

また、複合検索で抽出したリードはメールを配信する際の送信対象者となるため、検索条件として保存します。複合検索と検索条件の保存方法については、下記マニュアルで詳しく説明しています。下記マニュアル、FAQをご確認いただき、ウェビナー参加者を抽出してください。

対象の記事

・[マニュアル] 複合検索機能を利用する

・[マニュアル] 複合検索の利用例

・[FAQ]保存した検索条件を確認したいです。

2.2-2メールテンプレートを作成する

以下の文面を参考にメールテンプレートを作成します。

「活用例２：ウェビナー不参加者に対しての動画案内メール文面例」

====================================================================
タイトル：〇〇ウェビナー会社紹介動画のご案内
====================================================================
[% VisitorData.company_name %]
[% VisitorData.name1 %] 様

平素はお世話になっております。
株式会社◯◯ 運営事務局でございます。

会社紹介動画の視聴ページをご案内いたします。
ぜひお手すきの際にでも、下記URLよりご視聴ください。

■会社紹介動画
https://www.shanon.co.jp/corporation/XXXXX

今後ともどうぞよろしくお願いいたします。
--------------------------------------------------------------------
■お問い合わせ
株式会社◯◯ ウェビナー運営事務局
E-mail:XXXX@shanon.co.jp
--------------------------------------------------------------------
====================================================================

メールテンプレートの作成方法は下記マニュアルをご参照ください。

対象の記事

・[マニュアル]メールテンプレートを管理する

2.2-3.メールを一括配信する

一括配信については、「[マニュアル]一括配信方法」をご確認いただき、休眠状態のリードに対し、メールを配信してください。

重要

メール配信設定を行う際は、休眠状態のリードと会社紹介動画の視聴履歴データを関連付けるためにEmailクリックカウントを「使用する」に設定します。

クリックカウントが有効になっているURLを休眠状態のリードがクリックした時点で、リードデータと動画視聴履歴が関連付けられます。

リードと動画視聴履歴のデータの関連付けはトラッキングの仕組みを利用しています。関連付けられるタイミングは「トラッキング同期」を参照ください。

2.3.会社紹介動画を視聴したリードをリストに追加する

前項でメールにて案内した動画を視聴したリードをリストに追加します。リストに追加した後は、営業部署に共有し、フォローを実施していきます。

実装手順は次の通りです。

実装手順

会社紹介動画を視聴したリードを抽出する
リストを作成する

2.3-1.会社紹介動画を視聴したリードを抽出する

今回は、メールで案内した会社紹介動画を、1回以上視聴した人を抽出します。
会社紹介動画を「1回以上」視聴したリードを検索する

図５：複合検索　「会社紹介動画を1回以上視聴したリード」

リードの抽出条件は次の通りです。

ブロック名	項目名	条件	値
動画視聴履歴	動画ID	次の値と一致する	1（登録済の動画ID）

リードの抽出後は、検索条件（全ユーザ使用可）を保存します。

複合検索と検索条件の保存方法については、「2.2-1.休眠状態のリードを抽出する方法」でご紹介していますのでご確認ください。

2.3-2.リストを作成する

前項で抽出した「会社紹介動画を視聴したリードを抽出」をリストします。

リストの作成は「(マニュアル)リストの作成・編集・削除」を参考に作成します。
「2.3-1.会社紹介動画を視聴したリードを抽出する」で抽出したリードに一致する全リードを選択し、「(マニュアル)リード一覧画面でリードをリストへ追加」を参考にリストへ登録します。
リスト作成後は、営業/インサイドセールスへ共有します。

3.フォローの実施（架電）

このステップでは前項で登録したリストに追加されたリードに対してフォローを行います。

3.1.(インサイド)セールス部による架電の実施

[手順]

[全キャンペーン]≫[リスト]≫[リスト一覧]≫[リード数]リンク

前項で作成したリストの[リード数]をクリックします。
リードに対して架電します。
架電結果は、「リードに活動履歴を登録しよう」を参考に実施します。

架電後、リストから特定のリード外す場合は、「リード一覧画面でリードをリストから除外」を参考に[リスト除外]を選びます。

3.2.架電対応後の活動履歴の登録

活動履歴にアポイント/商談化を入れたものを「対象のリードを検索しよう」を参考に抽出します。
アポイント/商談化のリストを作成するため、「(マニュアル)リストの作成・編集・削除」を参考に登録します。
1で抽出したリードに一致する全リードを選択し、「(マニュアル)リード一覧画面でリードをリストへ追加」を参考にリストへ登録します。
営業担当にアポイントまたは商談化した情報を共有します。

4.まとめ

このガイドでは、過去、資料請求はあったものの、その後の応答がなく、アプローチができずにやりとりが終わってしまった休眠状態の顧客に対し、会社紹介動画を案内する方法とアプローチ方法についてご紹介しました。動画機能に関する詳細につきましては、下記関連コンテンツをご確認下さい。

5.関連チュートリアル動画

6.関連ご利用ガイド

7.関連マニュアル

設定方法利活用動画視聴履歴ご利用ガイド

動画視聴履歴機能の活用方法（活用事例２）

Webパーソナライズ機能のウィジェットターゲットでは様々な条件を設定することができます。

このコンテンツでは実施したい条件に合わせたウィジェットターゲットの設定例をご紹介します。

紹介内容と活用方法

ウィジェットターゲット機能を使うことで、設定したパーソナライズドウィジェットを誰に表示させるかのコントロールをすることができます。

条件として使用できるものは以下のとおりです。

トラッキング履歴
リード項目
リスト所属状態

Webパーソナライズ機能の構成および、ウィジェットターゲットの詳細については下記マニュアルをご確認下さい。

手段

下記画面にて、ウィジェットターゲットの新規登録・編集を行うことが可能です。

WEB＞ウィジェットターゲット＞新規登録

図:ウィジェットターゲットの新規登録・編集画面

機能名

説明

名前

ウィジェットターゲットの名前です。管理者が自由に設定することができます。

対象範囲

ターゲットの対象を「アノニマスのみ」「リードのみ」「両方（アノニマスおよびリード）」のいずれかから選択することができます。

「アノニマスのみ」を選択した場合、検索条件で「リード」「リスト」情報を持つのはリードのみなので条件を満たすことができない場合があります。「両方」を指定した場合でもこのような場合にリードのみが条件に適合する場合があります。

対象条件

ターゲットの条件を具体的に指定します。基本的には複合検索と同じように指定することができますが、以下のような差異があります。

■条件指定可能な要素

・リード

・トラッキング

・リスト

■注意事項

トラッキングでは以下の項目のみ指定できます。

・訪問日時

・URL

・アクセス回数

リストでは以下の項目のみ指定できます。

・リストID

条件式で使用できるんは「AND」と「OR」のみです。

「AND NOT」は使用できません。

設定方法

ここではウィジェットターゲット新規登録・編集画面にて設定を行う際の、ターゲット設定例をパターンに分けていくつかご紹介します。

１．地理的属性

パターン１：東京在住の人が訪問したときのみ特定のコンテンツを表示させたい

対象範囲	項目	項目名	条件	値
リードのみ	リード	都道府県	次の値を選択している	東京

パターン２：日本人の訪問者と海外の訪問者に対して、コンテンツを出し分けたい

5/下記の２つのウィジェットターゲットを作成して、テスト対象のウィジェットパーツごとに紐づけを行う。

ターゲット１：日本人の訪問者

対象範囲	項目	項目名	条件	値
リードのみ	リード	都道府県	次の値を選択していない	海外

ターゲット２：海外の訪問者

対象範囲	項目	項目名	条件	値
リードのみ	リード	都道府県	次の値を選択している	海外

上記の設定を行い、紐づけが完了すると、パーソナライズウィジェット詳細画面では下記の設定内容を確認することができます。

図:パーソナライズウィジェット詳細画面

２.年齢別

パターン3：20代の訪問者と30代の訪問者に対して、コンテンツを出し分けたい

①リード基本項目でプルダウン形式で選択肢を「20代、30代、40代・・・」とした「年齢」項目を作成する。

②「ウィジェットターゲット登録」画面で、下記の２つのウィジェットターゲットを作成して、テスト対象のウィジェットパーツごとに紐づけを行う。

ターゲット１：20代の訪問者

対象範囲	項目	項目名	条件	値
リードのみ	リード	①で作成した「年齢」	次の値を選択している	20代

ターゲット２：30代の訪問者

対象範囲	項目	項目名	条件	値
リードのみ	リード	①で作成した「年齢」	次の値を選択している	30代

上記の設定を行い、紐づけが完了すると、パーソナライズウィジェット詳細画面では下記の設定内容を確認することができます。

図:パーソナライズウィジェット詳細画面

３.職種別

パターン４：２つのコンテンツを作成し、どちらのコンテンツが営業担当者の反応がいいかテストしたい

①リード基本項目で「職種」に関する項目をプルダウン形式で作成し、選択肢に「営業」を含める。

②「ウィジェットターゲット登録」画面で、下記のウィジェットターゲットを作成する。

対象範囲	項目	項目名	条件	値
リードのみ	リード	①で作成した「職種」	次の値を選択している	営業

③「検索対象ブロックの追加」で、[AND]・[リード]を選択して、リードブロックを追加する。

図:検索対象ブロックの追加

④下記のようにリードブロックを追加設定し、登録する。

対象範囲	項目	項目名	条件	値
リードのみ	リード	リードID	偶数	-

⑤上記②～④と同様の手順にしたがって、下記ウィジェットターゲットを作成する。

対象範囲	項目	項目名	条件	値
リードのみ	リード	①で作成した「職種」	次の値を選択している	営業
リードのみ	リード	①で作成した「性別」	奇数	-

⑥④と⑤で作成した２つのウィジェットターゲットをテスト対象のウィジェットパーツにそれぞれ紐づける。

4.行動属性

パターン5：アクセス回数が1回の人と、リピーターでコンテンツを出し分けたい。

①「ウィジェットターゲット登録」画面で、下記のウィジェットターゲットを作成する。

対象範囲	項目	項目名	条件	値
両方（※1）	トラッキング	アクセス回数	次の値と一致する	1

（※１）項目が「トラッキング」の場合は対象範囲は「匿名のみ」「両方」を指定することが可能です。

詳しくは下記FAQをご参照ください。

②「検索対象ブロックの追加」で、[AND]・[リード]を選択して、リードブロックを追加する。

図:検索対象ブロックの追加

③下記のようにリードブロックを追加設定し、登録する。

対象範囲	項目	項目名	条件	値
両方	リード	リードID	偶数	-

④上記②～③と同様の手順にしたがって、下記ウィジェットターゲットを作成する。

対象範囲	項目	項目名	条件	値
両方	トラッキング	アクセス回数	＞	１
両方	リード	リードID	奇数	-

⑤④と⑤で作成した２つのウィジェットターゲットをテスト対象のウィジェットパーツにそれぞれ紐づける。

実行結果

1.[WEB]タブ＞サイドメニューの[パーソナライズドウィジェット]をクリックし、パーソナライズドウィジェットの一覧ページが表示されたら、アクセス状況を見たいパーソナライズドウィジェットの[詳細]をクリックします。

図:パーソナライズドウィジェット画面

2.パーソナライズドウィジェット詳細画面が表示されたら、一番下にあるブロック[使用中ウィジェットパーツ]を確認します。

各項目の意味については以下のとおりになります。

図:使用中ウィジェットパーツ

項目	内容
ウィジェットパーツID	ウィジェットパーツのIDです。システムが自動で発番します。
ウィジェットパーツ名	管理者が任意で命名することができるウィジェットパーツの名前です。
用途	ウィジェットパーツの用途です。「ポップアップ」か「埋め込み」のいずれかになります。
種別	ウィジェットパーツの種別です。「HTMLページ」または「申込フォーム」のいずれかになります。
有効	ウィジェットパーツが表示されるかどうかのステータスが表示されます。リンクをっクリックすることで有効・無効を切り替えることができます。編集でウィジェットパーツの紐付けを外すことができますが、外した場合はこの一覧の実績に表示されなくなりますので、ご注意ください。
表示回数	そのウィジェットパーツを表示した回数です。
表示者数	そのウィジェットパーツを表示した人数です。
表示リード数	そのウィジェットパーツを表示したリード数です。
URLクリック数	（HTMLページのみ）HTMLページにURLリンクがあった場合、そのURLリンクをクリックした回数です。
URLクリック者数	（HTMLページのみ）そのウィジェットパーツのURLリンクをクリックした人数です。
URLクリックリード数	（HTMLページのみ）そのウィジェットパーツのURLリンクをクリックしたリード数です。
申込数	（申込フォームのみ）そのウィジェットパーツから申込が行われた回数です。
申込者数	（申込フォームのみ）そのウィジェットパーツから申込が行われたリード数です。

3.「レポート期間」を入力し、適用ボタンをクリックすることで、表示回数や表示リード数などの集計項目について指定した期間の実績に絞り込にで表示させることが可能です。

初期状態では全期間の実績が集計されています。

注意事項

・本機能はトラッキング機能の有効化を前提としております。

トラッキング機能が有効化されていない場合、ウィジェットターゲットによる表示のコントロールは無効化し、すべてのWeb訪問者にパーソナライズドウィジェットで設定した内容でコンテンツが表示されます。

・トラッキング機能が有効化された状態であっても、ウィジェットタグを反映させるページにトラッキングjsが適用されていない場合はトラッキング機能無効時と同様にすべてのWeb訪問者にパーソナライズドウィジェットで設定した内容でコンテンツが表示されます。

・ウィジェットターゲットを新規登録または編集した場合、その設定した内容でパーソナライズドウィジェットの表示制御が行われるまで数分～最大数十分程度のタイムラグが発生します。 + ・対象範囲のみを指定して、対象条件を指定しない場合、全匿名や全アクセス者を指定することができます。

2-1. デザインテンプレートをダウンロードする

個別キャンペーンまたは全キャンペーン管理画面のテンプレートをダウンロードします。

テンプレート一覧画面から、最新登録日時の[ダウンロード]リンクをクリックします。テンプレートが何も登録されていない場合は、[デフォルトダウンロード(seminar.zip)]ボタンをクリックします。

■全キャンペーン画面から取得・登録「システムテンプレート=system.zip」

　[WEB]≫[テンプレート変更]メニュー ≫「ダウンロード」または「新規登録」

図1:システムテンプレートのダウンロード

■個別キャンペーン画面から取得・登録「キャンペーンテンプレート=seminar.zip」

　[キャンペーン]≫[キャンペーンテンプレート変更]メニュー ≫「ダウンロード」または「新規登録」

図2:キャンペーンテンプレートのダウンロード

MEMO≫ 「デフォルトダウンロード」とは何か？

図3:[デフォルトダウンロード]ボタン

キャンペーンテンプレートの「デフォルトダウンロード」を使うと、登録されているシステムテンプレートの中から、キャンペーンに関連する画面のみ取得してくることができます(=SMPに登録されているシステムテンプレートの"seminar_base"フォルダ。seminar_baseフォルダについてはページ「1-1.デザインテンプレートの構成を知ろう」の見出し「1-5. デザインテンプレートのフォルダ構成」を参照)。
システムテンプレートの「デフォルトダウンロード」は古いデザインのテンプレートが取得されますので、基本的には使用しないでください。

2-2. 修正したい画面のHTMLファイルパスを確認する

■テンプレートパスの表示方法

管理画面から来場側詳細WEBページ（「プレビュー画面」とも呼ぶ）にアクセスします。

図4:[来場側詳細WEBページ]リンク

画面左上にポップアップが出ます。その中にある「テンプレートパスの表示」をON にしてください。

▽テンプレートパスの表示 OFF

図5:テンプレートのパスの表示：OFF

▽テンプレートパスの表示 ON

図6:テンプレートのパスの表示：ON

■テンプレートパスの見方

ページのなかで修正したい箇所のすぐ上に表示されている「テンプレートパス」で指定されたHTMLファイルを修正します。

（例）テンプレートパスが以下の指定されている場合

seminar_base/application/application_flow_master_id/user_enquete/index.html

それぞれのテンプレートから、以下のファイルを確認します。

◇システムテンプレート(system.zip)

system￥seminar_base￥application￥application_flow_master_id￥user_enquete￥index.html

◇キャンペーンテンプレート(seminar.zip)

seminar￥application_flow_master_id￥user_enquete￥index.html

▽デスクトップに置いたキャンペーンテンプレート("seminar"フォルダ内の該当HTMLファイル)

図7:キャンペーンテンプレート内の該当HTML

MEMO≫ テンプレートパスが消えない場合

稀に「テンプレートパスの表示 OFF」をクリックしても、テンプレートパスが消えない場合があります。
これを解消するには、「管理者ページに戻る」で管理画面に戻ります。

[設定]≫[システム設定一覧]メニュー≫[キャッシュクリア]ボタン(ページ最下部)をクリック

サーバーのキャッシュが残っていることが原因です。このボタンをクリックすることで、サーバーのキャッシュをクリアすることができます。
上記を行うと、すべてのページのキャッシュがクリアされます。そのため、お客様への影響の少ない時間帯に実施しましょう。

図8:[キャッシュクリア]ボタン

2-3. HTMLファイルを修正する

テキストエディタを使い、該当のHTMLファイルを修正してください。

2-4. デザインテンプレートを圧縮し、アップロードする

ZIP形式に圧縮し、[新規登録]ボタンから更新します。

図9:デザインテンプレートのアップロード

MEMO≫新規登録時にエラー「設定ファイル(Config.yaml)のフォーマットが違います。」が出る場合

デザインテンプレートは、誤って別のキャンペーンに登録されたり、別のSMPドメインに登録されたりすることを防ぐため、config.yamlというファイルを含んでいます。このファイルに記載されたドメイン名やキャンペーンIDと異なるドメイン・キャンペーンにアップロードしようとすると、エラーとなります。

config.yaml

Url: https://***.jp/
SeminarId: ***

特にキャンペーンコピーにより作成されたキャンペーンでは、config.yamlに記載のキャンペーンIDがコピー元キャンペーンのIDであるため、IDが一致せずエラーが発生します。エラーが発生した場合は、適用されるキャンペーンのキャンペーンIDに変更しましょう。

2-5. 修正した画面を確認する

反映結果を確認してください。

※確認方法は「2-2. 修正したい画面のHTMLファイルパスを確認する」参照

MEMO≫デザインテンプレートを適用したにもかかわらず、Webページに反映されない場合

以下を実施してください。

(1)ブラウザのキャッシュクリア

(2)SMPのシステム設定一覧画面最下部の[キャッシュクリア]ボタンをクリック(ボタンの場所は「2-2. 修正したい画面のHTMLファイルパスを確認する」参照)

(3)相対パスの正誤確認（前ページ「1-6. 画像・CSS・jsの編集方法」≫「ファイルパス(相対パス)の指定方法」を参照）

デザインテンプレート設定方法利活用ご利用ガイド

2. デザインテンプレートの利用手順を知ろう

この記事では、Webパーソナライズ機能のポップアップが表示されない時の原因（エラー）の詳細と、対処方法についてご説明します。

1．ポップアップが表示されない原因

Webパーソナライズ機能によるポップアップが表示されない原因は、大きく分けて３つあります。

[ポップアップが表示されない原因]

システム設定（外部ドメイン設定）が正しく行われていない
ポップアップを表示するターゲット設定が正しく行われていない。または、ターゲットの条件に一致していない
埋め込みフォーム設定が正しく行われていない。（ウィジェットパーツの用途「埋め込み」のみ）または、埋め込みフォーム設置先ページ設計による影響

2．原因（エラー）を調べる方法

ポップアップが表示されない原因（エラー）は、各ブラウザに搭載されている開発者ツール/デベロッパーツールを利用して確認することができます。

Microsoft Edge の場合

対象のページを表示し、 [F12] を押して「開発者ツール」を表示します。
「コンソール」タブをクリックしてエラーコード等を確認します。

Google Chrome の場合

対象のページを表示し、 [Ctrl]+[Shift]+[i] を押して「デベロッパーツール」を表示します。
「Console」タブをクリックしてエラーコード等を確認します。

Mozilla Firefox の場合

対象のページを表示し、 [Ctrl]+[Shift]+[i] を押して「開発ツール」を表示します。
「コンソール」タブをクリックしてエラーコード等を確認します。

図１：Google Chrome デベロッパーツール画面イメージ

3.原因（エラー）の種類

上記、調査により、下記のようなエラーが出ていないか確認します。

説明	エラーコード名、原因	対処方法
(1).リクエストを受け付ける外部ドメインの表記が誤っている	[SMP Widget Info]EF103 : ERROR_SERVICE_UNAVAILABLE	4.対処方法を参照ください
(2).ウィジェットターゲットの条件に合致していない。 CASE1：トラッキング同期されていない CASE2：トラッキング同期されているが、設定したウィジェットターゲットの条件に合致していない CASE3：ウィジェットターゲットの対象範囲を「両方」かつ、ターゲットの検索条件で「リード」「リスト」情報を設定している	[SMP Widget Info]EF106 : ERROR_NOT_FOUND_WIDGET : {"error":"WW204: ERROR_TARGET_UNMATCH"}
(3).初回訪問時、トラッキングが同期されていない	[SMP Widget Info]EF106 : ERROR_NOT_FOUND_WIDGET
(4).埋め込みフォーム設定・デザインによる影響 CASE1：埋め込みフォーム設定が正しく行われていない CASE2：埋め込みフォーム設置先のWEBページのデザインによる影響	その他、埋め込みフォーム設定・タグ、設定先カスタマイズによる影響

トラッキング同期について
トラッキング(tracking)とは、リードがサイト内でどこを閲覧しているのかを追跡、分析することで、トラッキング同期は、リードデータとこれまでアクセスされたアノニマストラッキングデータを関連づけることを指します。

トラッキング同期されるタイミングは、下記マニュアルをご参照ください。
[ユーザマニュアル]トラッキング同期

4．対処方法

(1).リクエストを受け付ける外部ドメインの表記が誤っている

エラーコード名：[SMP Widget Info]EF103 : ERROR_SERVICE_UNAVAILABLE

対処方法

埋め込みフォームを設定する際、システム設定一覧画面（[設定] > [システム設定一覧]）より、「リクエストを受け付ける外部ドメイン」を設定する必要があります。

全キャンペーン一覧＞サイドメニュー：設定＞システム設定一覧

図２：リクエストを受け付ける外部ドメインの設定

この時のドメイン指定でURL末尾が”/”（スラッシュ）で終わっている場合、
[SMP Widget Info]EF103 : ERROR_SERVICE_UNAVAILABLEエラーとなります。

必ず、下記の（正）の状態で設定するようにしてください。

全キャンペーン管理＞サイドメニュー：設定>システム設定一覧＞編集

リクエストを受け付ける外部ドメイン
（誤）https://example.co.jp/
（正）https://example.co.jp

(2).ウィジェットターゲットの条件に合致していない

エラーコード名：[SMP Widget Info]EF106 : ERROR_NOT_FOUND_WIDGET : {"error":"WW204: ERROR_TARGET_UNMATCH"}

CASE1：トラッキング同期されていない

対処方法

ウィジェットターゲットの対象範囲を「リードのみ」や「両方（匿名およびリード）」にしている場合、ポップアップを表示する前に、リードデータとトラッキングデータは同期されている必要があります。トラッキングが同期されていないと、システムがリードを特定できず、ポップアップの表示対象者か判定することができません。

例えば、トラッキングタグが埋め込まれたページに訪問後、
ウィジェットタグを表示させるページに訪問してもらう等（トラッキング同期）のように、ポップアップを表示させる前に、リードデータとトラッキングデータを関連づけておく必要があります。

トラッキング同期される条件については、以下のマニュアルをご確認下さい。

CASE2：トラッキング同期されているが、設定したウィジェットターゲットの条件に合致していない

対処方法

設置したパーソナライズドウィジェットを表示させるためのウィジェットターゲットの検索条件を確認して条件に間違いがないか確認します。

ウィジェットターゲットの詳細は、以下のマニュアルをご確認下さい。

CASE3：ウィジェットターゲットの対象範囲を「両方」かつ、ターゲットの検索条件で「リード」「リスト」情報を設定している

対処方法

ウィジェットターゲットの検索条件に「リード」「リスト」情報を設定している場合、ターゲット範囲「両方」に含まれる匿名もリード情報が必要となります。
しかし、匿名はシステム上にリードやリスト情報はないため、ターゲットの条件にマッチせずにエラーとなります。

上記のような場合は、ウィジェットターゲットを「リードのみ」と「匿名のみ」にそれぞれ分けて一つずつ作成、設定して、それぞれウィジェットパーツを用意します。

「リードのみ」、「匿名のみ」に分けて設定をする例

全キャンペーン管理＞サイドメニュー：WEB>ウィジェットターゲット＞編集

　図３：変更前

図４：変更後

2つのターゲットを用意したら、それぞれにウィジェットパーツを設定してパーソナライズドウィジェットに登録します。

これにより匿名のみの場合、パーツ1が表示され、リードのみの場合、パーツ2が表示される設定となります。

図５：使用中ウィジェットパーツ確認画面

(3).初回訪問時、トラッキングが同期されていない

エラーコード名：[SMP Widget Info]EF106 : ERROR_NOT_FOUND_WIDGET

対処方法

こちらも(1).リクエストを受け付ける外部ドメインの表記が誤っていると同様、トラッキングが同期されていない場合のエラーです。ウィジェットターゲットの対象範囲を「リードのみ」や「両方（匿名およびリード）」にしている場合、ポップアップを表示する前に、リードデータとトラッキングデータは同期されている必要があります。トラッキングが同期されていないと、システムがリードを特定できず、ポップアップの表示対象者か判定することができません。

トラッキング同期される条件については、以下のマニュアルをご確認下さい。

(4).埋め込みフォーム設定・デザインによる影響

CASE1：埋め込みフォーム設定が正しく行われていない

対処方法

ウィジェットパーツで設定された埋め込みフォームが表示できない場合、パーソナライズドウィジェット機能のポップアップフォーム/埋め込みフォームも表示することができません。表示するための設定は、埋め込みフォームを利用するをご確認ください。

CASE2：埋め込みフォーム設置先のWEBページのデザインによる影響

対処方法

埋め込みフォーム設置先のWEBページのデザインによっては、埋め込みフォームが正しく表示されない可能性があります。
そのため、埋め込みフォーム設置先のWEBページのデザイン調整を行っていただく必要があります。

具体的な調整内容としては、埋め込みフォームの出力タグに定義されているclass名をベースに、設置ページのスタイル作成・管理方法にあわせて CSS 等の調整を行ってください。

詳細は、下記マニュアルをご参照ください。

注意点

埋め込みフォーム機能では、WordPressなどCMSでの動作保障のサポートは行っておりません。ご自身の環境にて検証を行っていただき、意図通りの表示が行われるかご確認いただいた上でご利用いただきますようお願いいたします。

５．関連コンテンツ

表示ポップアップ FAQ エラー原因

WEBパーソナライズ機能のポップアップが表示されない原因と対処方法

ここでは、デザインテンプレートを変更方法を身につけるための課題を紹介させていただきます。

3-1. 【課題】申込確認画面≫カート編集/削除

無料のセミナーを開催するときに参加費を表示したくない、またはそもそも申込内容は表示させず、申込者情報だけ表示させれば良い、という場合を想定します。下記のafterのように、申込内容（「カート」と呼ぶ）から「参加費」を削除、また、「お申込内容」を削除してみましょう。

▽before

図1:お申込内容

▽after1: 「お申込内容」≫「参加費」欄を削除

図2:お申込内容の編集

▽after2: 「お申込内容」を削除

図3:お申込内容の削除

3-2. 【課題】キャンペーン詳細画面≫キャンペーン追加項目の表示

キャンペーン詳細画面に表示させる項目として、新たに「後援」という情報を追加する場合を想定します。なお、手順としてはキャンペーン項目として「後援」を新たに追加し、その項目に対応する変数をHTMLに記載する必要がありますが、これら項目追加および変数確認の方法は本項で後述します。

▽before:「後援」という項目がない状態

図4:キャンペーン詳細

▽after: 「後援」という項目がある状態

図5:キャンペーン詳細に後援を追加

MEMO≫ キャンペーン項目「後援」の追加方法

[キャンペーン]≫[項目追加]メニュー≫[新規登録]ボタン

から追加してください(新規登録画面で設定する「表示/非表示」は「表示」を選択)。

図6:キャンペーンの項目追加

MEMO≫ 追加した項目に対応する変数の確認方法

テンプレートの登録画面から[システムテンプレート変数簡易一覧]ボタンをクリックし、設定項目と変数の対応表をダウンロードしてください(以下はシステムテンプレートの図だが、キャンペーンテンプレートの場合も同様)。

図7:[システムテンプレート変数簡易一覧]ボタン

3-3. 【課題】キャンペーン詳細画面≫申込ボタンの変更

アンケートフォームを作るため、キャンペーン詳細画面からフォームに遷移させるためのボタンを、「申込」ボタンから「回答」ボタンに変更します。

▽before

図8:[申込]ボタン

▽after

図9:[申込]ボタンから[回答]ボタンへ変更

MEMO≫ 変数のファイルパスへの利用（「回答」ボタン画像のありか）

「申込」ボタン/「回答」ボタンとして、画像が標準で用意されています。これらの画像のファイルパスについて補足します。

申込ボタンのファイルパスを見ると、下記のようになっています。

seminar_base/application/application_flow_master_id/application_button_at_seminar_view/
application_link.html

さらに、application_link.htmlの中身を見ると、ボタンのファイルパスが下記のように記載されており、btn_form_o.gifを読み込んでいることが分かります。

<input type="image" src="__base_seminar_path__/shared/themes/$FORM{theme}/img/btn_form_o.gif" 
alt="申込" onclick="location='/public/application/add/$FORM{id}'" >

この「$FORM{theme}」が分かれば、テンプレートのフォルダ階層が分かり、画像の置き場所を探すことができます。

下記GIFのように画像のアドレスを見ると、この$FORM{theme}の箇所には"skyblue"が格納されていることが分かります。

図10:画像置き場の確認方法

以下の階層で探せば画像ファイルが見つかります

shared￥themes￥skyblue￥img￥btn_form_o.gif

※$FORM{theme}はSMPの公開画面のテーマカラーの設定であり、以下「ヘッダーフッター編集」画面で設定可能です。設定するとどうなるか、ぜひ試してみてください。

図11:テーマカラーの変更

編集設定方法申込フォームご利用ガイド

3. デザインテンプレートを変更してみよう課題編

ウィジェットターゲット登録画面で対象範囲を「匿名のみ」に設定した場合も、

対象条件を設定する必要があります。

「匿名のみ」の条件設定ポイント

ターゲットの対象は「匿名のみ」「リードのみ」「両方（匿名およびリード）」のいずれかから選択することができます。

検索条件は、「トラッキング」「リード」「リスト」のブロックから設定することが可能ですが、匿名者はSMP上で管理されていないので、「リード」「リスト」情報を持ちません。

また、「両方（匿名およびリード）」を選択した場合でも、「匿名」が含まれるので、同じく「リード」や「リスト」で検索条件の設定を行った場合、条件を満たすことができない可能性があります。

そのため、「匿名のみ」が含まれる場合は、「トラッキング」情報をターゲットの検索条件として指定することを推奨します。

トラッキング指定では以下の項目を条件として利用可能です。

「訪問日時」
「URL」
「アクセス回数」

「匿名のみ」を選択した場合の条件設定手順

サイドメニューより、[WEB]＞[ウィジェットターゲット]をひらきます。
ウィジェットターゲット画面の右側にある「新規登録」をクリックします。
ウィジェットターゲット登録画面に遷移したら、対象範囲を「匿名のみ」に選択します。
▼図1：ウィジェットターゲット登録画面
リードブロックを削除し、トラッキングブロックを追加します。
▼図２:トラッキングブロックの追加
[項目名]、[条件]、[値]を下記のように設定し、「登録」をクリックします。

項目名

条件

値

訪問日時

・今日

・昨日

・今週

・先週

・今月

・先月

・次の日数以内

・次の日数以前

・日付指定（この日付から）

・日付指定（この日付まで）

日付形式で値を記入

URL

・次の文字列と一致する

・次の文字列と一致しない

・次の文字列で始まる

・次の文字列で終わる

・次の文字列を含む

・次の文字列を含まない

URL形式で値を記入

アクセス回数

・次の値と一致する

・次の値と一致しない

・＜

・＞

・＜＝

・＞＝

・奇数

・偶数

数字形式で値を記入

4-1．【課題】申込確認画面≫カート編集/削除

STEP1：デザインテンプレートをダウンロードする

テンプレート一覧画面で最新登録日時の[ダウンロード]リンクをクリックします。テンプレートが登録されていない場合は、[デフォルトダウンロード(seminar.zip)]ボタンをクリックします。

ダウンロードされたZIPファイルは解凍しておきます。

図1:デザインテンプレートのダウンロード

STEP2：修正したい画面のHTMLファイルパスを確認する

今回はカートのすぐ上に表示された3つのパスが対象です。

seminar_base/application/application_flow_master_id/confirm/cart.html

seminar_base/application/application_flow_master_id/confirm/cart_record.html

seminar_base/application/application_flow_master_id/confirm/cart_sum.html

※キャプチャでは管理画面(テンプレート一覧)≫管理画面(キャンペーン詳細)≫キャンペーン詳細画面≫フォーム入力画面≫フォーム確認画面≫カート関連パス選択...と操作しています。

図2:修正したい画面のHTMLファイルパスを確認

STEP3：HTMLファイルを修正する

「STEP1」で展開しておいたフォルダ/ファイルをテキストエディタで開きます。事前に編集するファイルをコピーしておきます。(例)cart.html→cart_bkup.html

①まずはカートのテーブルの一行目三列目「参加費」のヘッダーを削除します

seminar_base/application/application_flow_master_id/confirm/cart.html

図3:カートのテーブルの<th>参加費</th>を削除

②カートのテーブルの二行目三列目「***円」のセルを削除します。

seminar_base/application/application_flow_master_id/confirm/cart_record.html

図4:カートのテーブルの<td>$FORM{unit_price}円</td>を削除

③カートのテーブルの三行目をすべて削除します。

seminar_base/application/application_flow_master_id/confirm/cart_sum.html

図5:カートのテーブルの三行目を削除

MEMO≫ テンプレート編集のシミュレーション

SMPの機能ではありませんが、ブラウザの開発者コンソール(F12ボタン)を使えば、HTMLのどの箇所を編集するとページがどう変わるかのシミュレーションができます。

図6:テンプレート編集のシミュレーション

STEP4：デザインテンプレートを圧縮し、アップロードする

図7:デザインテンプレートの圧縮(zip)、アップロード

STEP5：修正した画面を確認する

図8:来場側詳細WEBページから編集した画面を確認

もし反映されない場合、ブラウザのキャッシュクリア、システム設定のキャッシュクリアをお試しください。

4-2．【課題】キャンペーン詳細画面≫キャンペーン追加項目の表示

事前準備1：キャンペーン項目「後援」の追加

(全キャンペーン)[キャンペーン]≫[項目追加]メニュー≫[新規登録]ボタン

キャンペーン項目「後援」を追加し、キャンペーンの詳細設定で該当の項目に値を登録します。

図9:キャンペーン項目の追加と該当項目の値を入力

事前準備2：追加した項目に対応する変数の確認

[キャンペーン]≫[キャンペーンテンプレート変更]メニュー≫[テンプレート変数簡易一覧]ボタン

図10:テンプレートの変数一覧から項目変数の確認

STEP1：デザインテンプレートをダウンロードする

テンプレート一覧画面で最新登録日時の[ダウンロード]リンクをクリックします。テンプレートが登録されていない場合は、[デフォルトダウンロード(seminar.zip)]ボタンをクリックします。

ダウンロードされたZIPファイルは解凍しておきます。

図11:デザインテンプレートのダウンロード

STEP2：修正したい画面のHTMLファイルパスを確認する

以下のHTMLがキャンペーンの詳細情報を直接出力していることを確認します。

seminar/preview.html

図12:修正したい画面のHTMLファイルパスを確認

STEP3：HTMLファイルを修正する

「事前準備2：追加した項目に対応する変数の確認」で分かった変数をテンプレートに埋め込みます。

図13:テーブルの<tr></tr>を追加、項目名と変数を編集

STEP4：デザインテンプレートを圧縮し、アップロードする

図14:デザインテンプレートの圧縮(zip)、アップロード

STEP5：修正した画面を確認する

図15:来場側詳細WEBページから編集した画面を確認

4-3．【課題】キャンペーン詳細画面≫申込ボタンの変更

STEP1：デザインテンプレートをダウンロードする

テンプレート一覧画面で最新登録日時の[ダウンロード]リンクをクリックします。テンプレートが登録されていない場合は、[デフォルトダウンロード(seminar.zip)]ボタンをクリックします。

ダウンロードされたZIPファイルは解凍しておきます。

図16:デザインテンプレートのダウンロード

STEP2：修正したい画面のHTMLファイルパスを確認する

以下のパスでボタンを出力していることを確認します。

application/application_flow_master_id/application_button_at_seminar_view/application_link.html

また、このボタンはCSSではなく画像(gif)で作られていることから、画像を差し替えることで変更できることが分かります。

https://(ドメイン名)/static/upload/(ドメイン名)/seminar/(キャンペーンID)/shared/themes/skyblue/img/btn_form_o.gif

図17:画像置き場の確認方法

STEP3：HTMLファイルを修正する

①HTMLファイルを確認する

HTMLファイルを見ると以下のようなコードで画像が出力されていることが分かります。

<input type="image" src="__base_seminar_path__/shared/themes/$FORM{theme}/img/btn_form_o.gif" 
alt="申込" onclick="location='/public/application/add/$FORM{id}'" >

この"btn_form_o.gif"を別ファイルの画像名に変更すれば画像が差し替わります。

図18:HTMLファイルから画像を確認

この画像のパスの「$FORM{theme}」部分ですが、STEP2で画像のURLを確認したとおり「skyblue」が入るので、「skyblue」≫「img」フォルダからこの「申込」ボタンに代わる「回答」ボタンの画像を探しましょう。

https://(ドメイン名)/static/upload/(ドメイン名)/seminar/(キャンペーンID)/shared/themes/skyblue/img/btn_form_o.gif

「回答」ボタンを見つけたら、HTMLのパスをその画像名に書き替えます。

図19:HTMLのパスを画像名に変更

STEP4：デザインテンプレートを圧縮し、アップロードする

図20:デザインテンプレートの圧縮(zip)、アップロード

STEP5：修正した画面を確認する

図21:来場側詳細WEBページから編集した画面を確認

編集設定方法申込フォームご利用ガイド

4. デザインテンプレートを変更してみよう回答編

デザインテンプレートをアップロードするカスタマイズしたデザインテンプレートをSMPにアップロードします。補足定期的にユーザ様向けのトレーニングを実施しております。カスタマイズが難しい場合は、弊社でデザインテンプレートカスタマイズサービスを有償でご提供しております。また、専用のトレーニング実施も有償にて実施しています。有償サービスをご希望の場合は、弊社担当者もしくはカスタマーサポートまでお問合せください。デザインテンプレートをアップロードする方法は、次のとおりです。テンプレート画面の[新規登録]ボタンをクリックして、カスタマイズしたsystem.zipをアップロードしますテンプレートの登録情報を指定します補足「ファイル名」はアップロードしたファイル名が自動で挿入されますが、改めてファイル名を変更することもできます。[登録]ボタンをクリックしますテンプレート一覧画面にテンプレートが表示（登録）されていることを確認します注意■共通の注意事項・「system」や「seminar」といったフォルダ名と圧縮したZIPファイル名に使用できる文字は半角の英数字、半角記号です。・フォルダ名・ファイル名は、ダブルバイト不可です（半角英数字のみ）のでご注意ください。・解凍する際に、使用するソフトによっては、自動的に「system」などのフォルダの中に展開するものもあります。登録用の圧縮ファイルを作る際は、下の図を参考に、フォルダの階層に注意してください。■システムテンプレート（system.zip）をアップロードする前の注意事項システムテンプレートをアップロードする際はConfig.yamlファイルのURLがテンプレートを割り当てるドメイン名になっているかを確認します。確認ファイルは、「Config.yamlファイルConfig.yamlファイル内」です。■キャンペーンテンプレート（seminar.zip）をアップロードする前の注意事項キャンペーンテンプレートをアップロードする際はConfig.yamlファイルのseminarIDがテンプレートを割り当てるキャンペーンのIDである必要があります。キャンペーンIDは、全キャンペーンモード、キャンペーンメニュー、一覧の該当キャンペーンの「プレビュー」リンクにカーソルを合わせた際にウィンドウ下に表示されるURLの末尾番号となります。確認ファイルは、次の2箇所です。・「Config.yamlファイルConfig.yamlファイル内」・全キャンペーンモード「キャンペーン」一覧の該当キャンペーンの「プレビュー」リンク

https://smpdoc.shanon.co.jp/ja/web/systemtemplate/chapter003/

設定方法登録/更新ユーザーマニュアルテンプレート変更

デザインテンプレートをアップロードする

テンプレートを確認するシステム全体またはキャンペーン全体にテンプレートを適用することで、サイトのデザイン変更をすることができ、自社サイトにあわせたりお好みのWebやフォームデザインにすることが可能です。システム立ち上げ時は弊社デフォルトテンプレートが反映されています。補足・テンプレートとは、システムが利用するHTML、CSS、Javascriptの集合です。・デザインテンプレートには、環境全体の基盤となるシステムテンプレート（system.zip）と個別キャンペーンの中だけに影響させる際に使用するキャンペーンテンプレート（semina.zip）があります。詳細は「デザインテンプレートの種類」ページをご参照ください。テンプレート一覧画面を確認するテンプレートを新規登録するテンプレートのデフォルトテンプレートをダウンロードするテンプレートの変数簡易一覧を確認するテンプレートを該当バージョンに戻すアップロードされたことのあるテンプレートをダウンロードするテンプレート一覧画面を確認するシステムテンプレートの一覧を確認するには、次のとおりです。項目の詳細は、次のとおりです。No項目説明1新規登録システムテンプレートを新規登録します。詳細は「デザインテンプレートをアップロードする」ページもご参照ください。2デフォルトダウンロード(system.zip)システムテンプレートを作成するためのデフォルトテンプレートとなるsystem.zipをダウンロードすることができます。詳細は「テンプレートのデフォルトテンプレートをダウンロードする」をご参照ください。3システムテンプレート変数簡易一覧テンプレートのカスタマイズ時に利用できる各項目の変数（$FORM）と利用できるフォーム画面の一覧です。詳細は「テンプレートの変数簡易一覧を確認する」をご参照ください。4このバージョンに戻す該当テンプレートのテンプレートバージョンに戻します。詳細は「テンプレートを該当バージョンに戻す」をご参照ください。5ダウンロード該当テンプレートをダウンロードします。詳細は「アップロードされたことのあるテンプレートをダウンロードする」テンプレートを新規登録するテンプレートを新規で作成し登録します。テンプレートの登録方法は「デザインテンプレートをアップロードする」ページをご参照ください。テンプレートのデフォルトテンプレートをダウンロードするテンプレートのデフォルトテンプレートをダウンロードします。デフォルトテンプレートとはカスタマイズする前のシステムで保持しているテンプレートを指します。デフォルトダウンロード方法は、次のとおりです。テンプレート変更画面（[WEB][テンプレート変更]）に遷移します[デフォルトダウンロード(system.zip)]ボタンをクリックしますダウンロードしたzipファイルより、フォルダ内をカスタマイズしますテンプレートの変数簡易一覧を確認するテンプレートのカスタマイズ時に利用できる各項目の変数（$FORM）と利用できるフォーム画面の一覧をダウンロードすることができます。変数一覧の確認方法は、次の通りです。テンプレート変更画面（[WEB][テンプレート変更]）に遷移します[システムテンプレート変数簡易一覧]ボタンをクリックしますダウンロードしたファイルより、利用できる各項目の変数（$FORM）とその利用可能なフォーム画面を確認しますテンプレートを該当バージョンに戻す該当テンプレートのテンプレートバージョンに戻します。履歴の最上位に位置しているテンプレートが最新であり、システムに反映されているテンプレートです。該当テンプレートバージョンに戻す方法は、次のとおりです。テンプレート変更画面（[WEB][テンプレート変更]）に遷移します戻したいテンプレートの[このバージョンに戻す]リンクをクリックしますテンプレート一覧画面の最上位に移動されている（=テンプレートが反映されている）ことを確認しますアップロードされたことのあるテンプレートをダウンロードする過去にアップロードされたことのあるテンプレートを再利用してテンプレートの編集ができます。テンプレートを画面上で確認することができるのは、直近アップロードされたテンプレート3件までです。テンプレート変更画面（[WEB][テンプレート変更]）に遷移します再利用したいテンプレートの[ダウンロード]リンクをクリックします

https://smpdoc.shanon.co.jp/ja/web/systemtemplate/chapter001/

操作方法確認ユーザーマニュアルテンプレート変更

テンプレートを確認する

SMPに管理者ログインした状態で申込み画面を表示した際、テンプレートパスが表示されない原因は「ファイルパスの表示がOFF」「カスタマイズCSSの影響」のいずれかが考えられます。本記事では、それぞれの対処方法を説明します。

1．原因

テンプレートのファイルパスが表示されない原因は、大きく分けて２つあります。

ファイルパスの表示がOFFになっている
ファイルパスの表示用タグがCSSの影響で画面上に見えない

2．対処方法

２.１. テンプレートパスの表示がOFFになっている場合

テンプレートパスの表示を、OFFからONに切り替えます。

全キャンペーン管理モード（青画面）＞サイドメニュー：キャンペーン＞一覧リンク

全キャンペーン管理モードの[キャンペーン]タブ>対象のキャンペーン>プレビューをクリックします。
申込画面が表示されます。
画面左上に表示される枠内の「テンプレートパスの表示」項目を確認します。
OFFになっている場合、「切り替え」をクリックし、「ON」にします。

図２：テンプレートパスの表示切り替えイメージ

２.２. ファイルパスの表示用タグがCSSの影響で画面上に見えない

表示用タグには「template-layout」という「id名」が付与されています。
この表示用タグが、HTMLソースに記載されているか確認してください。

図３：セミナープレビューのページでの表示タグ確認イメージ

HTMLソースに記載されている場合、テンプレートカスタマイズを行った際に追加したCSSの影響を受けている可能性が高いと考えられます。シャノンの担当営業もしくは、テンプレートのカスタマイズを行った企業様へお問い合わせください。

＜HTMLソース表示方法＞
Microsoft Edge の場合

対象のページを表示し、 [F12] を押して「開発者ツール」を表示します。
「要素」タブをクリックします。
左上のメニューからテンプレートパスの表示:ONにします。
「template-layout」というid名の要素がソースに追加されたか確認します。

Google Chrome の場合

対象のページを表示し、 [Ctrl]+[Shift]+[i] を押して「デベロッパーツール」を表示します。
「要素」タブをクリックします。
左上のメニューからテンプレートパスの表示:ONにします。
「template-layout」というid名の要素がソースに追加されたか確認します。

Mozilla Firefox の場合

対象のページを表示し、 [Ctrl]+[Shift]+[i] を押して「開発ツール」を表示します。
「インスペクター」タブをクリックします。
左上のメニューからテンプレートパスの表示:ONにします。
「template-layout」というid名の要素がソースに追加されたか確認します。

3．関連コンテンツ

ファイル表示 FAQ エラー原因

テンプレートのファイルパスが表示されない原因と対処方法について

申込画面で「次へ」ボタンをクリックしても、入力画面から確認画面へ遷移しない原因の一つとして、デザインテンプレート内に必要な記述が入っていない可能性があります。

1.原因

デザインテンプレート修正の際に、申込入力画面の入力、確認画面のindex.htmlファイル内にある下記$FORMをコメントアウト、または削除している場合、申込み画面の「次へ」ボタンをクリックしても、入力画面から確認画面へ遷移しません。

$FORM	説明
$FORM{Common.all_vars}	クロスサイトリクエストフォージェリ（CSRF）対策のために用意された弊社独自のデザインテンプレート変数

クロスサイトリクエストフォージェリ（CSRF）とは、WEBアプリケーションの利用者に、特定のURLをクリックさせることなどによって、本来ログインしていなければ実行できないはずのリクエストを、利用者を介して第三者が実行する攻撃手法のことです。

図１：申込入力画面のindex.htmlをテキストエディタで開いたイメージ

注意点

$FORM{Common.all_vars}に加え、図１赤枠の＜form AUTOCOMPLETE ~から始まる変数も、申込フォームに必要な要素です。コメントアウトまたは削除しないようにご注意ください。

2.対策

コメントアウトされた該当の$FORMをコメントアウトを解除するか、記述自体ない場合、index.htmlファイルに追記します。

全キャンペーン＞個別キャンペーン：「管理開始」リンク＞サイドメニュー＞[キャンペーンテンプレート変更]

全キャンペーンより、個別キャンペーンの[管理開始]リンクをクリックします。
サイドメニュー＞[キャンペーンテンプレート変更]リンクをクリックします。
キャンペーン内の最新登録日時のseminar.zip、または[デフォルトダウンロード(seminar.zip)]リンクをクリックします。
seminar.zipを解凍します。
申込入力画面のindex.htmlをテキストエディタで開きます。
※キャンペーンのフローにより、index.htmlへのファイルパスは異なります。

例１）フロー名：キャンペーン申し込み([ユーザー情報])
申込入力画面：seminar/application/application_flow_master_id/user/index.html

例２）フロー名：キャンペーン申し込み([ユーザー情報/アンケート])
申込入力画面：seminar/application/application_flow_master_id/userenquete/index.html
上記、seminar.zipを適用されている場合のファイルパスとなります。
$FORM{Common.all_vars}のコメントアウトを解除する、または記述自体ない場合は追記し、上書き保存します。
修正が終わったseminar.zipを再度ZIPに圧縮します。
個別キャンペーン画面に戻り、サイドメニュー＞[キャンペーン]をクリックします。
サイドメニューの[キャンペーンテンプレート変更]をクリックします。
[新規登録]ボタンをクリックして、seminar.zipを選択し、 [登録]ボタンをクリックします。
申込み画面より、「次へ」ボタンをクリックし、確認画面に遷移することを確認します。

図２：デザインテンプレート編集イメージ

3.関連コンテンツ

FAQ エラー原因申込フォーム遷移

「次へ」ボタンをクリックしても、入力画面から確認画面へ遷移しない②

日英のアクセス集中時のエラー文言を出し分けることはできませんが、テンプレートを修正することで、日英のエラー文言を下記のように並列表示させることは可能です。

図1:日本語と英語の文言を並列させたエラー画面

SMP管理画面ログイン後、テンプレート変更画面（[WEB] > [テンプレート変更]）より、
system.zipファイルをダウンロードし、アクセス集中時エラー画面の文言調整を行います。

system.zipの編集方法

SMP管理画面にログイン後、テンプレート変更画面（[WEB] > [テンプレート変更]）に遷移します。
[デフォルトダウンロード(system.zip)]ボタンをクリックします。
ダウンロードしたsystem.zipを展開し、system階層にerrorフォルダを作成します。
以下のURLにアクセスし、アクセス集中時のエラー画面を表示します。
https://お客様ドメイン名/error/sysbusy.html
画面が表示されましたらブラウザの機能で該当ページのソースを表示します。
表示されたソースを全てコピーし、「sysbusy.html」というファイル名で保存します。
保存先は、3で作成したerrorフォルダになります。
sysbusy.htmlのファイルに、日本語と英語で出し分けを行いたいエラー文言を記載してください。
カスタマイズが完了しましたら3のsystemフォルダを圧縮して通常のデザインテンプレート同様適用作業を行います。
デザインテンプレートのアップロード方法につきましては下記マニュアルをご参照ください。
・[マニュアル]デザインテンプレートをアップロードする
デザインテンプレートアップロードが完了しましたら、再度以下のURLにアクセスして6で編集した内容が反映されているかご確認下さい。
https://お客様ドメイン名/error/sysbusy.html

原因

アクセスしたキャンペーンにBasic認証がかかっていることが原因として考えられます。
Chromeの場合、Basic認証をかけたままCookieを無効化してキャンペーンにアクセスすると、下記のようなエラー画面に直接遷移してしまいます。

図1:Chromeのエラー画面

Basic認証はそもそもCookieを用いたサーバとクライアント間の認証方法になるため、Cookieを無効にするとBasic認証が挙動せず、キャンペーンにアクセスできないという現象が発生します。
※実際にCookieを無効にした状態でアクセスするとBasic認証ウィンドウが表示されません。

Cookieを無効化した場合、Basic認証を解除してからキャンペーンの動作検証を行うようにしてください。

図2:Basic認証を解除した場合の画面表示

解決方法

Basic認証の解除方法については下記マニュアルをご参照ください。

該当のキャンペーンの[キャンペーン設定]に[Basic認証の使用]という項目が表示されない場合、システム設定一覧からサイト全体に対してBasic認証を有効にしていることが考えられますので、下記画面より[無効]にしていただくようお願いいたします。

[設定]＞[システム設定一覧]＞[Basic認証の使用(サイト全体)]＞[無効]

図3:システム設定一覧画面

ヘッダーフッターの変更方法

全キャンペーン（セミナー）管理モードの[WEB]タブ>[ヘッダーフッター編集]メニューをクリックします。
ヘッダフッタ設定画面が表示されます。

　　　　　　　　　　　　　　　　　　　図１:ヘッダフッタ調整画面
下記の項目の内容をそれぞれ変更します。
・[ヘッダHTML]項目にヘッダー情報を設定します。
・[フッタHTML]項目にフッター情報を設定します。
編集後、[登録]ボタンをクリックします。
登録完了後、申込画面のヘッダー及びフッター情報が変更されます。

[ヘッダフッタ設定]では以下の設定項目があります。
あわせて参考にしてください。

項目名	内容
共通のタイトル	ブラウザのウィンドウタイトルになります。 [ページタイトル] - [共通のタイトル]が表示されます。例：入力画面 - SHANON
javascript/CSSなど	JavascriptやCSSのコードを直接記述し、動作させることができます。
ヘッダHTML	ヘッダー情報を設定することができます。
フッタHTML	フッター情報を設定することができます。
ロゴファイル1～3	ロゴ画像ファイルをアップロードしキャンペーン（セミナー）ページ等で表示することが出来ます。
コンテンツ1～10	独自のデザインテンプレート変数($FORM)を作成することが出来ます。

画面のファイルパス確認方法

対象キャンペーン（セミナー）の[管理開始]リンクをクリックします。
キャンペーン（セミナー）タブにある、[来場側詳細WEBページ（代理登録利用可）]リンクをクリックし、キャンペーン詳細画面(ランディングページ)を表示します。
キャンペーン（セミナー）左上のアクティングアラートフィールドに「テンプレートパスの表示」の項目が表示されますので、[切り替え]リンクをクリックし「ON」にします。
ONにすると、表示されている申込画面で使用しているデザインテンプレートファイルのファイルパスが表示されます。
ファイルパスを確認したいページへ移動し、画面左上の赤太枠で囲まれたファイルパスを確認します。
こちらが現ページのhtmlファイルパスとなりますので、デザインテンプレートファイル（seminar.zip、system.zip）を展開して、そのパスを元にファイルを特定します。

ファイルパスの例

system.zipを読み込んでいる場合は、seminar_baseが表示されます。
seminar_baseとseminar.zipの最初のseminarの階層は同じです。
例)キャンペーン（セミナー）詳細ページ
system/seminar_base/seminar/preview.html
seminar/seminar/preview.html

注意点

※入力画面～確認画面～完了画面はURLが同一になりますが、別々のhtmlファイルを参照しています。
また、キャンペーン（セミナー）のフローにより、ファイルパスは異なります。

例１．フロー名：キャンペーン申し込み([ユーザー情報])
※seminar.zipを適用されている場合

キャンペーン（セミナー）詳細画面：seminar/seminar/preview.html
申込入力画面：seminar/application/application_flow_master_id/user/index.html
申込確認画面：seminar/application/application_flow_master_id/confirm/index.html
申込完了画面：seminar/application/application_flow_master_id/complete/index.html

例２．フロー名：キャンペーン申し込み([ユーザー情報/アンケート])
※seminar.zipを適用されている場合

キャンペーン（セミナー）詳細画面：seminar/seminar/preview.html
申込入力画面：seminar/application/application_flow_master_id/userenquete/index.html
申込確認画面：seminar/application/application_flow_master_id/confirm/index.html
申込完了画面：seminar/application/application_flow_master_id/complete/index.html

上記例1、例2のファイルパスは、個別キャンペーン（セミナー）にてデザインテンプレートを設定している場合のものになります。

アップロード可能サイズの確認方法

全キャンペーン（セミナー）管理モードの[設定]タブ > [システム設定一覧]メニューをクリックします。
システム設定一覧画面より以下の項目を確認します。
テンプレートのファイルサイズ制限(MB)　 50MB

　　　　　　　　　　図1:アップロード可能サイズ確認方法のイメージ

以下の機能でシステム設定で設定されている通り、ファイルサイズの制限が設けられています。

ファイル制限が設定される機能

システムで利用するテンプレート
キャンペーン（セミナー）で利用するテンプレート

システムで利用するテンプレート（WEB-テンプレート変更）

全キャンペーン（セミナー）管理モードの[WEB]タブ > [テンプレート変更]メニューをクリックします。
システムで利用するテンプレート画面より[新規登録]ボタンをクリックします。
システムテンプレート登録画面が表示されます。

　　　　　　　　　　　　図2:システムテンプレート確認イメージ

キャンペーン（セミナー）で利用するテンプレート（キャンペーン（セミナー）テンプレート変更）

個別キャンペーン（セミナー）管理モードの[WEB]タブ > [キャンペーン（セミナー）テンプレート変更]メニューをクリックします。
キャンペーン（セミナー）で利用するテンプレート画面より[新規登録]ボタンをクリックします。
キャンペーン（セミナー）テンプレート登録画面が表示されます。

　　　　　　　　図3:キャンペーン（セミナー）テンプレート確認イメージ

config.yamlファイルとは

キャンペーン（セミナー）テンプレートは、誤って別のキャンペーン（セミナー）に登録されたり、サンドボックス環境のものを本番稼働環境に登録されたりすることを防ぐために、「config.yaml」ファイルを含んでいます。

ここではSHANON MARKETING PLATFORM （以下、SMPと表記）ドメインの変更や他のキャンペーンに登録する際の「config.yaml」ファイルの編集方法をご案内します。

config.yamlファイルの編集方法

テキストエディタで[config.yaml]ファイルを開きます。
ファイル内の「Url:」を[https://ドメイン名/]に書き換えます。
[config.yaml]ファイルを保存します。

system.zipの場合

図1:system.zipの場合

semina.zipの場合

アップロードするキャンペーン（セミナー）のIDの記載が必要になります。

図2:semina.zipの場合

「コンテンツ機能」とは

全キャンペーン（セミナー）管理　[WEB]タブ＞サイドメニュー：ヘッダーフッター編集　の中に
「コンテンツ1」〜「コンテンツ10」という「項目枠」を追加することができます。
「コンテンツ1」〜「コンテンツ10」分の変数が利用できるようになります。

図1:ヘッダーフッター編集画面

コンテンツをシステムのWEBページに出力するための変数は以下になりますので、
デザインテンプレートの編集にて差込をしたいページに以下変数を埋め込み、管理します。
コンテンツ1：$FORM{Common.contents1}
コンテンツ2：$FORM{Common.contents2}
　　　・
　　　・
　　　・
コンテンツ10：$FORM{Common.contents10}

公開資料

概要：マイページ機能やポータルページ機能、複数のキャンペーン（セミナー）など、共通で表示する資料を登録できる機能です。　※1
公開範囲を指定して、範囲を絞り込んで公開、管理することが可能です。

公開資料の登録手順は以下のマニュアルをご確認ください。

＜特徴＞

全キャンペーン（セミナー）管理にて登録、公開、管理ができます。
個別キャンペーン（セミナー）では登録できません。
デフォルト（カスタマイズが入っていないデザインテンプレート）のマイページ機能のページ上では[資料ダウンロード]欄に資料のリンクが表示されます。
デフォルトのマイページ機能を利用していない場合でも、全キャンペーン（セミナー）管理＞[WEB]タブ＞サイドメニュー[公開資料]の資料名ごとの「リード（申込者）ダウンロードURL」を利用し、メールや個別キャンペーン（セミナー）詳細ページなどでご案内できます。
特定の個別キャンペーン（セミナー）にのみ表示することはできません。

公開範囲は以下の違いがあります。

公開範囲の選択肢	選択肢の意味
すべて公開	すべてのアクセス者が閲覧できます
会員　※2	会員管理機能でログインできるすべてのリード（申込者）が閲覧できます
検索条件でフィルタされた会員　※3	会員管理機能でログインでき、検索条件に一致したリード（申込者）が閲覧できます
非公開	リード（申込者）がアクセスしても閲覧できません（管理画面にログインした管理者のみダウンロード可能です）

講演資料

概要：個別のキャンペーン（セミナー）ごとに紐づけて表示する資料を登録できる機能です。
特定のキャンペーン（セミナー）に関連する資料として、公開範囲を指定して、公開、管理することが可能です。

講演資料の登録手順は以下のマニュアルをご確認ください。
※サブキャンペーン（セッション）にてセッションごとに講演資料を登録する場合は、サブキャンペーン（セッション）タブの中の講演資料一覧より登録してください。

＜特徴＞

個別キャンペーン（セミナー）に紐づく資料として登録、公開、管理ができます。
サブキャンペーン（セッション）型のキャンペーン（セミナー）では、サブキャンペーン（セッション）タブの中の１つのサブキャンペーン（セッション）ごとに紐づけて登録、公開、管理ができます。
デフォルトのマイページ機能のページ上では[お申し込み履歴一覧]欄の[お申し込み内容]の申込履歴ごとに資料のリンクが表示されます。
デフォルトのマイページ機能を利用していない場合でも、全キャンペーン（セミナー）管理＞[WEB]タブ＞サイドメニュー[公開資料]の資料名ごとの「リード（申込者）ダウンロードURL」を利用し、メールや個別キャンペーン（セミナー）詳細ページなどでご案内できます。
（個別キャンペーン（セミナー）にて登録した講演資料も公開資料一覧で確認が可能です。）
個別キャンペーン管理開始＞[キャンペーン]タブ＞[講演資料一覧]　の資料名ごとの[ダウンロード者一覧]は、
全キャンペーン（セミナー）管理＞[WEB]タブ＞サイドメニュー[公開資料]の資料名ごとの]ダウンロードした会員]と同じく、
ダウンロード時にログインを行い特定されたリード（申込者）の数がカウントされます。

公開範囲は以下の違いがあります。

公開範囲の選択肢	選択肢の意味
すべて公開	すべてのアクセス者が閲覧できます
会員　※2	講演資料を登録しているキャンペーン（セミナー）の申込履歴があり、会員管理機能でログインできるリード（申込者）が閲覧できます ※キャンペーン（セミナー）に申込履歴のない会員は閲覧できません
検索条件でフィルタされた会員　※3	会員管理機能でログインでき、検索条件に一致したリード（申込者）が閲覧できます ※キャンペーン（セミナー）に申込履歴のない会員は閲覧できません
非公開	リード（申込者）がアクセスしても閲覧できません（管理画面にログインした管理者のみダウンロード可能です）

注意点

※1)マイページ機能やポータルページ機能は有償オプション機能です。
　　利用する場合は、別途ご契約が必要です。
※2)「公開範囲：会員」は会員管理機能（会員IDとパスワードをリード（申込者）へ発行）を
　　利用している場合にのみ利用可能です。
※3)「検索条件でフィルタされた会員」は、カスタム設定(申込者の検索条件フィルタ)から
　　選択した会員がログインした際のみ利用可能です。

個別キャンペーンのヘッダー・フッターを削除する方法

以下手順にて、テンプレートの修正を行うと、

全キャンペーン（セミナー）＞WEBタブ＞ヘッダーフッター編集＞ヘッダHTMLに
登録されている内容すべてが対象ページから削除されますので、ご注意ください。
（ページに表示されている会社のロゴ画像なども削除されます。）

全キャンペーン（セミナー）管理画面（青い画面）より、該当の個別キャンペーン（セミナー）管理画面（オレンジ画面）へ移動します。
キャンペーン（セミナー）タブをクリックします。
左メニューの[キャンペーン（セミナー）テンプレート変更]をクリックします。
[デフォルトダウンロード(seminar.zip)]ボタンをクリックしてダウンロードします。
※ダウンロードしたseminar.zipは修正用とバックアップ用に分けて保存します。
seminar.zipを解凍します。
対象のファイルパスを確認します。

例1：seminar.zipを適用されている場合
-------------------------------------------------------------------
　■フロー名：キャンペーン申し込み([ユーザー情報])
-------------------------------------------------------------------

キャンペーン（セミナー）詳細画面：seminar/seminar/preview.html
申込入力画面：seminar/application/application_flow_master_id/user/index.html
申込確認画面：seminar/application/application_flow_master_id/confirm/index.html
申込完了画面：seminar/application/application_flow_master_id/complete/index.html
※入力画面～確認画面～完了画面はURLが同一になりますが、別々のhtmlファイルを参照しています。 また、キャンペーン（セミナー）のフローにより、ファイルパスは異なります。
ヘッダーやフッターの変数を削除し、ファイルを保存します。
-------------------------------------
対象変数
-------------------------------------
$FORM{Common.body_header}
$FORM｛Common.body_footer｝
-------------------------------------
上記修正が終わったseminar.zipを再度ZIPに圧縮します。
SHANON MARKETING PLATFORMの画面に戻り、キャンペーン（セミナー）タブをクリックします。
左メニューの「キャンペーン（セミナー）テンプレート変更」をクリックします。
[新規登録]ボタンをクリックして、seminar.zipを選択し、
[登録]ボタンをクリックします。

削除 HTML FAQ 操作方法

ヘッダー、フッターの削除方法

[WEB]＞公開資料画面にて、[ダウンロードした会員]より確認が可能です。
表示されているダウンロード数のリンクをクリックすると、リードの一覧が確認できます。

公開資料の[状態]を、[会員]もしくは[検索条件でフィルタされた会員]に設定した場合に、ダウンロードしたリードの特定が可能です。ただし、資料ダウンロードする時に「ログイン」を求める仕様に変更されます。

図１：公開資料一覧イメージ

公開資料を公開するとダウンロード用リンクが生成されます。
リードダウンロードURLの項目より確認可能です。

また、公開資料URLにアクセスしたときの動きや履歴のつき方は、以下の通り、公開資料の[状態]の設定状況で異なります。

1.公開資料の[状態]を、[会員]もしくは[検索条件でフィルタされた会員]に設定した場合

	ログイン状態（マイページにログイン状態）	未ログイン状態
資料のダウンロード時	ダウンロード可	ログインID：パスワードの入力を求められます。
資料のダウンロード時	ダウンロード可	ログイン成功でダウンロード可	ログイン失敗でダウンロード不可
[ダウンロードした会員]からのリード（申込者）の特定	可	不可（ログインしない限り特定できません。）

2.公開資料の[状態]を、[すべて公開]に設定した場合

	ログイン状態（マイページにログイン状態）	未ログイン状態
資料のダウンロード時	ダウンロード可	ダウンロード可
[ダウンロードした会員]からのリード（申込者）の特定	可	不可（ログインしない限り特定できません。）

図1:「ダウンロードした会員」画面

ダウンロードした会員	ダウンロード時にログインを行い特定された、リードの数です。数値のリンクをクリックすると、ダウンロードを行ったリードを確認できます。
総ダウンロード回数	資料がダウンロードされた合計回数です。(※1)

注意点

(※1)管理者としてSMPログインしている状態で、資料をダウンロードした場合、公開資料の総ダウンロード回数はカウントされません。（SMPに管理者としてログインしているブラウザで資料URLを開いた場合）
(※1)管理者としてSMPログインしている状態で、リードに代理ログインした場合、
公開資料の総ダウンロード回数はカウントされます。

また、[リード]＞[一覧]＞該当するリードの[詳細]の[ダウンロード履歴]からもダウンロードした資料・日時などが確認できます。

図2:「資料ダウンロード履歴」画面

3.関連コンテンツ

公開資料 FAQ 操作方法確認

公開資料をダウンロードしたリードを確認する方法

受講票のテンプレートは下記手順にて変更することが可能です。

全キャンペーン（セミナー）管理モードを表示します。
[WEB]タブをクリックします。
テンプレート更新履歴一覧最上部（最新）のファイルの[ダウンロード]リンクをクリックします。
ダウンロードされたsystem.zipを解凍します。
以下のHTMLファイルが受講票のファイルとなりますので編集を行って下さい。
mypage/ticket/plain.html
編集したHTMLを保存し、ダウンロードしたフォルダをZIP形式に圧縮します。
3.のテンプレート更新履歴一覧の[新規登録]ボタンからsystem.zipをアップロードします。

受講票 FAQ 操作方法修正

受講票を変更したい

１つの資料ダウンロードURL（[講演資料][公開資料]など、SMPに登録しているファイルURL）のリンクへ、「同時ダウンロード数制限」の30件を超えるアクセスがあった場合にエラーと表示されます。

資料ダウンロードURLは「同時ダウンロード数制限」は30件以内までの設定となっています。
以下のようなエラーメッセージが表示された場合は、時間を置き、再度アクセスをして下さい。

エラー表示例）

エラーメッセージ：只今アクセス集中のため、一部利用を制限しております。

公開資料 FAQ 制限事項制限値

資料ダウンロードURLへアクセスするとエラーが出る

2011年2月以降からご利用開始されている標準テンプレートでは、キャンペーン説明文の上下に申込ボタンを表示するように設定されております。
テンプレートを編集していただき、減らしたい箇所にある申込ボタンの変数の$FOR｛application_link｝を削除いただく必要があります。
下記に個別キャンペーンでの修正方法についてご案内いたします。

※テンプレートを修正を行う前に、以下FAQ記事を必ずご参照ください。

申込ボタンの削除手順

全キャンペーン(セミナー)管理画面(青い画面)より、
個別キャンペーン（セミナー）の[管理開始]リンクをクリックします。
キャンペーン(セミナー)タブをクリックします。
左メニューの[キャンペーン(セミナー)テンプレート変更]をクリックします。
登録日時（最新日時）がついた［ダウンロード］リンクをクリックし、ダウンロードします。
※登録日時がついた［ダウンロード］リンクがない場合は、system.zipを参照しています。
キャンペーン(セミナー)内の[デフォルトダウンロード(seminar.zip)」をクリックするか、全キャンペーン（セミナー）のsystem.zipを編集します。
※ダウンロードしたseminar.zipは修正用とバックアップ用に分けて保存してください。
seminar.zipを解凍します。
下記ファイルパスより、対象タグをテキストエディタ内で検索すると2つ表示されますので、
どちらかを削除し、ファイルを保存します。

パス：seminar\preview.html
対象タグ：$FORM{application_link}
上記修正が終わったseminar.zipを再度ZIPに圧縮します。
個別キャンペーン（セミナー）画面に戻り、[キャンペーン(セミナー)]タブをクリックします。
左メニューの「キャンペーン(セミナー)テンプレート変更」をクリックします。
[新規登録]ボタンをクリックして、seminar.zipを選択し、[登録]ボタンをクリックします。

	画像サイズ	縦横比
推奨値	なし	なし
制限値	10MB	制限なし
備考	画像のサイズが大きい場合、埋め込み先ページでの表示速度が低下する恐れがありますのでご注意ください。	比率が極端に縦長・横長のものは、意図した表示になっているかどうかを事前にウィジェットパーツ一覧・編集＞プレビューなどでご確認ください。

目次

設定内容と活用方法

手段

設定方法

ABテストを目的としたパーソナライズドウィジェットの設定手順

ポップアップの場合

埋め込みフォームの場合

注意事項

注意事項

実行結果

注意事項

関連マニュアル・FAQ

Webパーソナライズ機能によるABテスト方法

ファイルサイズ制限の確認方法

公開資料の制限事項（サイズ・拡張子）を知りたい

目次

1-1. デザインテンプレートができること

1-2. デザインテンプレートの構成要素

1-3. デザインテンプレートで編集できるページ

1-4. デザインテンプレートの種類

■「システムテンプレート」の適用範囲

■「キャンペーンテンプレート」の適用範囲

MEMO≫ 適用範囲の違いについて

MEMO≫「キャンペーンテンプレート」で編集した画面を「システムテンプレート」で編集すると更新されるか？

1-5. デザインテンプレートのフォルダ構成

■テンプレートの構成

1-6. 画像・CSS・jsの編集方法

■ファイルの設置方法(フォルダの階層)

■ファイルパス(相対パス)の指定方法

MEMO≫ パスとは？

1-7. 変数($FORM)の特徴

■変数とは

■変数の仕組み

MEMO≫ 変数($FORM)の入れ子構造

1. デザインテンプレートの構成を知ろう

目次

1.活用の流れ

2.実装手順

実装手順

2.1.会社紹介動画をページに表示する

実装手順

2.1-1.動画情報をSMPに登録する

2.1-2.会社紹介動画ページを作成する

2.1-3.自社サイトに会社紹介動画を表示する

2.2-1.休眠状態のリードを抽出する

2.2-2メールテンプレートを作成する

2.2-3.メールを一括配信する

重要

2.3.会社紹介動画を視聴したリードをリストに追加する

実装手順

2.3-1.会社紹介動画を視聴したリードを抽出する

2.3-2.リストを作成する

3.フォローの実施（架電）

3.1.(インサイド)セールス部による架電の実施

3.2.架電対応後の活動履歴の登録

4.まとめ

5.関連チュートリアル動画

6.関連ご利用ガイド

7.関連マニュアル

動画視聴履歴機能の活用方法（活用事例２）

目次

紹介内容と活用方法

手段

設定方法

１．地理的属性

２.年齢別

３.職種別

4.行動属性

実行結果

注意事項

関連マニュアル

関連FAQ

Webパーソナライズ機能のウィジェットターゲット活用方法

関連マニュアル

関連FAQ

画像サイズの制限値や画像の縦、横比率の推奨値が知りたい

目次

2-1. デザインテンプレートをダウンロードする

■全キャンペーン画面から取得・登録「システムテンプレート=system.zip」

■個別キャンペーン画面から取得・登録「キャンペーンテンプレート=seminar.zip」

3. デザインテンプレートを変更してみよう課題編