採用設定の設定

採用設定は、管理者ロールを持つユーザーのみがアクセスできます。

ガイドを公開するためのステップをまとめた手順については、ガイドの展開: エンドツーエンドを参照してください。

採用設定では、Web アプリケーション内のすべてのガイドのデフォルト動作を設定できます。これには、Guides Editor におけるコンテンツ開発の形を決める要素セレクターとガイドコンポーネントのセットアップが含まれます。さらに、コンテキストヘルプを表示するためのデフォルトオプションを選択することもできます。

採用設定には次のサブタブが含まれます。

設定サブタブ
ローカライズサブタブ
テーマサブタブ
コンテキストヘルプサブタブ

選択されたアプリケーションの採用設定を構成する

Nexthink Applications > アプリケーションを管理から、ガイドがあるWebアプリケーションを選択します。 採用設定タブ > 設定サブタブを開くには次の操作を行います。

ガイドのコンポーネント動作のガイドデフォルトを有効または無効にします。
要素セレクターのためにあらかじめ定義された手順に基づき、Guides Editor が Web アプリケーションからページ要素をどのように直接取得するかを決定します。
設定を保存。

ガイドデフォルトの設定

ガイドのコンポーネントのデフォルト動作を構成します:

キーのページ選択を無視: 指定された要素がアプリケーションページビューに存在するたびに、ガイドステップやコンポーネントが表示されるようになります。
- これはシステムが主要ページを無視し、要素セレクタのみに基づいてガイドステップを表示することを意味します。
記録されたクエリパラメータを無視する: ステップが特定のURLにナビゲートし、たとえばhttp://google.com/?queryというクエリが含まれている場合、この設定を有効にしてクエリ、つまり/?以降のすべてを無視し、基本URLのみを使用します。
ユーザーがスクロールするときに位置を再計算する機能を有効にします。これは、メインページ以外にもスクロールバーを持つ複数のコンテナがある場合に便利です。一般的に、Guides はステップに関連する要素に到達するため、メインページをスクロールしようとします。このオプションを有効にして、element IDを指定することで、そのコンテナへのスクロールに制限を課すことができます。
要素が覆われていない場合にステップを表示する：モーダルダイアログなど、追加の層に覆われていない場合にのみガイドステップを表示させます。選択を解除すると、追加の層があってもステップが表示されます。
完了後にステップを維持する：ユーザーが完了した後もガイドステップをそのままにします。
- 任意の: ステップへのユーザーの操作に関係なく設定が機能します。
- 再読み込み時：ページの再読み込み時に設定が機能します。
- ナビゲート時： ユーザーがURLを変更したときに設定が機能します。
- バックフォワードでの動作: 設定はユーザーが前のページに戻るときに機能します。

特定のガイドオーバーレイ（ステップ、アクション、ツールチップなど）の位置プロパティタブを設定する際に、ガイドのデフォルト をカスタマイズできます。ガイドの種類に関係なく、ウェブアプリケーション上の Adopt Editor から直接設定できます。

記録されたクエリパラメーターを無視、ユーザーがスクロールした際の位置再計算を有効化、および スクロールコンテナの場所 の各機能は、Nexthink Guides の改善に伴い廃止予定です。

セレクターフレームワークの定義

Adopt Editor がウェブアプリケーションからページ要素を直接取得する方法について、デフォルトの指示を指定するために、要素セレクター および セレクター上書き を設定します。これらの指示は、Adopt が内部レンダリング構造を解釈するために使用する セレクター システムを定義します。

Nexthinkは、次の方法で要素の選択を微調整するのに役立ちます:

要素を見つける可能性を高めるための複数のセレクタータイプを特定します。
動的に生成された識別子を検出し、信頼性のあるガイドオーバーレイ表示のために動的コンポーネントから削除します。

特定のガイドオーバーレイ（ステップ、アクション、ツールチップなど）の位置プロパティタブを設定する際に、セレクター の設定をカスタマイズできます。ガイドの種類に関係なく、ウェブアプリケーション上の Adopt Editor から直接設定できます。

さらに、ウォークスルーステップで検出された不安定なセレクターを 自動修正（Auto-fix） することもできます。詳細については、ウォークスルーステップの定義を参照してください。

要素セレクタの定義

実際の要素セレクター例については、以下を参照してください：

Guides Editor で要素をキャプチャする際の不安定さを避けるため、以下の 要素セレクター フィールドに入力します。要素セレクターはケースバイケースであり、一部のWebサイトは他よりも複雑なデザインを持っています。

