アプリケーション カスタマイザーを使用して Viva コネクション デスクトップを拡張する
Viva コネクション デスクトップ エクスペリエンスは、Microsoft 365 テナントのホーム サイトとして選択された SharePoint サイトによってサポートされます。 アプリケーション カスタマイザーを使用すると、サイト内のすべてのページにカスタム コードを追加できます。
最新の Web テクノロジーを使用してアプリケーション カスタマイザーを構築します。 組織内の SharePoint 管理者がそれらを展開すると、アプリケーション カスタマイザーは選択したサイトで自動的に有効になります。
次のセクションでは、Viva コネクションを拡張する方法を計画するときに考慮する必要があるアプリケーション カスタマイザーの最も重要な特性について説明します。
重要
アプリケーション カスタマイザーは、Viva コネクション デスクトップ エクスペリエンスでのみ動作します。 モバイル Viva コネクション アプリでは機能しません。
アプリケーション カスタマイザーは UI を持っている必要はありません
アプリケーション カスタマイザーは UI を使用できますが、必須ではありません。 アプリケーション カスタマイザーを使用して、サイト内のすべてのページにカスタム コードを追加できます。 各ページを手動で変更する代わりに、サイトでカスタム アプリケーション カスタマイザーを構築して有効にし、すべてのページにカスタム コードを一度に追加できます。 また、コードを更新したり無効にしたりする必要がある場合は、中央の場所から実行できるため、時間を節約できます。
アプリケーション カスタマイザーは UI を必要としないため、分析スクリプトをページに追加したり、API から一部のデータを事前に取得したりする必要がある場合は、推奨されるソリューションです。 UI をレンダリングすることを選択しない限り、アプリケーション カスタマイザーは画面上のスペースを占有しません。
注意
Viva コネクションを強化する SharePoint は、サイトとページの外観を変更するために使用できる、定義済みの拡張ポイントのセットを公開します。 顧客は、これらの拡張ポイントの外に出て、たとえばフォント ファミリを変更したり、DOM 操作を通じてページ上のメニュー項目を再配置したりするように要求する場合があります。 これを行う必要はありません。
ページの DOM は API ではありません。 いつでも変更される可能性があり、予告なしにカスタマイズが破損するかもしれないリスクがあります。 DOM を操作することで、変更で考慮されなかったいくつかの新機能が破壊される可能性もあります。
アプリケーション カスタマイザーの UI はプレースホルダーにアタッチされています
アプリケーション カスタマイザーを構築するときに、事前定義されたプレースホルダーの 1 つで UI をレンダリングすることを選択できます。 現時点では、上と下の 2 つのプレースホルダーを使用できます。 上のプレースホルダーは、スイートのナビゲーション バーとサイトのナビゲーションの間に表示されます。 下のプレースホルダーはページの末尾に表示されます。
プレースホルダーで UI をレンダリングすることを選択すると、アプリケーション カスタマイザーに固有のコンテナー DOM 要素を取得します。 各アプリケーション カスタマイザーは独自の DOM 要素を取得するため、複数のアプリケーション カスタマイザーは、互いのコンテンツを上書きすることなく、同じプレースホルダーで UI をレンダリングできます。
複数のアプリケーション カスタマイザーがコンテンツをプレースホルダーでレンダリングすると、開発者が定義した順序でスタックされます。 必要に応じて、サイト管理者は、サイトでアプリケーション カスタマイザーを有効にした後、プログラムでこの順序を変更できます。
プレースホルダーを使用してアプリケーション カスタマイザーの UI をレンダリングする代わりに、フローティング UI を構築できます。 フローティング UI は、すべてのページのコンテンツの上に浮動する Web チャットを追加する必要がある場合に役立ちます。 HTML をプレースホルダー内にレンダリングする代わりに、ページの BODY に追加し、CSS を使用してページのコンテンツの上にフロートさせます。
アプリケーション カスタマイザー用の UI を構築するときは、CSS と HTML を所有します。 Fluent UI デザイン言語を使用して、ソリューションを Viva コネクションとシームレスに統合することを検討してください。
開発者はアプリ カスタマイザーの位置を定義します
開発者は、構築するアプリケーション カスタマイザーに UI を含めるかどうかを決定します。 アプリケーション カスタマイザーに UI が必要な場合、それをアタッチするプレースホルダーを決定します。
既定では、コンテンツ エディターはアプリケーション カスタマイザーを制御できません。 サイト管理者は、アプリケーション カスタマイザーを有効にするか無効にするかを選択できますが、ページ上のどこに配置するかを制御することはできません。
開発者は、サイト所有者がアプリケーション カスタマイザーを構成できるようにするカスタム コードを作成できます。 カスタム フッターを表示するアプリケーション カスタマイザーを作成するとします。 サイト所有者に、フッターのコンテンツを管理するためのカスタム構成 UI を提供できます。
重要
アプリケーション カスタマイザーに構成 UI を提供する場合は、自分で作成する必要があります。 サイト上のすべてのページに変更が表示されるため、サイト所有者のみが構成を管理できるようにします。
サイト管理者は、アプリケーション カスタマイザーを構成できます
アプリケーション カスタマイザーは、制限された構成機能をサポートします。 アプリケーション カスタマイザーを構築する場合、カスタム構成プロパティを定義できますが、ユーザーが構成できる UI はありません。 代わりに、これらのプロパティの値を指定するには、API または PowerShell を使用します。
アプリケーション カスタマイザーの構成プロパティを使用すると、ソリューションをパラメータ化して、さまざまなシナリオで再利用できます。 通常、ソリューションで提供するインストール スクリプトでそれらを構成します。
推奨事項
Viva コネクション デスクトップ エクスペリエンスのすべてのページにコードを追加する場合は、アプリケーション カスタマイザーを構築することを検討してください。 ソリューションに UI が必要ない場合、または UI が使用可能なプレースホルダーの 1 つに表示されるのに適している場合は、アプリケーション カスタマイザーを作成します。
次の演習では、SharePoint リストから情報を取得し、それをページの上のプレースホルダーに表示する、アプリケーション カスタマイザーを作成します。 また、ソリューションをテストし、Viva コネクションにデプロイします。