Web Widget(従来版)を使用して、問い合わせフォームに表示する情報をさまざまな手段でカスタマイズできます。この記事では、次のカスタマイズについて説明します。
- カスタムチケットフィールドをWeb Widget(従来版)のデフォルトの問い合わせフォームに追加する
- デフォルトの問い合わせフォームとチケットフォームから名前を削除する
- デフォルトの問い合わせフォームとチケットフォームの名前フィールドを必須フィールドにする
- Web Widget(従来版)で別のチケットフォームを使用する
この記事では、次のトピックについて説明します。
関連記事:
カスタムチケットフィールドをデフォルトの問い合わせフォームに追加する
Supportのどのプランでも、表示かつ編集可能なカスタムチケットフィールドを1つ、2つ、または全部、Web Widget(従来版)の問い合わせフォームに含めるように選択できます。一部の利用プランでは、デフォルトの問い合わせフォームにカスタムチケットフィールドを必要な数だけ表示させることができます。カスタムチケットフィールドの詳細については、「カスタムフィールドをチケットに追加し、リエストフォームを送信する方法」を参照してください。
「優先度」フィールドなどのシステムチケットフィールドは、Web Widget(従来版)でサポートされません。ヘルプセンターからアクセスした場合、これらのフィールドはデフォルトの問い合わせフォーム(およびその他のチケットフォーム)に表示されますが、Web Widget(従来版)には表示されません。フィールドの並べ替えは、チケットフォームを使用するWeb Widget(従来版)ではサポートされていますが、問い合わせフォームではサポートされていません。
正規表現(Regex)、日付、マルチセレクトの各カスタムフィールドは、Web Widget(従来版)では使用できません。
デフォルトの問い合わせフォームにカスタムチケットフィールドを表示するには
- 管理センターで、サイドバーの「 チャネル」をクリックし、「従来版」>「Web Widget」を選択します。
- 「基本情報」タブで、「問い合わせフォーム」チェックボックスを選択し、「カスタムチケットフィールド」ドロップダウンをクリックします。
- 問い合わせフォームに含めるカスタムチケットフィールドを個別に選択するか、「すべて選択」を選択します。
- 「保存」をクリックします。
Web Widget(従来版)で複数のチケットフォームを有効にする
Zendesk Suiteプラン、Support Enterpriseプラン、またはSupport Enterprise Plusプランをご利用の場合、Web Widget(従来版)で複数のチケットフォームを使用できます。チケットフォームのリスト、および一般的な情報や機能については、「各種リクエストに応じたさまざまなチケットフォームの作成」を参照してください。
チケットフォームでは、問い合わせフォームに含めるフィールドをカスタマーのリクエストのタイプに基づいてカスタマイズできます。この機能を実現するには、複数のチケットフォームをあらかじめ作成しておく必要があります。
Web Widget(従来版)でチケットフォームを有効にするには
- 管理センターで、サイドバーの「 チャネル」をクリックし、「従来版」>「Web Widget」を選択します。
- 「基本情報」タブで、「問い合わせフォーム」チェックボックスを選択し、「チケットフォーム」チェックボックスを選択します。
- 「保存」をクリックします。
チケットフォームのトグルがオンになっている場合、カスタマーが「メッセージを残す」ボタンをクリックすると、アクティブなチケットフォームのリストからニーズに合ったフォームを選択するよう求められます。
チケットフォームを選択すると、そのチケットフォームに固有のフィールドが問い合わせフォームに表示されます。
Web Widget(従来版)でフィールドの説明をカスタマイズする
カスタムチケットフィールドとその説明を、Web Widget(従来版)のデフォルトの問い合わせフォームに追加できます。これらを表示するには、Web Widget(従来版)の管理設定の「カスタムチケットフィールド」オプションから目的のフィールドを選択する必要があります。
ただし、「優先度」フィールドなどのシステムフィールドは、Web Widget(従来版)でサポートされません。これは、すべてのプランタイプで共通です。ヘルプセンターからアクセスした場合、これらのフィールドはデフォルトの問い合わせフォーム(およびその他のチケットフォーム)に表示されますが、Web Widget(従来版)には表示されません。
チケットフォームは、すべての利用プランで利用できるわけではありません。ご利用のプランによっては、カスタムフィールドとその説明をチケットフォームに含めることもできます。カスタムチケットフィールドとその説明を表示するには、Web Widget(従来版)の設定で「チケットフォーム」オプションを有効にする必要があります。
チケットフィールドの説明は、「チケットフィールド」管理ページから作成および編集できます。チケットフィールドに関する情報については、「チケットフィールドについて」を参照してください。
フィールドの説明を追加するには
- 管理センターで、サイドバーの「 オブジェクトとルール」をクリックし、「チケット」>「フィールド」を選択します。
- 説明を必要とするフィールドの名前をクリックします。
- 「エンドユーザー用」セクションで、「編集可能」をクリックします。
- フィールドの説明を入力して、「フィールドを更新」をクリックします。
高度なカスタマイズ:状況に応じたチケットフォーム
Web Widget (従来版)のJavaScript APIのzESettingsオブジェクトを編集して、エンドユーザーが現在表示しているWebページに即したチケットフォームを提示することで、よりカスタマイズされたエクスペリエンスを生み出せます。APIの使用について詳しくは、「Web Widget(従来版)の高度なカスタマイズ」を参照してください。
編集するWebページのコードに含まれるzESettingsオブジェクトに変更を加え、ユーザーに提示するチケットフォームのID番号を追加します。チケットフォームIDは、チケットフォーム管理ページの「URL」に表示されています。
チケットフォームID番号を見つけるには
- 管理センターで、サイドバーの「 オブジェクトとルール」をクリックし、「チケット」>「フォーム」を選択します。
- ユーザーに提示するフォームまたはスタンドアロンフォームとして使用するフォームの名前をクリックします。
- アドレスバーのフォームIDをメモしておきます。
Webサイトのコードを編集するには、次のコード例を使用します。
1個のチケットフォームを提示するには:
<script type="text/javascript">
window.zESettings = {
webWidget: {
contactForm: {
ticketForms: [
{ id: ###### }
]
}
}
};
</script>
2個のチケットフォームを提示するには:
<script type="text/javascript">
window.zESettings = {
webWidget: {
contactForm: {
ticketForms: [
{ id: ###### },
{ id: ###### }
]
}
}
};
</script>
必要な数だけフォームIDをzESettingsオブジェクトに追加します。
高度なカスタマイズ:テキストフィールドにテキストを事前入力する
特定のフィールドにテキストを事前入力できるよう、新しい設定が追加されました。ロケールごとに異なる文字列を使用できますが、1つの文字列をすべてのロケールに適用する場合は、ロケールにアスタリスク(*)を指定します。これは、問い合わせフォームのタイトルなど、他のカスタマイズ可能なテキスト文字列でも同様です。
'subject'や'description'などのシステムフィールドを事前入力するには、次に示す方法でzESettingsオブジェクトを編集します。
例:事前入力された説明テキスト
次のコードを使用します。
<script type="text/javascript">
zESettings = {
webWidget: {
contactForm: {
fields: [
{ id: 'description', prefill: { '*': 'This is prefilled description text' } }
]
}
}
};
</script>
例:事前入力されたカスタムフィールド:
次のコードを使用します。
<script type="text/javascript">
zESettings = {
webWidget: {
contactForm: {
fields: [
{ id: #####, prefill: { '*': 'Desired text' } }
]
}
}
};
</script>
このコードブロックでは、id: #####
はカスタムフィールドのIDです。
すべてのフォームの特定のフィールドを常に事前入力することも、特定のフォームの特定のフィールドを個別に事前入力することもできます。
コード例:異なるフォーム間で共通のフィールドに異なる説明を事前入力する
<script type="text/javascript">
window.zESettings = {
webWidget: {
contactForm: {
ticketForms: [
{
id: ###TicketFormID###,
fields: [
{
id: 'description',
prefill: {
'*': description
}
}
]
},
{
id: ###TicketFormID###,
fields: [
{
id: 'description',
prefill: {
'*': 'different description'
}
}
]
}
]
}
}
};
</script>