フレッシュ·デスク·サポートデスク  vフリー   vグロース    vプロー    vエンタープライズ


オムニチャネルプラン  v  グロースオミニチャネル v プロオムニチャネル v エンタープライズオムニチャネル


 
:ヘルプウィジェットはバッチで展開されています。 アカウントの早期アクセスをリクエストするには、ここをクリックしてください。

 Freshdeskヘルプウィジェットを使用すると、ウェブサイトまたは商品内にソリューションの記事やコンタクトフォームを埋め込むことができます。お客様はサポートを必要とするときにソリューションの記事を検索したり、チケットを送信するために、ウィジェットを利用することができます。

 
また、お客様がボタンまたは「ヘルプについてはここをクリック」リンクなどのウェブサイト上のリンクをクリックしたときに、ウィジェットを開くことも可能です。このソリューションの記事では、ウィジェットを開くボタンまたはリンクを設定するプロセスについて説明します。

 これらを実際に行ったサンプルサイトを次に示します。


1.ボタンまたはリンクの作成

まず、お客様がクリックするボタンまたはリンクを決定し、ウィジェットを開きます。ボタンまたはリンクがまだない場合は、先に作成する必要があります。

-ボタンのサンプルコード:

-リンクのサンプルコード:


2.ウィジェットを開く関数を作成する

ボタンまたはリンクを作成したので、次に何をする必要があるかを定義できます。これは、JavaScript関数を使用して行われます。


JavaScript関数は、特定のアクション、またはアクションのセットを完了するためのコードです。


以下のサンプルコードでは、openWidget()という名前の関数を定義しています。openWidget()関数は、ウィジェットAPI FreshworksWidget( 'open');を使用して開くようにウィジェットに指示します。


関数の名前は参照用であり、必要に応じて変更することができます。


-openWidget()関数のサンプルコード:


この関数を埋め込みコード(Freshdeskからコピーしたもの)上と<script>タグ内に配置します。


3.ボタンまたはリンクがクリックされたときにウィジェットを開く

これまでに、以下の2つのことを行いました。


-ページにボタンを作成

-ウィジェットを開く関数を作成


次は、お客様がボタンまたはリンクをクリックしたときの、関数の実行です。これは、onclickイベントで実行できます。


onclickイベントは、ユーザーが機能(リンクやボタンなど)をクリックしたときに、設定された関数を実行します。


-onclickイベントのあるボタンのサンプルコード:

HTML

<button onclick = "openWidget()" type = "button">

このボタンをクリックしてウィジェットを開きます

</ button>



-onClickイベントでのリンクのサンプルコード:

次に、作成したJavaScript関数openWidget()とともに、ウィジェットの埋め込みコードで<script>タグがどのように表示されるかをお見せします。

これらを実際に行ったサンプルページを次に表示しています。



4.ウィジェットを非表示にする

ウィジェットを非表示にして、お客様がボタンやリンクをクリックしてサポートを求めるまでは、表示しないようにすることも可能です。これを行うためには、非表示ウィジェットAPIを使用します:FreshworksWidget( 'hide');


非表示ウィジェットAPIコードを使用する方法のひとつは、ページが読み込れるたびに実行することです。それにより、ウィジェットはデフォルトでお客様には非表示になり、リンクまたはボタンがクリックされたときにのみ開きます。


-bodyタグに含まれる非表示ウィジェットAPIコード

非表示ウィジェットAPIとオープンウィジェットAPIが実行されたサンプルページを表示しています。


 元記事:https://support.freshdesk.com/support/solutions/articles/50000001015-launching-the-widget-when-a-button-is-clicked