Zendesk Webウィジェット設定完全ガイド

Iohan Chan
Written by

Iohan Chan

Reviewed by

Stanley Nicholas

Last edited 2026 1月 12

Expert Verified

Zendesk Webウィジェット設定完全ガイド

サポートチケットの山に埋もれていませんか?業務負荷を増やすことなく、サポートチームがより迅速に問題を解決できればいいのに、と思ったことはありませんか?それを実現するのが、Zendesk Webウィジェット(Zendesk Web Widget)です。Zendeskのベンチマークデータによると、セルフサービスオプションとリアルタイムサポートを有効にすることで、サポートチケットを平均25%削減できることが示されています。

このガイドでは、インストール、カスタマイズ、高度な設定の手順を追いながら、シームレスで顧客に優しいサポート体験を構築する方法を解説します。さらに自動化を進めたい場合は、eesel AIのようなAIソリューションの統合によって、問題解決を迅速化し、チケットを回避して、チームが本当に重要な業務に集中できるように支援します。

eeselはZendeskのメッセージングに直接追加できるため、Webウィジェットをセットアップした後にeeselを導入することで、柔軟で完全にカスタマイズ可能なメッセージングシステムを構築できます。

Zendesk Webウィジェットとは?

Zendesk Webウィジェットは、Webサイトやヘルプセンターに直接埋め込むことができる組み込み型のカスタマーサポートツールです。セルフサービスオプションを有効にし、最も必要とされる場所でリアルタイムサポートを提供することで、チケット件数の削減を支援します。Zendeskのドキュメントによると、これはデジタルサポートのハブとして機能し、顧客がページを離れることなく回答を見つけたり、サポートとチャットしたり、チケットを送信したりできるよう、24時間365日体制でサポートします。

Zendeskは、Webウィジェットの2つの異なるバージョンを提供しています。

機能メッセージングWebウィジェットクラシックWebウィジェット
最適な用途継続的なサポートを必要とする現代的なビジネス詳細なフォームを必要とする組織
ライブチャット継続的な会話セッションベースのチャット
ヘルプセンター検索はい(記事の提案機能付き)はい(コンテキストに応じたヘルプ付き)
チケット作成簡素化されたデータ収集フル形式の問い合わせフォーム
ボット統合ネイティブAIサポート基本的な自動化機能

メッセージングWebウィジェットは、AIを活用したアシスタンスを備えた、インタラクティブで常時稼働のサポートシステムを求める企業向けに設計されています。一方、クラシックWebウィジェットは、構造化されたチケット管理や、実績のあるセッションベースのサポートワークフローを優先するチームに適しています。

Webウィジェットのインストール方法

Zendesk Webウィジェットのセットアップは、カスタマーサポート機能を大幅に向上させることができる、非常にシンプルなプロセスです。Zendeskによると、クラシック版とメッセージング版の2つのバージョンが利用可能です。このガイドでは、現代のサポートニーズに合わせた強化機能を提供するメッセージング版に焦点を当てます。

ステップ1:ZendeskでWebウィジェットを追加する

  1. 管理センター(Admin Center)で、チャネル > メッセージングとソーシャル > メッセージングに移動します。

  2. チャネルを追加を選択し、Webウィジェットを選びます。

  3. 初期設定を完了します。わかりやすいチャネル名を指定してください。

  4. ブランドを選択します(マルチブランドアカウントの場合)。

  5. 基本的なメッセージング設定を行います。

ステップ2:WebサイトにWebウィジェットのコードを埋め込む

設定後、以下のスクリプトを使用してWebウィジェットをサイトに埋め込む必要があります。

Zendeskは、ページの読み込みパフォーマンスを最適化するために、このスクリプトを </body> 終了タグの直前に配置することを推奨しています。WordPressなどのコンテンツ管理システム(CMS)を使用している場合、通常はテーマの設定やコードインジェクション用のプラグインを介して追加できます。

ステップ3:インストールを確認する

Webウィジェットが正しく動作していることを確認します。

  1. サイトをシークレットウィンドウ(incognito window)で開き、初めての訪問者をシミュレートします。

  2. 指定した場所に、正しいブランディングでウィジェットが表示されているか確認します。

  3. 次の主要機能をテストします:ヘルプセンター検索。

  4. ライブチャットのやり取り。

  5. チケット送信フォーム。

  6. テスト用のチケットを送信し、サポートチームに正しくルーティングされるか確認します。

