モデル駆動型アプリに Rich text editor コントロールを追加する
Rich text editor コントロールは、アプリのユーザーにテキストの書式設定のための WYSIWYG 編集領域を提供します。 コントロールの入出力形式は HTML です。 このコントロールを使用すると、Web ブラウザーや Word などからコピーしたリッチ テキストをコントロールに貼り付けることができます。
一部の使用可能な書式設定オプションは次の通りです。
- 太字、イタリック、下線、取り消し線
- テキストの色、強調表示色
- フォントの種類とサイズ
- 番号付きリストと箇条書きリスト
- ハイパーリンク
- テーブル
- 画像
既定のオプションの完全なリストについては、リッチ テキスト エディターを使用する を参照してください。
リッチ テキスト編集用のテキスト列を追加または置換
新しいテキスト列を作成してコントロールを構成するか、既存のテキスト列を置き換えます。 Rich text editor コントロールは、1 行または複数行のテキスト列で使用できます。
シンプル構成
新規または既存のテキスト列で規定値を使用して Rich text editor を有効にするには、次の手順を使用して、フォーマット オプションを リッチ テキスト に変更します。 既定値の詳細: 組織全体の変更に既定の Web リソースを使用する
Power Apps にサインインします。
注意
既存のリッチ テキスト フィールドがある場合、API を使用して形式を
Richtextに変更できます。 詳細: データ型形式の変換左側のナビゲーション ウィンドウで ソリューション を選択して、必要なソリューションを開き、必要なテーブルを開いてから、列 領域を選択します。
+追加 > 列 を選択して、列の名前を入力し、テキスト データ 型を選択して、リッチ テキスト フォーマット オプションを選択します。
列を保存します。 これで、このテーブルの既存または新しいフォームに新しい列を追加できます。
詳細構成
Rich text editor コントロールには、その外観、機能、動作をカスタマイズできるようにする構成オプションの豊富なセットが付属しています。 新規または既存の列で特定の構成を使用して Rich text editor を有効にするには、次の手順を実行します。
- Power Apps にサインインします。
- 左側のナビゲーション ウィンドウで、ソリューション を選択して、必要なソリューションを開き、必要なテーブルを開いてから、フォーム 領域を選択します。
- フォームを選択してから、フォームの編集 > 新しいタブでフォームを編集 を選択します。
- フォーム デザイナー キャンバスで、テキスト列を追加または作成するか、この記事で使用されているカスタムの複数行のテキスト列などの既存のテキスト列を選択します。
- 右側の列のプロパティ ペインで、コンポーネント セクションを展開し、+ コンポーネント を選択し、次に Rich Text Editor コントロール を選択します。
- rich text editor コントロールを追加する ペインで、次のオプションから選択してから、完了 を選択します。
テーブル列にバインド: このプロパティは別のテーブル列へのバインドをサポートしていないため、このオプションを有効にすることはお勧めしません。
静的な値: Rich text editor の外観、機能、および動作をカスタマイズする場合は、必要なプロパティを含む JavaScript Web リソースへの相対 URL を入力します。 詳細情報: Rich text editor コントロールの高度な構成を作成し、使用する
Web、電話、タブレット: すべてのクライアント アプリで列のリッチ テキストを使用できるようにする場合はすべてを有効にします。
- 保存 して、フォームを 公開 します。
Rich text editor コントロールの高度な構成を作成し、使用する
Rich text editor コントロールの高度な構成を作成し、使用するには、次の手順を実行します。
必要な
defaultSupportedProps構造と構成を持つ JSON 形式のテキスト ファイルを含む JavaScript (.js) ファイルを作成します。 詳細情報: Rich text editor 構成のさらに多くのサンプル および Rich text editor プロパティPower Apps では、手順 1 で作成した JSON ファイルを使用して、JavaScript (JS) タイプの Web リソースを作成します。 詳細情報: アプリを拡張するためにモデル駆動型アプリ Web リソースを作成または編集する
JavaScript Web リソースの相対 URL (たとえば、/WebResources/contoso_toolbartoprte) を Rich text editor コントロールの追加 ペインの 静的な値 フィールドに追加します。 詳細: リッチ テキスト編集用のテキスト列を追加または置換する
ヒント
- Web リソースの URL は、前の手順で作成した Web リソース定義の URL フィールドの隣にあります。
- 静的な値 に対して絶対 URL を使用することができますが、相対 URL を使用することにより、Web リソースは、ソリューションとして別の環境にインポートされた後も引き続き機能します。
保存 して、フォームを 公開 します。
リッチ テキスト エディターを使用するためのベスト プラクティス
リッチ テキスト エディターを使用するときは、次の点を考慮してください。
HTML コンテンツのサイズが 1MB 以下の場合に、最高のパフォーマンスが得られます。 HTML コンテンツのサイズが 1MB を超えると、コンテンツの読み込みと編集の応答時間が遅くなる場合があります。 既定では、画像コンテンツはコンテンツ HTML から参照されますが、HTML コンテンツの一部としては保存されないため、既定の構成では、画像がパフォーマンスに悪影響を与えることはありません。
リッチ テキスト フィールドには、ユーザーが入力したデータとともにフォーマットに必要な HTML タグが格納されます。 フィールドの最大サイズを設定するときは、HTML タグとユーザーが入力したデータの両方に十分な大きさのサイズを割り当てるようにしてください。
既定では、リッチ テキスト エディターは画像を Azure Blob Storage ストアにアップロードし、フィールドの一部として保存されません。 送信者が
msdyn_richtextfilesエンティティへの権限を持っていない場合、画像は base64 と同じフィールドに保存されます。 Base64 のコンテンツは大きいため、通常、画像を base64 として保存することは望ましくありません。
構成がリッチ テキスト エディターにどのように適用されるか
リッチ テキスト エディターのエクスペリエンスと機能は、構成によって制御されます。 Rich text editor コントロールの既定の設定には、通常のリッチ テキストのニーズを満たすことを目的としたプロパティと値がありますが、調整することができます。 構成のプロパティと値は、特定の Rich text editor コントロール インスタンスに適用できます。 各リッチ テキスト エディター インスタンスに適用できる構成には、最大 3 つのレベルがあります。 プロパティと値を適用するために使用されるロジックは次のとおりです。
編集不可能なグローバル構成ファイル RTEGlobalConfiguration_Readonly.json が読み込まれます。
編集可能なグローバル構成ファイル RTEGlobalConfiguration.json が読み込まれます。
- この構成のプロパティは、以前の構成ファイルの同じ名前のプロパティを 置換* します。
インスタンス固有の構成ファイルが存在する場合は、それが読み込まれます。 インスタンス レベルの構成の詳細については、高度な構成 を参照してください。
- この構成のプロパティは、以前の構成ファイルのいずれかで同じ名前のプロパティを 置換* します。
注意
マージされる extraPlugins を 除いて すべてのプロパティが置き換えられます。 extraPlugins をマージすると、externalPlugins とすぐに使用できるプラグインを使用して RTEGlobalConfiguration.json でさまざまなプラグインを使用できるようになります。 次に、インスタンス固有の構成の extraPlugins 値にプラグインを追加することにより、必要なプラグインのみをアクティブ化できます。
リッチ テキストが有効な列には、読み取り専用または無効状態に構成できる構成のセットが制限されています。 この構成の詳細については、「readOnlySettings」プロパティの説明を参照してください。
リッチ テキスト エディター プロパティ
JSON ファイルは、名前と値のペアとして設定されたプロパティで構成されています。 構成には 2 つのタイプがあります: defaultSupportedProps セクション、およびさまざまな機能を提供する個々の構成設定。
defaultSupportedProps は、プラグインのプロパティのセットであり、すべての CKEditor 構成のサポートが含まれています。 詳細情報: リッチ テキスト エディター構成ファイルのビジュアル化。 defaultSupportedProps は、CKEditor から文書化されたプラグインのプロパティだけでなく、追加または作成するより多くのプラグインのプロパティを設定することもできます。 プラグインの詳細情報: ビジネス プロセスを拡張するためのプラグインを使用する。
個々の構成設定を使用すると、エディターの動作と機能を変更できます。
リッチ テキスト エディター構成ファイルの視覚化
次の 2 つの画像は、2 つの構成セクションを視覚的に識別します。 完全な構成ファイルについては、組織全体の変更に既定の Web リソースを使用する をご覧ください。
defaultSupportedProps
詳細情報: defaultSupportedProps
個々の構成設定
詳細: 個々の構成設定
defaultSupportedProps
このプロパティの下で、CKEditor によりサポートされているすべてのプロパティを構成できます。 一般的に使用されるカスタム構成のいくつかを以下に説明します。 CKEditor 構成に関する完全なドキュメントについては、CKEditor.config を参照してください。 リッチ テキスト エディターは現在、CKEditor バージョン 4.17.1 を使用しています。
| 属性 | 説明設定 | 規定値 |
|---|---|---|
| 高さ |
コンテンツ エディターの初期の高さを設定します。 既定値は 185 px です。 |
|
| stickyStyle |
実際の既定のフォント サイズとスタイルを設定します。 |
|
| font_defaultLabel |
フォント スタイルのツールバーに表示される既定のラベルを設定します。 既定値は Segoe UI です。 既定のラベルは視覚的で機能的ではなく、stickyStyle 構成は機能的なフォントとサイズを適用します。 |
|
| fontSize_defaultLabel |
フォント サイズのツールバーに表示される既定のラベルを設定します。 既定値は 9 です。 既定のラベルは視覚的で機能的ではなく、stickyStyle 構成は機能的なフォントとサイズを適用します。 |
|
| toolbarLocation |
ツール バーがレンダリングされるユーザー インターフェイスの場所。 サポートされている値は、上部 と 下部 です。 既定は下部です。 |
|
| ツールバー |
読み込まれるツールバー ボタンのリスト。 |
|
| プラグイン |
エディター インスタンスで使用されるプラグインのコンマ区切りリスト。 読み込まれる実際のプラグインは、他の 2 つの設定の影響を受ける可能性があります: extraPlugins および removePlugins。 |
|
| extraPlugins |
読み込まれる他のプラグインのコンマ区切りのリスト。 この設定により、プラグイン設定に触れずに新しいプラグインを簡単に追加できます。 |
|
| removePlugins |
読込んではならないプラグインのリスト。 この設定により、plugins/extraPlugins 設定で定義された一部のプラグインを、それらに触れることなく読込むことを回避できます。 |
|
| superimageImageMaxSize |
スーパーイメージ プラグインを使用する場合に埋め込み画像に許可されるメガバイト (MB) 単位の最大サイズ。 既定値は 5 です。 |
|
| disallowedContent |
コンテンツに含めたくない要素を禁止できます。 要素全体を禁止したり、属性、クラス、スタイルごとに禁止したりできます。 CKEditor の "disallowedContent" 構成の詳細については、許可されていないコンテンツ ルール を参照してください。 |
|
| linkTargets |
ユーザーがリンクを作成するときに使用できるリンク ターゲット オプションを構成できます。 |
リンク ターゲット
- ```notSet``` : アンカー タグにドキュメントのターゲットが設定されていません
- ```frame``` : 指定したフレームでドキュメントを開きます
- ```popupWindow``` : ポップアップ ウィンドウでドキュメントを開きます
- ```_blank``` : 新しいウィンドウまたはタブでドキュメントを開きます
- ```_top``` : ウィンドウ全体でドキュメントを開きます
- ```_self``` : リンクがアクティブになっているのと同じウィンドウまたはタブでドキュメントを開きます
- ```_parent``` : 親フレームでドキュメントを開きます
例:
|
個々の構成設定
エディターの機能に影響を与える他の構成設定を構成できます。
| 属性 | 説明設定 | 規定値 |
|---|---|---|
| attachmentEntity |
このプロパティを設定し、別のテーブルを指定することで、ファイルに既定のテーブルを使用しないようにして、必要に応じてセキュリティを強化できます。 |
構文: 例: 既定値: |
| disableContentSanitization | 既定では、コンテンツのサニタイズは無効になっており、外部ソースからリッチ テキスト コンテンツを正常にコピーして貼り付けることができます。 有効にすると、コンテンツのサニタイズによって一部のカスタム属性またはタグが削除されます。 この構成は、編集モードにのみ適用されます。 読み取り専用または無効な状態のレンダリングは常にサニタイズされます。 |
|
| disableDefaultImageProcessing |
既定では、画像はクライアント API を使用してアップロードされます。 画像がエディターに追加されるとすぐに、プラットフォームにアップロードされます。 画像を処理するには、このプロパティを True に設定します。 |
|
| disableImages |
このプロパティを True に設定すると、イメージが無効になります。 このプロパティは最も優先されます。 これは、このプロパティが True に設定されている場合、imageEntity プロパティ値に関係なく画像は無効になります。 既定では、イメージは有効になっています。 |
|
| externalPlugins |
このプロパティを使用することで、独自のプラグインを作成して、rich text editor コントロールで使用できます。 |
既定値はありません。これは、元々提供されていない他のプラグインを追加して機能を拡張する方法です。 パス値は、絶対 URLまたは相対 URL にすることができます。 例: 例: |
| imageEntity |
このプロパティを設定し、別のテーブルを指定することで、画像に既定のテーブルを使用しないようにして、必要に応じてセキュリティを強化できます。 |
構文: 例: 既定値: |
| readOnlySettings |
このプロパティを設定することにより、読み取り専用または無効な状態で表示されたときの列の他の動作を構成できます。 |
例: 既定値: |
| readOnlySettings |
このプロパティを設定することにより、より多くのコンテンツを表示できるようにすることができます。 |
例: 既定値: |
| showAsTabControl |
このプロパティを設定することにより、エディター ウィンドウの上にさらに多くのコマンドを表示できます。 次の属性を有効にするには、true に設定する必要があります。
|
|
| showFullScreenExpander |
このプロパティは、全画面の展開/折りたたみ機能を追加します。これにより、エディターを全画面モードで展開して使用できます。 true に設定された showAsTabControl に依存します。 |
|
| showHtml |
このプロパティは、html コンテンツを直接表示および編集するオプションを追加します。 true に設定された showAsTabControl に依存します。 |
|
| showPreview |
このプロパティは、html としてレンダリングされたエディター コンテンツをプレビューするオプションを追加します。 プレビューを使用すると、エディターの外部でコンテンツを HTML として共有およびレンダリングした場合に、コンテンツがどのように表示されるかを確認できます。 true に設定された showAsTabControl に依存します。 |
|
| showPreviewHeaderWarning |
このプロパティを使用すると、コンテンツのプレビュー時に表示される警告メッセージを表示/非表示にできます。 true に設定された showAsTabControl および showPreview に依存します。 |
|
一般的に使用されるリッチ テキスト エディターの構成
以下は、リッチ テキスト エディタの一般的な構成です。 これらのサンプル構成を使用して、特定のタイプのリッチ テキスト エクスペリエンスを有効にすることができます。 サンプルごとに、JSON Web リソースを作成するか、既定の Web リソース構成を変更します。 詳細情報: Rich text editor コントロールの高度な構成を作成して使用する と組織全体の変更に既定の Web リソースを使用する
既定のフォントをフォント サイズ 11pt の Calibri に設定する
既定のフォントとサイズを Microsoft Windows の既定と一致するように設定します。 この例は、エクスペリエンスにこの変更を実装するために使用する設定を示しています。
これらの defaultSupportedProps プロパティを構成ファイルで設定します。 各値の後には、最後の値でない限り , (comma) を付ける必要があります: (詳細: defaultSupportedProps)
"font_defaultLabel": "Calibri"
"fontSize_defaultLabel": "11"
"stickyStyle": {
"font-size": "11pt",
"font-family": "Calibri/Calibri, Helvetica, sans-serif;"
}
改行 (Enter キー) により <p> ではなく <br> を作成する
Enter キーの既定の動作では、<p> HTML タグ (貼り付けられたコンテンツを解釈するときにも使用されます) を使用して段落ブロックが作成されます。 段落ブロックは、情報をグループ化するために HTML で使用されます。 場合によっては、Microsoft Word または他のコンテンツ エディターから新しい情報または貼り付け情報を作成するときに、各ブラウザが段落ブロック タグ (<p>) のフォーマットをわずかに異なる方法で解釈するため、段落ブロックの代わりに <br> HTML タグを使用することができます。 <br> HTML タグの垂直方向の間隔は、さまざまなブラウザーやエクスペリエンスで視覚的に一貫している場合があります。 この例は、<p> から <br> に変更する方法を示しています。
この defaultSupportedProps プロパティを構成ファイルで設定します。 各値の後には、最後の値でない限り , (comma) を付ける必要があります: (詳細: defaultSupportedProps)
"enterMode": 2
貼り付けまたは作成されたすべてのコンテンツは HTML 5 に準拠している
リッチ テキスト エディター コントロールは、HTML 5 コンテンツで最適に機能しますが、HTML 4 タグとフォーマットも正常に使用できます。 場合によっては、HTML 4 タグと HTML 5 タグの両方を組み合わせると、フォントとサイズを選択および設定するときに使い易さの問題が発生する可能性があります。 「allowedContent」を使用すると、すべてのコンテンツが HTML 5 であることを確認できます。 この例では、サポートされているすべての HTML 5 タグを使用できます。 非準拠のタグは、同等の HTML 5 に変換されます。
この defaultSupportedProps プロパティを構成ファイルで設定します。 各値の後には、最後の値でない限り , (comma) を付ける必要があります: (詳細: defaultSupportedProps)
"allowedContent": "a(*)[*]{*};abbr(*)[*]{*};address(*)[*]{*};area(*)[*]{*};article(*)[*]{*};aside(*)[*]{*};audio(*)[*]{*};b(*)[*]{*};base(*)[*]{*};bdi(*)[*]{*};bdo(*)[*]{*};blockquote(*)[*]{*};body(*)[*]{*};br(*)[*]{*};button(*)[*]{*};canvas(*)[*]{*};caption(*)[*]{*};cite(*)[*]{*};code(*)[*]{*};col(*)[*]{*};colgroup(*)[*]{*};data(*)[*]{*};datalist(*)[*]{*};dd(*)[*]{*};del(*)[*]{*};details(*)[*]{*};dfn(*)[*]{*};dialog(*)[*]{*};div(*)[*]{*};dl(*)[*]{*};dt(*)[*]{*};em(*)[*]{*};embed(*)[*]{*};fieldset(*)[*]{*};figcaption(*)[*]{*};figure(*)[*]{*};footer(*)[*]{*};form(*)[*]{*};h1(*)[*]{*};h2(*)[*]{*};h3(*)[*]{*};h4(*)[*]{*};h5(*)[*]{*};h6(*)[*]{*};head(*)[*]{*};header(*)[*]{*};hr(*)[*]{*};html(*)[*]{*};i(*)[*]{*};iframe(*)[*]{*};img(*)[*]{*};input(*)[*]{*};ins(*)[*]{*};kbd(*)[*]{*};label(*)[*]{*};legend(*)[*]{*};li(*)[*]{*};link(*)[*]{*};main(*)[*]{*};map(*)[*]{*};mark(*)[*]{*};meta(*)[*]{*};meter(*)[*]{*};nav(*)[*]{*};noscript(*)[*]{*};object(*)[*]{*};ol(*)[*]{*};optgroup(*)[*]{*};option(*)[*]{*};output(*)[*]{*};p(*)[*]{*};param(*)[*]{*};picture(*)[*]{*};pre(*)[*]{*};progress(*)[*]{*};q(*)[*]{*};rp(*)[*]{*};rt(*)[*]{*};ruby(*)[*]{*};s(*)[*]{*};samp(*)[*]{*};section(*)[*]{*};select(*)[*]{*};small(*)[*]{*};source(*)[*]{*};span(*)[*]{*};strong(*)[*]{*};style(*)[*]{*};sub(*)[*]{*};summary(*)[*]{*};sup(*)[*]{*};svg(*)[*]{*};table(*)[*]{*};tbody(*)[*]{*};td(*)[*]{*};template(*)[*]{*};textarea(*)[*]{*};tfoot(*)[*]{*};th(*)[*]{*};thead(*)[*]{*};time(*)[*]{*};title(*)[*]{*};tr(*)[*]{*};track(*)[*]{*};u(*)[*]{*};ul(*)[*]{*};var(*)[*]{*};video(*)[*]{*};wbr(*)[*]{*};"
その他のサンプル リッチ テキスト エディター構成
フル スクリーン エキスパンダーを追加する
これらの Individual configuration settings プロパティを構成ファイルで設定します。 各値の後には、最後の値でない限り , (comma) を付ける必要があります: (詳細: 個々の構成設定)
"showAsTabControl": true
"showFullScreenExpander": true
HTML ソース ビュー タブを追加する
これらの Individual configuration settings プロパティを構成ファイルで設定します。 各値の後には、最後の値でない限り , (comma) を付ける必要があります: (詳細: 個々の構成設定)
"showAsTabControl": true
"showHtml": true
フォントサイズ、太字、斜体、下線、強調表示を備えたシンプルなツール バーを追加
この defaultSupportedProps プロパティを構成ファイルで設定します。 各値の後には、最後の値でない限り , (comma) を付ける必要があります: (詳細: defaultSupportedProps)
"toolbar": [ { "items": [ "FontSize", "Bold", "Italic", "Underline", "BGColor" ] } ]
ツール バーを削除して、リッチ テキスト レンダリング サーフェスを作成する
この defaultSupportedProps プロパティを構成ファイルで設定します。 各値の後には、最後の値でない限り , (comma) を付ける必要があります: (詳細: defaultSupportedProps)
"toolbar": []
新しいフォント リストを追加し、Brush Script MT を既定サイズの 20 ピクセルの既定フォントとして設定する
これらの defaultSupportedProps プロパティを構成ファイルで設定します。 各値の後には、最後の値でない限り , (comma) を付ける必要があります: (詳細: defaultSupportedProps)
"font_names": "Brush Script MT/'Brush Script MT', cursive;Calibri/Calibri, Helvetica, sans-serif;Calibri Light/'Calibri Light', 'Helvetica Light', sans-serif;"
"font_defaultLabel": "Brush Script MT"
"fontSize_sizes": "8/8px;12/12px;20/20px;32/32px"
"fontSize_defaultLabel": "20"
"stickyStyle": {
"font-size": "20px",
"font-family": "'Brush Script MT', cursive"
}
ツール バーをリッチ テキスト エディターの上部に配置する
この defaultSupportedProps プロパティを構成ファイルで設定します。 各値の後には、最後の値でない限り , (comma) を付ける必要があります: (詳細: defaultSupportedProps)
"toolbarLocation": "top"
30 ピクセルの高さでエディターを起動し、コンテンツに合わせて自動拡張する
これらの defaultSupportedProps プロパティを構成ファイルで設定します。 各値の後には、最後の値でない限り , (comma) を付ける必要があります: (詳細: defaultSupportedProps)
"autoGrow_onStartup": false
"autoGrow_maxHeight": 0
"autoGrow_minHeight": 30
"height": 30
エディターの高さを 500 px に固定する
これらの defaultSupportedProps プロパティを構成ファイルで設定します。 各値の後には、最後の値でない限り , (comma) を付ける必要があります: (詳細: defaultSupportedProps)
"removePlugins": [ "autogrow" ]
"height": 500
"br" タグを除くすべての html タグを削除するプレーン テキスト サーフェスを作成する
これらの defaultSupportedProps プロパティを構成ファイルで設定します。 各値の後には、最後の値でない限り , (comma) を付ける必要があります: (詳細: defaultSupportedProps)
"enterMode": 2
"shiftEnterMode": 2
"allowedContent": "*"
"disallowedContent": "*"
"forcePasteAsPlainText": true
"toolbar": []
"removePlugins": "contextmenu,liststyle,openlink,tableresize,tableselection,tabletools"
この Individual configuration settings プロパティを構成ファイルで設定します。 各値の後には、最後の値でない限り , (comma) を付ける必要があります: (詳細: 個々の構成設定)
"disableImages": true
コンテキスト メニューを削除して、右クリックが既定のブラウザーのスペル チェックで機能するようにする
この機能を有効にすると、コンテキストの右クリック編集機能が削除されます。
この defaultSupportedProps プロパティを構成ファイルで設定します。 各値の後には、最後の値でない限り , (comma) を付ける必要があります: (詳細: defaultSupportedProps)
"removePlugins": "contextmenu,liststyle,openlink,tableresize,tableselection,tabletools"
組織全体の変更に既定の Web リソースを使用する
既定の RTE Web リソースは、表示名 RTEGlobalConfiguration.json で使用できます。 この構成は、RTE コントロールのすべてのインスタンスに使用され、組織全体の変更を行うために使用できます。 これには、タイムラインのリッチ テキスト ノートで使用される RTE、ナレッジ管理、RTE 制御を使用するように構成された単一行および複数行フィールドが含まれます。
{
"defaultSupportedProps": {
"allowedIframeDomains": [],
"autoGrow_onStartup": true,
"basicEntities": true,
"browserContextMenuOnCtrl": true,
"copyFormatting_allowRules": true,
"customConfig": "",
"dialog_backgroundCoverColor": "black",
"disableNativeSpellChecker": false,
"enterMode": 3,
"extraPlugins": "accessibilityhelp,autogrow,autolink,basicstyles,bidi,blockquote,button,collapser,colorbutton,colordialog,confighelper,contextmenu,copyformatting,dialog,editorplaceholder,filetools,find,floatpanel,font,iframerestrictor,indentblock,justify,panel,panelbutton,pastefromword,quicktable,selectall,stickystyles,superimage,tableresize,tableselection,tabletools",
"fillEmptyBlocks": true,
"font_defaultLabel": "Segoe UI",
"font_names": "Angsana New/'Angsana New', 'Leelawadee UI', Sathu, serif;Arial/Arial, Helvetica, sans-serif;Arial Black/'Arial Black', Arial, sans-serif;Calibri Light/'Calibri Light', 'Helvetica Light', sans-serif;Calibri/Calibri, Helvetica, sans-serif;Cambria/Cambria, Georgia, serif;Candara/Candara, Optima, sans-serif;Century Gothic/'Century Gothic', sans-serif;Comic Sans MS/'Comic Sans MS';Consolas/Consolas, Courier, monospace;Constantia/Constantia, 'Hoefler Text', serif;Corbel/Corbel, Skia, sans-serif;Cordia New/'Cordia New', 'Leelawadee UI', Silom, sans-serif;Courier New/'Courier New';DaunPenh/DaunPenh, 'Leelawadee UI', 'Khmer MN', sans-serif;Franklin Gothic Book/'Franklin Gothic Book', 'Avenir Next Condensed', sans-serif;Franklin Gothic Demi/'Franklin Gothic Demi', 'Avenir Next Condensed Demi Bold', sans-serif;Franklin Gothic Medium/'Franklin Gothic Medium', 'Avenir Next Condensed Medium', sans-serif;Garamond/Garamond, Georgia, serif;Gautami/Gautami, 'Nirmala UI', 'Telugu MN', sans-serif;Georgia/Georgia, serif;Impact/Impact, Charcoal, sans-serif;Iskoola Pota/'Iskoola Pota', 'Nirmala UI', 'Sinhala MN', sans-serif;Kalinga/Kalinga, 'Nirmala UI', 'Oriya MN', sans-serif;Kartika/Kartika, 'Nirmala UI', 'Malayalam MN', sans-serif;Latha/Latha, 'Nirmala UI', 'Tamil MN', sans-serif;Leelawadee UI/'Leelawadee UI', Thonburi, sans-serif;Lucida Console/'Lucida Console', Monaco, monospace;Lucida Handwriting/'Lucida Handwriting', 'Apple Chancery', cursive;Lucida Sans Unicode/'Lucida Sans Unicode';Mangal/Mangal, 'Nirmala UI', 'Devanagari Sangam MN', sans-serif;Nirmala UI/'Nirmala UI', sans-serif;Nyala/Nyala, Kefa, sans-serif;Palatino Linotype/'Palatino Linotype', 'Book Antiqua', Palatino, serif;Raavi/Raavi, 'Nirmala UI', 'Gurmukhi MN', sans-serif;Segoe UI/'Segoe UI', 'Helvetica Neue', sans-serif;Shruti/Shruti, 'Nirmala UI', 'Gujarati Sangam MN', sans-serif;Sitka Heading/'Sitka Heading', Cochin, serif;Sitka Text/'Sitka Text', Cochin, serif;Sylfaen/Sylfaen, Mshtakan, Menlo, serif;TW Cen MT/'TW Cen MT', 'Century Gothic', sans-serif;Tahoma/Tahoma, Geneva, sans-serif;Times New Roman/'Times New Roman', Times, serif;Times/Times, 'Times New Roman', serif;Trebuchet MS/'Trebuchet MS';Tunga/Tunga, 'Nirmala UI', 'Kannada MN', sans-serif;Verdana/Verdana, Geneva, sans-serif;Vrinda/Vrinda, 'Nirmala UI', 'Bangla MN', sans-serif;メイリオ/Meiryo, メイリオ, 'Hiragino Sans', sans-serif;仿宋/FangSong, 仿宋, STFangsong, serif;微軟正黑體/'Microsoft JhengHei', 微軟正黑體, 'Apple LiGothic', sans-serif;微软雅黑/'Microsoft YaHei', 微软雅黑, STHeiti, sans-serif;新宋体/NSimSun, 新宋体, SimSun, 宋体, SimSun-ExtB, 宋体-ExtB, STSong, serif;新細明體/PMingLiU, 新細明體, PMingLiU-ExtB, 新細明體-ExtB, 'Apple LiSung', serif;楷体/KaiTi, 楷体, STKaiti, serif;標楷體/DFKai-SB, 標楷體, BiauKai, serif;游ゴシック/'Yu Gothic', 游ゴシック, YuGothic, sans-serif;游明朝/'Yu Mincho', 游明朝, YuMincho, serif;隶书/SimLi, 隶书, 'Baoli SC', serif;黑体/SimHei, 黑体, STHeiti, sans-serif;굴림/Gulim, 굴림, 'Nanum Gothic', sans-serif;궁서/Gungsuh, 궁서, GungSeo, serif;돋움/Dotum, 돋움, AppleGothic, sans-serif;맑은 고딕/'Malgun Gothic', '맑은 고딕', AppleGothic, sans-serif;바탕/Batang, 바탕, AppleMyungjo, serif;바탕체/BatangChe, 바탕체, AppleMyungjo, serif;ＭＳ Ｐゴシック/'MS PGothic', 'ＭＳ Ｐゴシック', 'MS Gothic', 'ＭＳ ゴシック', 'Hiragino Kaku Gothic ProN', sans-serif;ＭＳ Ｐ明朝/'MS PMincho', 'ＭＳ Ｐ明朝', 'MS Mincho', 'ＭＳ 明朝', 'Hiragino Mincho ProN', serif",
"fontSize_defaultLabel": "9",
"fontSize_sizes": "8/8pt;9/9pt;10/10pt;11/11pt;12/12pt;14/14pt;16/16pt;18/18pt;20/20pt;22/22pt;24/24pt;26/26pt;28/28pt;36/36pt;48/48pt;72/72pt;",
"height": 185,
"keystrokes": [],
"linkDefaultProtocol": "https://",
"listStylePosition": "inside",
"pasteAzureBlobImageAsBase64": false,
"qtCellBorderColor": "rgb(171, 171, 171)",
"qtCellBorderStyle": "solid",
"qtCellBorderWidth": "1px",
"qtCellPadding": "1",
"qtCellSpacing": "0",
"qtCellWith": "120px",
"pasteFilter": null,
"qtColumns": 8,
"qtRows": 6,
"qtStyle": {
"border-collapse": "collapse",
"font-size": "9pt"
},
"removeDialogTabs": "flash:Upload;link:upload",
"removePlugins": "a11yhelp,codemirror,magicline,scayt,showborders",
"skin": "superowa",
"stickyStyle": {
"font-size": "9pt",
"font-family": "'Segoe UI','Helvetica Neue',sans-serif"
},
"stickyStyles_defaultTag": "div",
"superimageImageMaxSize": 5,
"toolbarcollapser_enableResizer": true,
"toolbarLocation": "bottom",
"uploadRecordId": []
},
"attachmentEntity": {
"name": "msdyn_richtextfiles",
"fileAttributeName": "msdyn_fileblob"
},
"disableContentSanitization": true,
"disableDefaultImageProcessing": false,
"disableImages": false,
"imageEntity": {
"imageEntityName": "msdyn_richtextfiles",
"imageFileAttributeName": "msdyn_imageblob"
},
"readOnlySettings": {
},
"sanitizerAllowlist": {
"attributes": [],
"cssProperties": [],
"domains": [],
"protocols": [],
"tags": []
},
"showAsTabControl": false,
"showFullScreenExpander": false,
"showHtml": false,
"showPreview": false,
"showPreviewHeaderWarning": false
}
リッチ テキスト エディター構成の現在の設定を見つける
Microsoft Edge または Google Chrome Web ブラウザーでモデル駆動型アプリを実行し、アカウント行などの Rich text editor コントロールを備えたフォームを開きます。
Rich text editor コントロール領域をクリックしながら Ctrl を押してから、検査 を選択します。
検査ペインで、コンソール タブをクリックし、コマンド バーのドロップダウン リスト ボックスの親 Main.aspx ページを選択します。
検査ペインのコマンド バーで コンソールのクリア を選択します。
検査ペイン コンソールで CKEDITOR.config. と入力して、さまざまな構成を表示します。
autoGrow_minHeight のような構成を選択して、現在の設定を表示します。
メールでリッチ テキスト エディタのツールバーを使用する
リッチ テキスト エディターのツールバーは、メモとメールにリッチテキスト形式で作業可能な機能があります。
書式設定オプション
使用できるリッチ テキスト エディターで使用可能な、さまざまな書式設定機能と機能オプションを次の表に示します。
| アイコン | 名称 | ショートカット キー | 説明 |
|---|---|---|---|
 |