設定を保存した後に 要素セレクター フィールドを更新しても、その後に行われる要素選択にのみ影響し、Guides Editor ですでに構成されている既存のガイドコンポーネント内の要素セレクターは更新されません。

要素セレクターフィールドの更新には、Webページからの属性の識別と抽出に慣れている必要があります。例えば、要素IDなどです。

無視された要素IDフィールド

要素IDはページ要素を指し示す最も一般的な手段です。ただし、要素の可視性はユーザーやページの状態に依存するため、これは常に適用されるわけではありません。

この設定により、ステップを記録する際に常に存在するとは限らない要素を無視することができます。複数の要素をカンマで区切って含めることができます。

ID置換またはクラス名置換フィールド

ID置換またはクラス名置換フィールドを使用して、IDまたはクラス名セレクターから数字などの動的要素を削除し、関心のある静的セグメントのみを保持するようシステムに指示します。

ID 替換の実際の使用例については、ユースケース: Microsoft Dynamics用のエレメントセレクタードキュメントを参照してください。

無視された要素のクラス名フィールド

複数の HTML 要素がクラス名を使用でき、これらはページ状態の異なる表現をもたらす視覚スタイルでよく用いられます。

この設定により、これらの異なる状態の結果を無視することができ、ガイドステップに干渉する可能性があります。複数の要素をカンマで区切って含めることができます。

含まれる要素のカスタム属性名フィールド

動的クラス名を扱う場合、動的な要素を取り除くとページ状態の表現に問題を引き起こす可能性があります。この設定では、ガイドステップで要素が記録される際にdiv内に存在するカスタム属性を使用することができます。カンマで区切って複数の要素を含めることができます。

Shadow DOMを使用した SAP SuccessFactors のウェブアプリケーションページ要素の例:

data-ui5-stable

セレクタ検証ルール

Guides のセレクターシステムは、一連の検証ルールに従い、構成されたすべての要素、パターン、および置換が有効であり、Web アプリケーション間で一貫して機能することを保証します。

オプションフィールド: すべてのセレクターフィールドはオプションです。構成に必要ない場合は、任意のフィールドを空白のままにすることができます。
正規表現パターンフィールド: 以下のフィールドには有効な正規表現が含まれている必要があり、特定のフォーマットルールに従う必要があります:
- 無視された要素ID
- 無視された要素クラス名
- クラス名置換 → パターン
- 要素ID置換 → パターン
これらのパターンは次の要件を満たす必要があります:
- 有効な正規表現であること。
- 数字で始めないこと。
- 二重引用符を \" としてエスケープすること。
- エスケープされたバックスラッシュを含まないこと。
カスタム属性フィールド: フィールド 含まれる要素のカスタム属性名 には、有効な HTML 属性名を含める必要があります。例えば: data-user または aria-label。
置換フィールド: フィールド クラス名置換 → 置換子 および 要素ID置換 → 置換子 には、有効な CSS セレクターを含める必要があります（例えば #element-id または .element-class）。

要素セレクターのオーバーライドの有効化/無効化

要素セレクターの上書き を更新しても、その後に行われる要素選択にのみ影響し、Guides Editor ですでに構成されている既存のガイドコンポーネント内の要素セレクターの上書きは更新されません。

これらのオプションは、特定アプリケーションに対してデフォルトで有効にするセレクターを定義することを可能にします。