ウィジェットをカスタマイズする

インストールが完了したら、Webウィジェットのパーソナライズを開始できます。カスタマイズプロセスの目的は、ブランドのアイデンティティに一致するシームレスな体験を作成することです。

まずは*視覚要素(Visual elements)*の設定から始めましょう。ボタンやヘッダーにブランドのメインカラーを設定します。この際、アクセシビリティを確保するためのコントラストチェック機能が組み込まれています。エンタープライズユーザーは、Zendeskのロゴを削除して自社のロゴを追加できます。ランチャーアイコンの位置は、サイトのレイアウトに合わせて戦略的に配置してください。

次に、ウィジェットの*動作設定(Behavior settings)*を定義します。配置を右下または左下のどちらにするか、デフォルトの状態(展開または折りたたみ)をどうするか、モバイルでのレスポンシブ対応などを設定します。また、顧客の期待値を管理するために、営業時間の設定も可能です。

ウィジェットの*ボイス(Voice)*をカスタマイズするには、ボタンのテキスト、デフォルトの言語設定、自動応答などを設定します。多言語サイトの場合は、グローバルな訪問者をサポートするために適切な翻訳を追加しましょう。

カスタマイズの変更がすべてのウィジェットに反映されるまでには、通常10分ほどかかることに注意してください。一貫した体験を提供できるよう、異なるデバイスやブラウザで設定をテストしてください。

Zendeskは強力なカスタマイズオプションを提供していますが、eesel AIと統合することで、インテリジェントな回答や高度な自動化をウィジェットに追加し、よりパーソナライズされた顧客体験を実現できます。

主要機能の設定

Webウィジェットを正しく設定することで、顧客が回答を迅速に見つけ、必要なときにサポートとつながるようになります。主要な構成要素であるヘルプセンターの統合と問い合わせフォームのカスタマイズは、シームレスで効率的なサポート体験を構築する上で極めて重要な役割を果たします。これらを適切に設定することで、チケット件数の削減、応答時間の短縮、不必要な遅延のないサポートの提供が可能になります。

ヘルプセンターのセットアップ

構造化されたヘルプセンターがあれば、顧客は自分で解決策を見つけることができ、チケット件数の削減と解決時間の短縮につながります。この機能を有効にするには:

  1. 管理センター > チャネル > ウィジェット > カスタマイズに移動します。

  2. ヘルプセンター検索をオンにして、顧客が記事を検索できるようにします。

  3. 設定をクリックして主要なオプションを設定します:コンテキストに応じたヘルプ(Contextual help) – ページの内容に基づいて関連する記事を表示します。

  4. 推奨記事 – 一般的なフォローアップの質問に対応するため、関連するコンテンツを提案します。

  5. アクセス制限 – 特定の記事をログインユーザーのみに制限します。

ヘルプセンターが使いやすく、最新の状態に保たれていることは、顧客が回答を見つけるスピードに大きな影響を与えます。エンタープライズユーザーは、機密性の高いコンテンツへのアクセスを制限することで、顧客に関連のある情報のみを確実に提供できます。

問い合わせフォームの設定

顧客が直接的なサポートを必要とする際、適切に構成された問い合わせフォームがあれば、問い合わせを効率的に適切なチームへ届けることができます。フォームのセットアップとカスタマイズの手順は以下の通りです。

  1. ウィジェット設定を開き、問い合わせフォームのスイッチが有効になっていることを確認します。

  2. 必要な詳細情報を収集するためにフォームフィールドを調整します:名前とメールアドレス – 必要に応じて必須または任意に設定します。

  3. カスタムチケットフィールド – 注文番号や問題のカテゴリなど、特定の情報を取得します。

  4. ルーティングルール – チケットを適切な部門に自動的に割り当てます。

ウィジェットの高度な設定

Zendesk Webウィジェットの高度な設定を行うことで、安全な認証とマルチブランドサポートを効果的に管理できます。ユーザー認証は顧客データの保護を確実にし、マルチブランド管理は単一のZendeskアカウント下で異なるブランドに合わせたサポート体験の提供を可能にします。これらの機能を正しく設定することで、シームレスで安全な顧客対応が実現します。

ユーザー認証