書式のコピー/貼り付け | Ctrl+Shift+C、Ctrl+Shift+V | 特定のセクションの外観を別のセクションに適用します。 |
 |
フォント | Ctrl+Shift+F | 目的のフォントを選択します。 既定のフォントは Segoe UI です。 注意: フォーマットされたコンテンツを選択すると、そのコンテンツのフォント名が表示されます。 選択範囲に複数のフォントが含まれている場合、選択範囲の最上位のフォント名が表示されます。 |
 |
フォント サイズ | Ctrl+Shift+P | テキストのサイズを変更します。 既定のサイズは 12 です。 注意: フォーマットされたコンテンツを選択すると、そのコンテンツのフォント サイズが表示されます。 選択範囲に複数のフォント サイズが含まれている場合、選択範囲の最上位のフォント名が表示されます。 |
 |
太字 | Ctrl+B | テキストを太字にします。 |
 |
Normal | Ctrl+I | テキストを斜体にします。 |
 |
下線 | Ctrl+U | テキストに下線を引きます。 |
 |
テキストの蛍光ペンの色 | 明るい色で強調表示して、テキストを目立たせます。 | |
 |
フォントの色 | テキストの色を変更します。 | |
 |
箇条書き | 記号付きリストを作成します。 | |
 |
項目番号 | 番号付きリストを作成します。 | |
 |
