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>
38件のコメント
mfg
You can custom a limited number/selection of forms by adding the snippet for the widget to a different brand.
We have 10 forms total. Brand A has 8 forms associated with it. We only want to focus on 3 of them to show up in the Help Center widget. I created a Brand B that we don't actually use, associated those 3 forms with it, and used the snippet for the Brand B widget to embed it on Help Center A.
You'd probably want to have a trigger in place to change the brand back to A, and will need assignment triggers updated if you're using brand as a condition, but this allows you to have the subset of forms you're customizing for.
Nara
0
Christopher Kennedy
0
Usman Saeed
Okay Thanks for the Help Christopher Kennedy
0
Christopher Kennedy
0
Usman Saeed
Christopher Kennedy Thanks for the update.
Any reason why we can't change custom field title/label for end users using Web Widget API Script.
0
Christopher Kennedy
It's not possible in a script using the Web Widget APIs. The widget will display the title of the field from admin settings.
0
Usman Saeed
Christopher Kennedy Thanks for reply.
Can I change the field's title/label using web widget script? like we do change hint/description for any field.
0
Christopher Kennedy
The hint property allows you to specify the field's description, but it won't change the field's title/label within the widget. You may set the Title shown to customers value in the ticket field's settings to display your desired field title to end-users.
0
Usman Saeed
Thank you Dave Dyson
I can change the custom field label for help center ticket form using this line of code: $('label[for=request_custom_fields_30057292]').html("Rename label");
But i want to change the custom field label for web widget.
here is the code i use to change the description and custom field hint
For web widget how can i change the custom field label using above script.
0
Dave Dyson
No, you can't change a field label that way, but you can use JavaScript to change the label in a ticket field -- here's an example that changes the labels of the Subject and Description fields, but you can do the same for a custom field by substituting
for=request_custom_fields_{id}_label
with the id for that custom field (no brackets), in place offor=request_subject
: Rename the "Subject" and "Description" labels on the Request form0
サインインしてコメントを残します。