Webウィジェットへの安全なアクセスを確保することは、顧客との信頼関係を築き、機密データを保護する上で役立ちます。Zendeskは、ウィジェットにアクセスできるユーザーとそのユーザーが表示できるデータを細かく制御できる認証オプションを提供しています。

安全な認証を有効にするには:

  1. 管理センター > チャネル > ウィジェット > セキュリティ設定に移動します。

  2. JWT認証を有効にして、アクセスを許可する前にユーザーを検証します。

  3. CORSポリシーを設定して、ウィジェットへのアクセスを特定のドメインに制限します。

適切な認証を行うことで、許可されたユーザーのみが機密性の高いサポートコンテンツにアクセスできるようになり、セキュリティリスクを軽減しながら顧客の信頼を高めることができます。また、Zendeskの包括的な設定と並行して、特別な構成を求めている場合は、eesel AIを使用してカスタムの検証アクションや個別のボットアクセスを設定することも可能です。

マルチブランド管理

複数のブランドを運営している企業にとって、すべての接点で一貫したサポート体験を提供することは重要です。Zendeskでは、ブランドごとに個別のウィジェット設定が可能なため、効率的な単一のサポート体制を維持しながら、各ブランドが独自のアイデンティティを保つことができます。

マルチブランドサポートをセットアップするには:

  1. 管理センター > チャネル > ウィジェットに移動します。

  2. 設定が必要な各ブランドに対して、ウィジェットを追加をクリックします。

  3. ブランドのアイデンティティを反映するように、ウィジェットのスタイル、ブランディング、ナレッジベースをカスタマイズします。

複数のブランドにわたって一貫した応答時間とナレッジベースの正確さを維持することで、顧客がどのブランドと接点を持ってもシームレスな体験を得られるようになります。

Webウィジェットを最適化するためのベストプラクティス

適切に最適化されたZendesk Webウィジェットは、顧客が遅延や技術的なトラブルなく必要な助けを得られるようにします。パフォーマンス、応答性、使いやすさを少し改善するだけで、顧客満足度に大きな影響を与えることができます。

パフォーマンスの向上

パフォーマンスの最適化により、ウィジェットを高速で反応が良いものにします。効率的なセットアップを維持するには、以下の点に注意してください。

  • カスタムコードの管理 – 簡素化されたスクリプトを使用することで、特にモバイルデバイスでの読み込み時間を短縮できます。

  • 遅延読み込み(Lazy loading)の有効化 – これにより、全機能を維持しながらページの読み込み速度を高速に保つことができます。

  • コンテンツデリバリネットワーク(CDN)の使用 – CDNを使用すると、世界各地のユーザーにウィジェットの資産をより迅速に提供できます。

スムーズなユーザー体験の確保

Webウィジェットの読み込みが速くても、使い勝手が悪ければ意味がありません。さまざまなデバイス、ブラウザ、顧客シナリオでテストを行い、シームレスな体験を保証しましょう。重点を置くべき領域は以下の通りです。

  • ブラウザの互換性 – ウィジェットは、Chrome、Firefox、Safari、Edgeでスムーズに動作するように設計されています。

  • モバイルレスポンシブ対応 – スマートフォンやタブレットでも優れた体験を提供できるよう、ウィジェットが適切にスケーリングされることを確認してください。

  • 負荷テスト – サポートが混み合うピーク時に、ウィジェットがどのようにトラフィックを処理するか監視します。

  • 認証のセットアップ – 安全なユーザー体験のために、ログイン認証がシームレスに機能することを確認します。

最適化のヒント

目標検討事項推奨されるアクション
モバイル表示小さな画面でのサポートオプションの操作性異なるデバイスでテストし、レスポンシブ性を高めるためにレイアウトを調整する
高速なパフォーマンス最高のユーザー体験のための読み込み時間の短縮カスタムスクリプトの整理、アセットの最適化、遅延読み込みの有効化
認証パーソナライズされたサポートのための安全なユーザー識別<a href="https://support.zendesk.com/hc/en-us/articles/4408843923610\" target="_blank" rel="noopener">Zendeskの認証設定に従う
ブランドの一貫性プラットフォーム全体でのブランドの統一色、フォント、スタイルがWebサイトのデザインと一致していることを確認する

プロのヒント:eesel AIのような自動監視ソリューションの導入を検討してください。顧客に影響が出る前に、パフォーマンス改善の機会をプロアクティブに特定できます。

AIによるZendesk Webウィジェットの強化