インデントの解除 | 段落をマージンに近づけます。 | |
 |
インデント | 段落をマージンから離します。 | |
 |
ブロック引用 | コンテンツにブロックレベルの引用形式を適用します。 | |
 |
左揃え | Ctrl+L | コンテンツを左マージンに揃えます。 (一般的に、読みやすくするために本文に使用されます。) |
 |
中央揃え | Ctrl+E | コンテンツをページの中央に配置します。 (一般的に、正式な外観に使用されます。) |
 |
右揃え | Ctrl+R | コンテンツを右余白に揃えます。 (一般的に、正式な外観に使用されます。) |
 |
リンク | ドキュメントにリンクを作成して、Web ページやファイルにすばやくアクセスします。 貼り付けまたは入力された URL テキストはリンクに変換されます。 例えば、"http://myexample.com" は "http://myexample.com" になります。 リンク ダイアログ ボックスで、挿入するリンクの種類を選択します。 リンク情報 タブでは、リンク プロトコルおよび URL の設定に加え、リンクの種類も選択することができます。 対象 タブは、URL リンクでのみ使用することができます。 選択後にオープンするリンクの場所が指定されます。 |
|
 |
リンク解除 | メールまたはドキュメントのリンクを削除します。 リンクにカーソルを置くと、ツールバー上の リンク解除 ボタンがアクティブになります。 ボタンを選択してリンクを解除し、プレーン テキストにします。 |
|
 |
