詳細情報:
Flexcard 要素のスタイル設定 (管理パッケージ)
管理パッケージランタイムの場合、個々の要素、要素内の項目、および状態全体をスタイル設定して FlexCard のデザインを設定します。Flexcard Designer の [スタイル] パネルから、背景、テキスト、境界線のデザイン、要素内および要素間の高さ、幅、間隔の調整、クラスおよびインラインスタイルの適用、要素の応答性の向上などを行うことができます。
この情報は、OmniStudio for Managed Packages 用です。標準ランタイムの OmniStudio については、OmniStudio ヘルプを参照してください。
要素のスタイル設定を保存して、FlexCard の複数の要素で使用します。Flexcard Designer のコードエディターからカスタムクラスを作成し、個々の要素に適用します。サポートされている要素では、テキスト要素の表示ラベルや値など、要素内の特定の項目にクラスを追加します。データ項目の値に基づいて、条件付きでスタイルを適用します。
すべての要素で使用できるスタイルオプション
スタイルパネルセクション |
説明 |
リファレンス |
|---|---|---|
条件付きスタイルの追加 |
要素に条件付きでスタイルを適用します。データ項目の値に基づいて条件を満たした場合のテキストの色や応答性などのスタイル機能を変更します。 |
|
アライメント |
要素のパディング、余白、テキストの配置を更新します。 |
|
表示 |
要素の色、背景、境界線を設定します。 |
|
カスタムスタイル |
Flexcard 要素のスタイル設定をカスタムスタイルとして保存し、Flexcard の複数の要素で使用します。 |
|
カスタム |
カスタムクラスを作成して適用し、インラインスタイルを要素に追加します。 |
|
ディメンション |
高さを設定し、要素の応答性を設定します。 |
- 特定の FlexCard のグローバル ニューポートおよび Lightning スタイルの上書き(管理パッケージ)
管理パッケージランタイムの場合、特定の Flexcard のグローバル Newport スタイルまたは Lightning スタイルを上書きします。FlexCard Designer の [設定] パネルから新しいカスタムスタイルを静的リソースとして読み込みます。たとえば、FlexCard の複数のコンポーネントに特定のブランド要件を適用します。 - Flexcard 要素への条件付きスタイルの追加 (管理パッケージ)
管理パッケージランタイムの場合、条件付きで FlexCard 要素にスタイルを適用します。テキストの色、背景画像、データ項目の値に基づく条件を満たした場合の応答性などのスタイル機能を変更します。たとえば、請求状況が期日を過ぎた場合に請求 FlexCard を赤い境界線で囲みます。 - FlexCards 要素ディメンション (管理パッケージ)
管理パッケージランタイムの場合、高さと幅を設定し、Flexcard Designer 内で Flexcard 要素の応答性を設定します。キャンバス上でドラッグマーカーをクリックして左右に移動することで要素の幅を調整するほか、[スタイル] パネルのスライダーを使用して幅を調整します。 - FlexCards 要素の外観 (管理パッケージ)
管理パッケージランタイムの場合、Flexcard Designer の [スタイル] パネルの [外観] プロパティを使用して Flexcard 要素の外観を更新します。テキストの色、背景、境界線を変更し、要素の Salesforce テーマを設定します。 - FlexCards 要素のアライメント (管理パッケージ)
管理パッケージランタイムの場合、Flexcard Designer の [スタイル] パネルの [配置] プロパティを使用して、要素の内部と周囲にスペースを作成できます。要素のコンテナに対するテキストの位置を調整することもできます。 - Flexcard 要素のカスタム CSS (管理パッケージ)
管理パッケージランタイムの場合、Flexcard Designer でカスタム CSS クラスとインラインスタイルを作成、編集し、Flexcard 要素に適用します。[スタイル] パネルのデザインインターフェースで使用できるスタイル設定オプションがデザインニーズに合わない場合は、デザイナー内のコードエディターからカスタム CSS クラスを作成し、サポートされる項目に適用します。または、特定の要素にインラインスタイルを追加します。 - Flexcard Designer 内でのカスタム CSS の作成 (管理パッケージ)
管理パッケージランタイムの場合、Flexcard Designer 内でカスタム CSS クラスを作成し、Flexcard 要素または要素内のサポートされる項目に適用します。[スタイル] パネルのデザインインターフェースがデザインのニーズを満たさない場合は、カスタム CSS クラスを作成します。 - Flexcard 要素へのカスタム CSS の適用 (管理パッケージ)
管理パッケージランタイムの場合、Flexcard Designer の [スタイル] パネルで使用できるデザインインターフェースが設計ニーズを満たしていない場合、カスタム CSS を要素に適用します。カスタム CSS を追加して、要素または子要素の内部コンポーネントを編集します。パフォーマンスを最適化するには、この機能を慎重に使用してください。 - Flexcard 要素へのインラインスタイルの追加 (管理パッケージ)
管理パッケージランタイムの場合、Flexcard Designer のデザインインターフェースから使用できるスタイル設定オプションが設計ニーズを満たさないときは、インライン CSS スタイルを Flexcard の要素に追加します。クラスを上書きし、特定の要素または要素コンポーネントを対象にします。 - FlexCards アクションスタイルのプロパティ (管理パッケージ)
管理パッケージランタイムの場合、Flexcard Designer の [スタイル] パネルからアクション要素に固有のスタイルプロパティを設定します。 - FlexCards ブロックスタイルプロパティ (管理パッケージ)
管理パッケージランタイムの場合、Flexcard Designer の [スタイル] パネルからブロック要素に固有のスタイルプロパティを設定します。 - FlexCards グラフスタイルのプロパティ (管理パッケージ)
管理パッケージランタイムの場合、Flexcard Designer の [スタイル] パネルからグラフ要素に固有のスタイルプロパティを設定します。 - FlexCards データテーブルスタイルプロパティ (管理パッケージ)
管理パッケージランタイムの場合、Flexcard Designer の [スタイル] パネルからデータテーブル要素に固有のスタイルプロパティを設定します。 - FlexCards 項目スタイルプロパティ (管理パッケージ)
管理パッケージランタイムの場合、Flexcard Designer の [スタイル] パネルから項目要素に固有のスタイルプロパティを設定します。 - FlexCards アイコンスタイルプロパティ (管理パッケージ)
管理パッケージランタイムの場合、Flexcard Designer の [スタイル] パネルからアイコン要素に固有のスタイルプロパティを設定します。 - FlexCards メニュースタイルのプロパティ (管理パッケージ)
管理パッケージランタイムの場合、Flexcard Designer の [スタイル] パネルからメニュー要素に固有のスタイルプロパティを設定します。 - FlexCard の切り替えスタイルのプロパティ (管理パッケージ)
管理パッケージランタイムの場合、Flexcard Designer の [スタイル] パネルから切り替え要素に固有のスタイルプロパティを設定します。 - FlexCard 要素のカスタムスタイルの作成 (管理パッケージ)
管理パッケージランタイムの場合、Flexcard 要素のスタイル設定を [カスタムスタイル] として保存し、Flexcard の複数の要素で使用します。たとえば、FlexCard の複数の Field 要素に同じフォントの色、フォントサイズ、テキストの色、背景色を適用するには、1 つの Field 要素に blue-field-scheme というカスタムスタイルを作成します。次に、必要に応じて青項目スキームを他の項目要素に適用します。 - FlexCard でのレコードの並列表示 (管理パッケージ)
管理パッケージランタイムの場合、子 FlexCard を埋め込んで状態の幅を調整することで、レコードを積み上げるのではなく横に並べて表示します。デフォルトでは、FlexCard の個々の要素の幅に関係なく、レコードは 1 つ重ねて表示されます。 - FlexCard (管理パッケージ) の要素の配置、複製、削除
管理パッケージランタイムの場合、Flexcard Designer で Flexcard のキャンバス上の要素を配置、複製、削除します。要素をキャンバスにドラッグし、他の要素の下、上、横にドラッグして並び替えます。1 回のクリックで要素を複製および削除します。 - Newport Design System (管理パッケージ) を使用した FlexCard のグローバルなブランド設定
管理パッケージランタイムの場合、Newport Design System を使用して組織全体で FlexCard の外観をカスタマイズします。Newport Design System では、既存の Newport CSS スタイルをダウンロードして編集し、独自のカスタマイズで上書きできます。Newport には、ブラウザーベースのプレビューツールである Storybook.js が含まれており、変更を実際に確認できます。 - Newport Design System (管理パッケージ) を使用した FlexCard へのグローバルブランドの適用
管理パッケージランタイムの場合、Newport Design System (NDS) を使用してグローバルスタイルの変更を FlexCard に適用します。Newport Design System では、既存の Newport CSS スタイルをダウンロードして編集し、独自のカスタマイズで上書きできます。 - Newport Design System (管理パッケージ) を使用した FlexCard へのグローバルスタイルの変更のリリース
管理パッケージランタイムの場合、Salesforce 組織でテーマをアップロードして、Newport Design System テーマに変更を追加します。テーマをインストールして、すべての Flexcard Designer ユーザーが FlexCard をプレビューできるようにします。使用可能な場合は必ず Newport プレビューを上書きする静的リソースを追加して、Newport テンプレートに変更を適用します。
