テキストブロック

概要

Avonniテキストブロックコンポーネントは、Experience Cloud サイトにテキストベースのコンテンツを統合するための必須かつ多用途な方法を提供します。

Avonniテキストブロックは リアクティブデータコンポーネント

Avonniテキストブロックコンポーネントの使用方法

コンポーネントの追加

• Experience Cloud サイトの Experience Builder 内で、Avonniテキストブロックを追加したいページまたはセクションに移動します。

• コンポーネントパネル内で Avonniテキストブロックコンポーネントを見つけ、ページ上の目的の位置にドラッグします。

テキストエディタの設定

• コンポーネントを配置すると、「テキストエディタ」設定エリアが表示されます。

• テキストを入力します: 表示したいコンテンツの入力を開始します。テキストエディタセクション内のリッチテキストコンテンツエディタは、馴染みのあるワープロ機能を提供し、次のようなツールを備えています:

  • 書式設定: 太字、斜体、下線

  • 見出しレベル: さまざまなヘッダーサイズ（H1、H2、H3など）から選択

  • 箇条書きおよび番号付きリスト

  • リンク: ハイパーリンクを追加して、ユーザーを他のページやリソースに誘導します。

外観のカスタマイズ

Avonniテキストブロックコンポーネントは、テキストコンテンツの視覚的表示をパーソナライズするためのさまざまな外観設定を提供します。これらの設定により、デフォルトのサイト設定を上書きして、強調表示やブランド整合性のためにコンポーネントの見た目を調整できます。

テキスト設定

• 色： 最適なコントラストと可読性のためにテキストの色を決定します。カラーピッカーツールで簡単に選択できます。

• フォントサイズ： テキストのサイズを制御します。通常はピクセル（px）やemで表され、この設定はユーザーがテキストを読みやすいと感じるかどうかに直接影響します。

• フォントスタイル： 斜体やオブリークなどのバリエーションをテキストに適用します（注意: すべてのフォントに斜体またはオブリークのバリアントが備わっているわけではありません).

• フォントファミリー： ウェブセーフフォントの選択肢から選んで、テキストの全体的な視覚的特徴を定義します。

• フォントの太さ： light、normal、bold のようなオプションや数値の font-weight 値を使用して、テキストの太さを調整します。

背景設定

• 色： テキストブロックの背後に表示される背景色を設定します。ユーザビリティのためにコントラストを考慮し、重要なコンテンツを強調するために戦略的に使用してください。

重要な考慮事項

• 上書き: Avonniテキストブロックコンポーネント内のこれらの外観設定は、Experience Cloud サイト内で確立されたデフォルトのスタイリングより優先されることを忘れないでください。

• 判読性: カスタマイズ時は常に読みやすさを優先してください。良好なコントラストと適切なフォントサイズが重要です。

• ブランド整合: 外観の選択がサイト全体のブランドスキームに準拠していることを確認するよう努めてください