上付き | テキスト行のすぐ上に小文字を入力します。 | |
 |
下付き | テキスト行のすぐ下に小文字を入力します。 | |
 |
取り消し線 | 線を引いてテキストに取り消し線を引きます。 | |
 |
画像の挿入 | 画像を挿入するには、エディタ内で直接コピー/ペーストするか、デスクトップまたはローカルフォルダからエディタに直接ドラッグ アンド ドロップ または、URLを入力します。 次の画像形式がサポートされています: .PNG、.JPG、.GIF 記事に画像をインラインで挿入するには: 1. 画像をドラッグ アンド ドロップするか、コピーして記事に直接貼り付けます。 2. 画像のサイズを変えるには画像の隅をドラッグします。 URLを使用、ローカルの画像ファイルに移動して挿入するには: 1. 画像の挿入を選択します。 2. ダイアログ ボックスの 画像 で、次のいずれかのオプションを選択します:
メモ: |
|
 |
左から右 | 段落、ヘッダー、表、リストなどのコンテンツのテキストを左から右に変更します。 通常、双方向言語コンテンツに使用されます。 これが既定の設定です。 | |
 |
右から左 | 段落、ヘッダー、表、リストなどのコンテンツのテキストを右から左に変更します。 通常、双方向言語コンテンツに使用されます。 既定の設定は左から右です。 | |
 |
