ネクストエクスペリエンス UI - テーマの理解 目次 概要Next Experience 内のすぐに利用可能な (OOB) テーマとは何ですか?ユーザーが設定からダークテーマを選択するにはどうすればよいですか?Next Experience UI16 の外観に新しいスタイルを適用するには?既存のPolarisテーマに新しいフォントまたは新しいスタイルを適用するにはどうすればよいですか?Next Experience がオフになっているときにワークスペースにカスタムテーマを適用する方法は?デフォルトですべてのユーザーに同じテーマを適用するにはどうすればよいですか?特定のスタイルを特定のロールのユーザーのみが利用できるようにするには?インスタンスレベルでロゴを変更するにはどうすればよいですか? すべての CSS プロパティに関する情報 概要 ネクストエクスペリエンスは、San Diego をはじめとする Now Platform 全体で生産性を向上させ、エンゲージメントを向上させ、インサイトを明らかにする、次世代の直観的でパーソナライズされたエクスペリエンスを提供します。すぐに利用可能な 2 種類のテーマが用意されています。1 つはデフォルト、もう 1 つはダークテーマです。顧客は独自のテーマエクスペリエンスを作成し、それを会社の標準と統合できます。テーマは、リスト、フォーム、およびダッシュボードのクラシック UI に適用されます。この記事では、ネクストエクスペリエンス内のインスタンスでテーマを構成する際に発生する可能性のあるすべての質問について説明します。 Next Experience ですぐに利用可能なテーマはどれか? San Diego リリースの時点で、Next Experience UI では UI16 ユーザー向けにすぐに使用できるテーマが 2 つだけ提供されています。 デフォルトのテーマ。 ダークテーマ。 ユーザーが設定からダークテーマを選択するにはどうすればよいですか? アドミンユーザーとしてログインします。 システムプロパティが存在しない場合は作成します。 次の値を使用します。 名前 - glide.ui.polaris.dark_themes_enabled 、タイプ:true|falseデフォルト値:true説明:ダークテーマが有効 4.[Submit (送信)] をクリックします。 注:「ダークテーマは、コア UI エクスペリエンスまたはカスタムエクスペリエンスには適用されません。」 - ネクストエクスペリエンスでのテーマの探索 詳細情報 - ネクストエクスペリエンスシステムプロパティ Next Experience UI16 の外観に新しいスタイルを適用する方法 UI16 では、以下のスクリーンショットのように、インスタンスに異なるスタイルを選択できます。 同様に、さまざまなスタイルを作成してPolarisテーマに関連付けることができるため、ユーザーはさまざまなオプションから選択できます。ステップス：- UX スタイル [sys_ux_style] テーブルに移動します。 新しいレコードを作成します。 名前:たとえば、スタイルレコードごとに名前を付けます。青と緑、コントラストUI、ローズなど タイプ:バリアントスタイル- { "base": { "--now-color--neutral": "85,107,47", "--now-color--primary": "32,178,170", "--now-color--secondary": "255,165,0", "--now-color_selection--primary": "0,123,88", "--now-color_selection--secondary": "79,82,189"}, "properties":{ "--now-actionable--border-radius":"4px", "--now-actionable--border-width":"1px", "--now-container--border-radius":"4px", "--now-font-family": "Comic Sans MS, Courier,Aria, sans-serif", "--now-line-height-crop--before": "-0.25775em", "--now-line-height-crop--after": "-0.27825em" } } 3.[Submit (送信)] をクリックします。 4.m2m_theme_style.list テーブルに移動するか、[関連リスト - UX テーマスタイル] に移動します。 5.新しいレコードを作成 スタイル:新しく作成されたスタイルを選択テーマ:Polaris を選択適用:このスタイルを表示するロールをユーザーに選択します。例:すべての管理者のみがこの新しいスタイルをオプションとして持つ必要があります。 6.[Submit (送信)] をクリックします。 これにより、[設定] - [テーマ] に移動すると、追加のオプションが有効になります。参考として以下のスクリーンショット。 既存のPolarisテーマに新しいフォントまたは新しいスタイルを適用するにはどうすればよいですか? ステップス：- UX スタイル [sys_ux_style] テーブルに移動します。 新しいレコードを作成します。 名前:たとえば、スタイルレコードごとに名前を付けます。青と緑、コントラストUI、ローズなど タイプ:コアスタイル- { "properties":{ "--now-font-family": "Didot" } } [Submit (送信)] をクリックします。 m2m_theme_style.list テーブルに移動するか、[関連リスト - UX テーマスタイル] に移動します。 新しいレコードを作成 スタイル:新しく作成されたスタイルを選択テーマ:Polaris を選択適用:このスタイルを表示するロールをユーザーに選択します。例:すべての管理者のみがこの新しいスタイルをオプションとして持つ必要があります。 [Submit (送信)] をクリックします。 これにより、Polarisテーマが Didot フォントで有効になります。 Next Experience がオフになっているときにワークスペースにカスタムテーマを適用する方法は? Now Experience フレームワーク - テーマに移動します新しいテーマレコードを作成Base Agent Workspace テーマを拡張していることを確認するカスタムテーマを決定する必要な CSS 変数の値をテーマフィールドに入力します。 { "--now-color_brand--primary": "138,48,127", "--now-color--neutral-15": "104,131,188", "--now-chrome-tabs--background-color": "188,161,104", "--now-canvas-toolbar-button--background-color--focus": "188,161,104", "--now-button--primary--background-color": "104,131,188", "--now-button--secondary--background-color": "104,173,188", "--now-content-tree--background-color--selected":"188,161,104", "--now-container--border-color":"104,121,188", "--now-content-tree_sidebar--background-color--selected":"104,121,188", "--now-color_surface--brand-2":"104,131,188", "--now-window-background-color":"188,161,104"} テーマレコードとエクスペリエンスの関連付け デフォルトですべてのユーザーに同じテーマを適用するにはどうすればよいですか? ユーザー設定:glide.ui.polaris.theme.variant を使用できます。たとえば、すべてのユーザーにダークテーマを適用するとします。 UX スタイル [sys_ux_style] テーブルに移動します。 デフォルトで適用するスタイルの sys id を確認します。ユーザー設定テーブルに移動:sys_user_preference新しいレコードを作成します。 名前:glide.ui.polaris.theme.variant値:e09ef7ae07103010e03948f78ad3002cシステム:true 5. 送信 テストユーザーでログインし、変更を確認します。 特定のスタイルを特定のロールのユーザーのみが利用できるようにするには? 適用性:ベーステーマに上書きを適用する適用性を指定します。適用性の制約を満たすユーザーには、ベーススタイルではなく、テーマでそれらの上書きが表示されます。たとえば、異なるフォントのスタイルがマネージャーのリストに適用できるとします。マネージャーには、ベースシステムのテーマ値を上書きした新しいスタイルのフォントを含む UI が表示されます。したがって、該当する対象者向けに変更を加えたテーマ全体をコピーする必要はありません。 製品ドキュメントの 従うべき手順:- たとえば、スタイルをテーマに関連付ける場合。Polaris テーマ UX テーマスタイル [m2m_theme_style] テーブルで、必ず [適用] を追加してください。 一度に 1 つのロールを追加できます。 インスタンスレベルでロゴを変更するにはどうすればよいですか? フィルターナビゲーターに「基本構成 U16」と入力してください。U16のバナーイメージとしてオプションが表示されますファイルをアップロードしてレコードを保存してくださいアップロードされた画像が表示されない場合は、cache.do してくださいインスタンスで logout.do して再度ログに記録してみてください。 すべての CSS プロパティに関する情報 いくつかの CSS プロパティは、ドキュメントに次のようにリストされています。Next Experience CSS テーマ作成のカスタムプロパティ sys_ux_theme_propertyテーブルには、すべての CSS プロパティのリストが含まれています。 NDS コンポーネントには、 開発ポータルに一覧表示されるテーマプロパティがあります