推奨事項: レンダリングの使用

Version: 10.4
日本語翻訳に関する免責事項

このページの翻訳はAIによって自動的に行われました。可能な限り正確な翻訳を心掛けていますが、原文と異なる表現や解釈が含まれる場合があります。正確で公式な情報については、必ず英語の原文をご参照ください。

SXAには、モジュラー コンポーネント ベースの設計を保証するために、事前定義されたレンダリングとレンダリング バリアントのライブラリが付属しています。カスタムレンダリング(バリアント)を作成することもできます。レンダリングを賢く使用することで、作業をより効率的に行うことができます。

ジョブに適切なレンダリングを使用する

ページ・レイアウトの大部分をレンダリングするために、ページ・コンテンツ、ページ・リスト、プロモーション、リッチ・テキストなどの汎用性の高いレンダリングを使用することは避けてください。目的に適したレンダリングを使用してください。標準レンダリングのクローン を作成し、レンダリングの目的を説明する名前を付けることを検討します。

たとえば、次のデフォルト レンダリングのクローンの名前を使用すると、ビジネス ユーザーはその目的をすぐに理解できます。

  • ティーザー (ページ コンテンツ レンダリングのクローン) は、コンテンツをからかうためにページにリンクするように設定されています。

  • ハイライト または コールトゥアクション (プロモーションレンダリングの単純なコピー)は、ジョブに適したスタイルとレンダリングバリアントのセットを提供します。

  • ヒーローカルーセル (カルーセルコンポーネントのクローン)は、プロジェクトに固有のレンダリングバリアントを持つ事前設定されたスライドデータソースとコンポーネントを備えています。

レンダリングのグループにスニペットレンダリングを使用する

エディターがページのセクションを形成するために一連のレンダリングを頻繁に使用する場合は、スニペットレンダリングの使用を検討してください。

スニペット レンダリングは、複数のレンダリングの埋め込みをサポートし、レンダリングを構成でき、スニペット、その構成、およびコンテンツのコピーをページに追加するように指定できます。編集者がスニペットを変更すると、その変更はその特定のページにのみ適用されます。

作成者が編集するコンテンツには、プレーンHTMLレンダリングを使用しないでください

複雑なコンポーネントの場合は、配置できるHTMLについて完全な自由度が得られるプレーンHTMLレンダリングの使用を検討することもできます。ただし、この方法でページコンテンツを追加すると、すべてのコンテンツ編集者がHTMLコードの編集方法を知っているわけではないため、編集者が作業するのが難しくなる可能性があります。プレーンHTMLレンダリングの代わりに、クローン、バリアント、またはHTMLスニペットの使用を検討してください。

プレーンHTMLレンダリングを使用する前に、次の他のオプションを検討してください。

  • SXAレンダリング (プロモーション レンダリングなど) をコピーしてカスタマイズします。

  • より精巧な レンダリング バリアントを作成します。これにより、(レンダリングバリアントの)コンポーネントマークアップを完全に制御しながら、テキストと画像をエディターで編集可能にすることができます。これは、ビジュアルコンポーネントに適したアプローチです。

  • メタパーシャルデザインでHTMLスニペットを使用します。コンポーネントに編集するビジュアルコンテンツがない場合(例えば、ページにJavaScriptコードを配置する場合など)は、メタパーシャルデザインでHTMLスニペットを使用することを検討してください。

    メモ

    この機能は、SXAバージョン1.7以降で利用できます。

リッチテキストフィールドの内容が完全に編集可能であることを確認してください

サイトのデプロイ後にマーケターが維持することが期待されるテキストを提供する場合は、WYSIWYGエディターを使用して保守できないマークアップやクラスを絶対に入れ ないでください

エディターがテキスト要素にクラスを配置する必要がある場合 (テーマで特定の方法でスタイルを設定する必要がある場合)、これらのクラス をSitecoreリッチ テキスト エディターに追加する必要があります。このように、ドロップダウンメニューで利用できます。その後、エディターはHTMLビューに切り替えることなく、コンテンツのスタイルを設定できます。

また、コンテンツの公開後に予期せぬ事態を避けるために、スタイルがリッチテキストエディタ内の外観に反映されていることを確認する必要があります。

ページでより複雑なHTMLコードが必要な場合は、Rich Textフィールドに複雑なHTMLを配置するのではなく、コンポーネントのクローン作成、レンダリングバリアントの設定、またはカスタムコンポーネントの作成を検討してください。

何かフィードバックはありますか?

この記事を改善するための提案がある場合は、