入力を元に戻す | コンテンツに加えた変更を元に戻します。 | |
 |
入力のやり直し | コンテンツに加えた変更をやり直します。 | |
 |
すべての書式設定をクリア | 選択したテキストからすべての書式設定を削除し、通常の書式設定されていないテキストだけを残します。 | |
 |
テーブルの追加 | コンテンツにテーブルを追加します。 テーブルを追加した後、次のいずれかを実行できます:
|
|
| アクセシビリティのヘルプ | Alt + 0 | リッチ テキスト エディター コントロールを使用する際に使用できるユーザー補助のショートカットのリストを表示します。 | |
 |
ツール バーの表示 | ツール バーが折りたたまれ、すべてのオプションが表示されない場合に表示されます。 ツール バーを表示して、すべてのオプションを表示する場合に選択します。 | |
ヒント
Ctrl +右クリックを選択すると、ブラウザーのコンテキスト メニューにアクセスできます。 これは、ブラウザに組み込まれているスペル チェッカーを使用する場合に役立ちます。 それ以外の場合は、右クリックして、使用している要素のコンテキスト フォーマットを指定できます。
また、ブラウザーに組み込まれているスペルチェッカーの代わりに Microsoft Editor ブラウザー拡張機能 があります。 Microsoft Editor は、rich text editor コントロールとシームレスに連携し、有効にすると、高速で簡単なインライン文法およびスペルチェック機能を提供します。
ユーザー補助のショートカット
次の表に、リッチ テキスト エディター コントロールを使用する際に使用できるユーザー補助のショートカットのリストを表示します。 Alt+0 を押すと、コンテンツの作成中、リストにアクセスできます。
| タイプ | ショートカット キー | 内容 |
|---|---|---|
| 全般 | Alt+F11 | 全画面表示ビューを切り替えます。 |
| タブのナビゲーション | Alt+Ctrl+0 | エディター ツールバーに移動します。 |
| タブのナビゲーション | Alt + 1 | リッチ テキスト エディター に移動します。 |
| タブのナビゲーション | Alt + 2 | HTML エディター に移動します。 |
| タブ ナビゲーション | Alt + 3 | プレビュー ビューに移動します。 |
| 一般的なエディター コマンド | Alt +F10 | エディター ツールバーに移動します。 Tab および Shift+Tab で次および前のツールバー グループに移動します。右矢印または左矢印を使用して、次および前のツールバー ボタンに移動します。 Space キーまたは Enter キーを押して、ツールバー ボタンをアクティブにします。 |
| 一般的なエディター コマンド | Alt+- | エディター ツールバーを展開/折りたたみます。 |
| 一般的なエディター コマンド | 説明を参照してください。 | エディター ダイアログ: ダイアログ内で、Tab キーを押して次のダイアログ要素に移動し、Shift+Tab キーを押して前のダイアログ要素に移動し、Enter キーを押してダイアログを送信し、Esc キーを押してダイアログをキャンセルします。 ダイアログに複数のタブがある場合、タブ リストにはダイアログのタブ順序に従って、Alt+F10 または Tab のいずれかでアクセスできます。 タブ リストがフォーカスされている状態で、右矢印キーと左矢印キーでそれぞれ次のタブと前のタブに移動します。 |
| 一般的なエディター コマンド | 説明を参照してください。 | エディター リスト ボックス: リスト ボックス内で、タブまたは下矢印キーを使用して次のリスト項目に移動します。 Shift+Tab または上矢印で前のリスト項目に移動します。 Enter キーまたは Space キーを押して、リスト オプションを選択します。 Esc キーを押して、リスト ボックスを閉じます。 |
| 基本コマンド | Ctrl + Z | 元に戻すコマンド。 |
| 基本コマンド | Shift+Ctrl+Z | やり直すコマンド。 |
| 基本コマンド | Ctrl+B | 太字のコマンド。 |
| 基本コマンド | Ctrl+I | イタリックのコマンド。 |
| 基本コマンド | Ctrl+U | 下線のコマンド。 |
| 基本コマンド | Alt + 0 | アクセシビリティ ヘルプ。 |
| 基本コマンド | Esc | 操作をキャンセルします。 |
オフライン エクスペリエンス
リッチ テキスト エディター コントロールは、基本構成でオフラインで作業するときに使用できます。 以下は、オフラインで作業するときにサポートされるプラグインと書式設定オプションのリストです。 Web リソース ファイルを使用して追加されたすべての構成は、オフラインでは使用できません。
オフラインで使用可能なプラグイン
次のプラグインは、オフライン時にリッチ テキスト エディターで使用できます。
ajax,autogrow,basicstyles,bidi,blockquote,button,confighelper,contextmenu,dialog,dialogui,editorplaceholder,enterkey,entities,fakeobjects,floatingspace,floatpanel,format,horizontalrule,htmlwriter,indent,indentblock,indentlist,justify,lineutils,list,listblock,maximize,menu,menubutton,notification,notificationaggregator,panel,panelbutton,popup,preview,removeformat,resize,richcombo,selectall,showborders,sourcearea,specialchar,stylescombo,tab,textmatch,textwatcher,toolbar,undo,widgetselection,wysiwygarea,xml
オフラインの書式設定オプション
オフライン時にリッチ テキスト エディターで使用可能な、さまざまな書式設定機能と機能オプションを次の表に示します。
| アイコン | 名称 | ショートカット キー | 説明 |
|---|---|---|---|
|
太字 | Ctrl+B | テキストを太字にします。 |
|
斜体 | Ctrl+I | テキストを斜体にします。 |
|
下線 | Ctrl+U | テキストに下線を引きます。 |
|
箇条書き | 箇条書きリストを作成します。 | |
|
項目番号 | 番号付きリストを作成します。 | |
|
インデントの解除 | 段落をマージンに近づけます。 | |
|
インデント | 段落をマージンから離します。 | |
|
ブロック引用 | コンテンツにブロックレベルの引用形式を適用します。 | |
|
左揃え | Ctrl+L | コンテンツを左マージンに揃えます。 (一般的に、読みやすくするために本文に使用されます。) |
|
中央揃え | Ctrl+E | コンテンツをページの中央に配置します。 (一般的に、正式な外観に使用されます。) |
|
右揃え | Ctrl+R | コンテンツを右余白に揃えます。 (通常、フォーマルな外観に使用されます。) |
|
取り消し線 | 線を引いてテキストに取り消し線を引きます。 | |
|
左から右 | 段落、ヘッダー、表、リストなどのコンテンツのテキストを左から右に変更します。 通常、双方向言語コンテンツに使用されます。 これが既定の設定です。 | |
|
右から左 | 段落、ヘッダー、表、リストなどのコンテンツのテキストを右から左に変更します。 通常、双方向言語コンテンツに使用されます。 既定の設定は左から右です。 | |
|
入力を元に戻す | コンテンツに加えた変更を元に戻します。 | |
|
入力のやり直し | コンテンツに加えた変更をやり直します。 | |
|
すべての書式設定をクリア | 選択したテキストからすべての書式設定を削除し、通常の書式設定されていないテキストだけを残します。 | |
よく寄せられる質問
Q: 入力した文字の表示が遅いのはなぜですか?
A. コンテンツ サイズが大きいと、遅延が発生する可能性があります。 詳細: リッチ テキスト エディターを使用するためのベスト プラクティス。 スペルチェックや文法チェックも入力のパフォーマンスを低下させる可能性があります。
既知の問題
- HTML マークアップは、書式設定が RichText に設定されていないフォームの列以外のコンポーネントに表示されるリッチ テキスト エディターコントロールを使用するように構成された列に対して表示されます。 たとえば、これはビュー、サブグリッド、ページ付けされたレポート、ポータルで発生します。
この問題を解決するには、書式設定 オプションを リッチ テキスト に設定するために必要な手順について、シンプル構成 を参照してください。
参照
Power Apps ポータルを使用して Microsoft Dataverse の列を作成、編集する
注意
ドキュメントの言語設定についてお聞かせください。 簡単な調査を行います。 (この調査は英語です)
この調査には約 7 分かかります。 個人データは収集されません (プライバシー ステートメント)。
フィードバック
フィードバックの送信と表示