LWR サイト構築を加速させる！Experience Cloud 向け AppExchange コンポーネント 13選

この記事はバージョン Winter ’26 において執筆しています。
現在の動作と異なる場合がありますので、ご認識おきください。

最近は Lightning Web Runtime (LWR) ベースのサイト構築が主流になりつつありますが、従来の Aura サイトに比べて「標準コンポーネントが足りない」「痒い所に手が届かない」と感じる場面もまだ多いのではないでしょうか。

今回は、そんな悩みを解消してくれる「Experience Cloud LWR Apps」サイトで紹介されている、便利な AppExchange コンポーネント（Salesforce Labs 製の無料・オープンソース）をまとめてご紹介します。これらを活用して、開発スピードを劇的に向上させましょう！

DXforce Point

※本記事で紹介するコンポーネントは Learn Experience Cloud で紹介されている情報を基にしています。導入の際は必ず AppExchange の最新情報やメンテナンス状況をご確認ください。

なぜ LWR 向けコンポーネントが必要なのか？

LWR はパフォーマンスが高く、開発の柔軟性も高い反面、Aura 時代にあった「タブ」や「アコーディオン」などの標準コンポーネントが初期段階では不足していました（※現在は標準機能も拡充されつつあります）。

ここで紹介するコンポーネントは、そうしたギャップを埋め、さらに高度なデザインや機能を実現するための強力な助っ人たちです。

サイトの見た目を整える上で必須級のコンポーネントです。

LWR のレイアウトにおける「救世主」です。

以下の記事で使い方を紹介しています。

標準コンポーネントで実現しにくい複雑なタブやアコーディオンUIを作成できます。

特徴:
- 最大10個のタブまたはアコーディオンセクションを作成可能。
- アコーディオンは、あらかじめ開いておくかどうかを個別に設定可能。
- [Render Mode] を [Tabs w/ Accordion on Mobile] に指定すると、モバイルビューではアコーディオンに、それ以外のビューではタブに自動表示します。
メリット: 各セクションに他のコンポーネントをドラッグ＆ドロップで配置できるため、情報量の多いページをスッキリ整理できます。

LWR サイトで自由なモーダルウィンドウを実装できます。

特徴:
- ボタンクリックだけでなく、スクロール率や経過時間などをトリガーにモーダルを表示可能。
- モーダルの表示領域を「すべて」「ボディのみ」「ヘッダーとボディ」「ボディとフッター」から選択可能。
- モーダルを閉じた後の動作に「何もしない」「画面再読み込み」「別URLに遷移」から選択可能。
- その他設定や細かいスタイル指定も多数。
メリット: フローや動画、フォームなどをモーダル内に配置でき、CV率向上や重要なお知らせの表示に役立ちます。