AIを活用した自動化は、手作業を減らし、回答の正確性を高め、一般的な問い合わせに即座に対応することで、Zendesk Webウィジェットの機能を拡張できます。顧客はすぐに回答を得たり、適切なリソースに誘導されたりするため、迅速な解決と堅牢なサポート体験が可能になります。

eesel AIはZendeskのメッセージングウィジェットに直接統合できるため、現在使用しているインターフェースをそのまま維持できます。また、Zendeskですでに構築している強力なワークフローとeeselを併用することも可能です。

Zendeskは業界をリードするネイティブAI機能を提供していますが、eesel AIのようなサードパーティ製ソリューションは、Webウィジェットをさらに強化するための補完的な選択肢となります。統合プロセスでは、以下の4つの主要領域に焦点を当てます。

  • ビジネスニーズに合わせたカスタムワークフローによるチケット解決の自動化

  • 問い合わせを効率的に分類・割り当てするためのチケットルーティングの強化

  • エージェントにエスカレーションする前に問題をトラブルシューティングできる、よりスマートなチャットボットの対話

  • AIから有人サポートへ、Zendeskエコシステム内で会話をスムーズに移行させるシームレスなエージェントへの引き継ぎ

Webウィジェットをよりスマートに活用する

結局のところ、ZendeskのWebウィジェットは、セルフサービスを促進しリアルタイムの支援を提供することでカスタマーサポートを向上させる強力なツールです。AIを強化したチャットのためのメッセージング版でも、構造化されたチケット管理のためのクラシック版でも、Zendeskの成熟したプラットフォームはビジネスニーズに確実に応えてくれます。

Webウィジェットから最大限の価値を引き出すには、主要なパフォーマンス指標を追跡し、ヘルプセンターを最新の状態に保ち、ワークフローを改善して優れた顧客体験を提供し続けることが重要です。多くの企業が、AIを活用した自動化によってサポートを容易にスケールさせています。

補完ツールとしてeesel AIを活用することで、チームは回答の自動化、チケットの分類、応答の正確性の向上を実現し、エージェントがより複雑な問題に集中できる環境を整えることができます。WebウィジェットでのAI駆動の自動化テストに興味がある方は、こちらから7日間の無料トライアルを開始するか、詳細は hi@eesel.app までお問い合わせください。

よくある質問

Zendesk Webウィジェットは、Webサイトやヘルプセンターに直接埋め込むことができるカスタマーサポートツールです。顧客はページを離れることなく、ヘルプセンターの検索、サポートとのチャット、またはチケットの送信を行うことができます。

Zendesk管理センターで提供されるスクリプトを、サイトの</body>終了タグの直前に追加することでインストールできます。インストール後は、シークレットウィンドウで動作を確認することをお勧めします。

メッセージングWebウィジェットは、継続的な会話、リアルタイムチャット、ネイティブAI統合をサポートしていますが、クラシックバージョンは構造化されたチケットフォームとセッションベースのチャットに重点を置いています。モダンなライブチャットを求めるか、詳細なフォーム入力を求めるかによって選択が異なります。

はい。Zendesk Webウィジェットでは、色、テキスト、言語、配置場所をカスタマイズできます。エンタープライズユーザーは、Zendeskのブランディングを削除して自社のロゴを追加することも可能です。

はい、Zendesk Webウィジェットは、ブランドごとに個別のウィジェット設定を可能にすることで、マルチブランドアカウントをサポートしています。これにより、単一のZendeskアカウントを使用しながら、各ブランドが独自のアイデンティティを維持できます。

Zendesk Webウィジェットは、JWT認証とCORSポリシーを通じて安全なアクセスを提供します。これにより、許可されたユーザーのみが機密性の高いサポートデータにアクセスできることを保証し、不正アクセスを防止します。

はい、Zendesk WebウィジェットはZendeskのネイティブAI機能と連携するほか、eesel AIのようなサードパーティ製ツールを統合することもできます。これらの統合により、返信の自動化、チケットのルーティング、即時回答の提供が可能になり、効率が向上します。

この記事を共有

Iohan undefined

Article by

Iohan Chan

Iohanはeesel AIの専属ライターです。テクノロジー全般を愛する、エネルギッシュで楽しいことが大好きな人物です。SEOやブログの世界での経験とテクノロジーへの情熱を融合させ、素晴らしい記事を執筆しています。