要素 XPath: 言語特有の要素テキスト値に基づくセレクタ。例えば: (/html/body//span[contains(translate(.,'AÁÄBCČDĎEÉFGHIÍJKLĽĹMNŇOÓÔPQRŘŔSŠTŤUÚVWXYÝZŽ ','aáäbcčdďeéfghiíjklľĺmnňoóôpqrřŕsštťuúvwxyýzž'),concat('new',''))][not(ancestor-or-self::yes-elf-holder)])[3]
要素 CSS 相対パス: タグ名、クラス名、ID、nth-child からなる相対 CSS セレクタ。例えば: div#target.element:nth-child(0)
- 各レベルは>結合子で区切られています。
- 利用可能であれば、IDを持つ最も近い親から開始します。
限定されたXPath要素: 相対CSSパスに相当しますが、XPath形式で表現されています。通常は自動生成され、評価が遅い。例えば: input[@id='...'][contains(@class,'textbox')]
要素のCSS相対パス限定: CSS相対パスと同様ですが、nth-child()擬似クラスを除外します。要素が兄弟の中でユニークな場合、位置を指定する必要がない場合に使用します。例えば: input#RequestID_input.alignmentLeft.field.textbox
要素 CSS 表現パス: 複数のクラス名に依存し、ターゲット要素を相対セレクタで定義するセレクタ。例えば: .class1 .class2 > div#target.element:nth-child(0)
要素 CSS クラスのみパス: クラス名のみを使用して作成されたセレクタ—ID やタグは使用しません。例えば: .applicationShell-2 .active-form.dialog-container
要素のCSSタグのみのパス: タグ名とnth-child()擬似クラスのみを使用したセレクタ、それらを>で結合します。クラスまたは ID が存在しない場合に便利です。例えば: html > body > div:nth-child(3) > div:nth-child(1) > input:nth-child(4)

Guides Editor でガイドオーバーレイの位置を構成する際、上記に加えて次の 要素セレクターの上書き を有効化または無効化できます。

Element JSPath: 合成されたパスとShadow DOMのトラバースに基づくセレクタ。例: body > ui5-static-area > ui5-static-area-item-sf-header,...

Webページから要素セレクターを抽出する

要素セレクターの定義時にWebページから属性を抽出するのが初めての場合、次の手順に従ってください:

Webページから属性を特定して抽出する

設定タブで要素セレクタを定義するには、まずウェブページから属性を直接特定して抽出する必要があります。

あなたのブラウザから:

MS EdgeとChromeブラウザ内で開発者ツールを起動します (F12)。
- 他の手段として、右クリックしてインスペクトします。
ツールバー内のアイコンをクリックしてください。
マウスカーソルを使用して必要な要素を選択します。
右側のElementsパネルから選択した要素に関連するデータが見えるでしょう。
どの属性が安定したデータを含んでいるか評価します。比較として5〜6の要素をサンプルしてください。

または、Nexthink ブラウザー拡張機能を使用して、Web アプリケーションページから CSS セレクター を抽出します。この拡張機能は現在、Firefox をサポートしていません。

以下の画像では、data-automation-id 属性が要素セレクタの候補です。

Webページ上のドロップダウンやメニューなど、Shadow DOMでカプセル化された動的に複雑な要素の場合、単なる属性抽出では一致する精度が十分でないことがあります。

実際の要素セレクターの例については、次を参照してください:

アプリケーションテンプレートからセレクターを使用する

アプリケーションテンプレートを選択すると、必要なセレクター設定が自動的に入力され、ガイドコンテンツ作成前の手動での事前設定が不要となります。

アプリケーションテンプレートの実装に関する情報は、ウェブアプリケーションの設定を参照してください。

セレクター設定:

エディター内の要素ピッカーにのみ影響する
既存のガイドや手順を変更しない
最終利用者には反映されません

テンプレートが適用される前にアプリケーションにセレクター設定がある場合、テンプレートの適用によりそれらは上書きされます。新しいセレクターを後から追加することはできますが、テンプレートによって提供されるものを削除することはできません。

テンプレートの選択は不可逆的なプロセスです。

テンプレートをカスタムセレクター置換で上書きする

組織の必要性に応じて、サポートされている企業向けアプリケーションのカスタマイズ版を展開することが可能です。これらの環境では、DOM構造が標準的なベンダー実装と異なる場合があります。たとえば：

クラス名がリネームされたりプレフィックスが付与されることがあります。
要素IDがデフォルトの構造と異なる場合があります。
特定のコンポーネントは追加のコンテナでラップされる場合があります。

セレクタシステムは、これらのバリエーションに対応するために制御されたオーバーライドをサポートしています。オーバーライドできるもの:

クラス名
要素 ID

これにより、テンプレートベースのセレクタが、基礎となるテンプレート構成を変更することなく、顧客固有の実装に正しくマッピングされます。

サポートされているテンプレート

セレクタテンプレートは次のアプリケーションで利用可能です:

ワークデイ
Microsoft Dynamics
Salesforce Lightning
SAP Concur

フィールドに永続的なセレクタ入力を持つ

一部のフィールドは、変更された場合、常に顧客入力を保持します:

classOnly.pattern
classOnly.replacer
idOnly.pattern
idOnly.replacer
属性ブロックリストと許可リストの値

以下のフィールドは、選択したモードに依存します:

excludedLocations
disabledLocationPaths
関連するチェックボックス

テンプレートを選択すると、更新が自動的に適用されます。テンプレートの更新は、カスタム値を変更しません。

ユーザー履歴をリセット

Nexthink Guides は、ガイドの閲覧および完了といったユーザー操作をデータベースに保存します。管理者は、このデータを特定のユーザー単位で、またはアプリケーション全体に対して削除することができます。削除するユーザーを指定するには、そのNQL IDを入力してください。

保存されたユーザー操作は、ガイド条件チェックをサポートします。公開済みのガイドをテストした後、自分のインタラクション履歴をリセットして、クリーンな状態からの動作を確認できます。

アドプション履歴のリセットは取り消しできません。

選択したアプリケーション用のローカライズ設定を構成する

ローカリゼーション は、従業員のブラウザ設定に基づいてAIによる自動翻訳を使用してガイドの内容をローカライズします。

採用コンテンツをローカライズするには二つの方法があります: AIによる方法と手動で翻訳を提供する方法です。

AIローカリゼーションはガイド名とその手順内のすべてのコンテンツに影響を及ぼします。
手動翻訳はガイドの手順内のすべてのコンテンツに影響を及ぼしますが、ガイド名を異なる言語に適合させるために変更することはできません。

ローカリゼーションを有効化するには、Nexthinkの Applications > Manage applications からガイドを含むWebアプリケーションを選択します。 Adoption settingsタブ > Localizationサブタブを開きます:

最大5つの言語を選択できます。ユーザーの言語が選択されたオプションの中にない場合、システムはデフォルトで英語を使用します。

ローカリゼーションタブで言語セットを選択した後、特定のガイドを作成または設定する際は、コンテンツ翻訳を有効化してください。この翻訳はガイドレベルで有効化されます。

選択したアプリケーション用の Guides テーマのカスタマイズ

テーマを設定するには、アプリケーション管理に移動し、必要なアプリケーションを選択してから、導入設定とテーマタブを選択してください。

Guides がコンテキストヘルプやステップ、アクション、ツールチップなどのガイドコンテンツを表示する際のデフォルト配色として使用する テーマ を選択します。

選択したアプリケーションのテーマをカスタマイズするには:

Navi、Light、または Dark からテーマを選択してください。
LightまたはDarkでは、HEXカラーコードを使用してカスタムのアクセントカラーを選ぶことができます。例えば: #1046a8.
変更をアプリケーションとガイドコンテンツに適用するため、保存してください。

Navi テーマは追加オプションとして提供され、カスタマイズすることはできません。

コンテキストヘルプアイコン

Guides が従業員に表示するコンテキストヘルプアイコンを選択します。 Guides が提供するアイコンを使用するには、Default を選択し、Save をクリックして変更を適用します。

選択したアプリケーションに対してカスタムのアイコンを設定するには:

PNG または SVG 画像ファイルタイプをアセットライブラリにアップロードします。
画像を選択し、利用可能なアセットから画像を見つけてください。
導入設定 > テーマタブで、アイコンの背景色をHEXコードで選択してください。例: #1046a8
選択したアイコンと色のプレビューを確認します。
変更をアプリケーションに適用するには、保存をクリックしてください。

Nexthinkは、アイコンの以下のプロパティを推奨します:

PNG または SVG 画像ファイルタイプ
最小サイズ: 36 x 36 ピクセル
正方形のアスペクト比

Navi テーマとアイコンは追加オプションとして提供されていますが、カスタマイズすることはできません。

HEXカラー規則は16進数（基数16）桁を使用して色を指定します。これらの数字は 00 から FF までの赤、緑、青の強度を示すようにペア（RR、GG、BB）でグループ化されています。

選択したアプリケーション用のコンテキストヘルプ設定を構成します

ウェブアプリケーション内のクエスチョンマークアイコンからアクセスできるコンテキストヘルプは、従業員が自己支援のためにコンテキスト特有のガイドやドキュメントを検索することができます。

ターゲットアプリケーションサイトでデフォルトでコンテキストヘルプポップアップがどのように表示され動作するかを設定します。

Nexthink アプリケーション > アプリケーションを管理から、ガイドを含むウェブアプリケーションを選択します。 Adoption settingsタブ > コンテキストヘルプサブタブを開きます:

オプションとして、表示中のウォークスルーを抑制する。
任意で、構成をカスタマイズしてください。
設定を保存.

表示中のウォークスルーを抑制する

従業員がコンテキストヘルプポップアップから新しいガイドを開始するときに、表示中のウォークスルーを抑制することができます。この設定により、2つのガイドが同時に表示されることを防ぎます。

コンポジション

オプションで、ガイドジャーニー、ウォークスルー、およびメディア型ガイドを分類するためにコンテキストヘルプポップアップに表示されるヘッダーを変更します。必要に応じて、デフォルトのヘッダーを保持します。
ユーザーに表示されるそれらのセクション内のガイドジャーニーの視覚順序を並べ替えます。