Salesforce の FullCalendar と MultiDatePick: カスタマイズ性の高い LWC カレンダーはどちら?
一方は、その上に自分で構築する JavaScript のカレンダーエンジン。もう一方は、設定するだけで使える Salesforce カレンダー。「カスタマイズできるカレンダー」でよく挙がる要件を、FullCalendar の方が適しているケースも含めて 1 つずつ並べて比較します。
「Salesforce で自由にカスタマイズできる LWC カレンダー」を探すと、必ず 2 つの名前が挙がります。公式の Lightning Web Component ラッパーを提供するようになったオープンソースの JavaScript カレンダー FullCalendar と、ネイティブのカレンダー兼予約スイート MultiDatePick です。どちらも「カスタマイズできる」と言われますが、その意味はまったく違います。
FullCalendar はコードでカスタマイズします。オプションオブジェクトを渡し、コールバックを書き、Salesforce 側 (レコードを読み込む Apex、保存処理、権限) は自分で構築します。MultiDatePick は設定でカスタマイズします。3 つのコンポーネントに 130 以上の設定があり、セットアップウィザードか Lightning App Builder で、標準オブジェクトにもカスタムオブジェクトにも設定できます。Apex は不要です。
要件を並べて比較
カスタマイズできる Salesforce カレンダーを探すときによく挙がる機能です。「組み込み」は管理者がクリックで有効にできること、「自分で構築」は開発者がコードを書く必要があることを意味します。
| 機能 | MultiDatePick | FullCalendar LWC |
|---|---|---|
| 表示 | 5 つを組み込み: 月カレンダー、リソースタイムライン、時間単位の週表示、稼働率ヒートマップ、予定一覧。配置ごとに選択 | 月、週、日、リスト。タイムラインとリソース表示には Premium ライセンスが必要 |
| ドラッグ&ドロップ | タイムライン上の予約をドラッグして移動、端をドラッグして時間を変更。複数の日にまたがってドラッグすると期間を選択 | ドラッグ、ドロップ、リサイズに対応。コールバックは自分で記述 |
| Salesforce の項目に基づく色分け | 任意の選択リストの値ごとに色を設定。塗りつぶし、バー、またはその両方で表示し、フィルターピルも付属 | 項目の値と色の対応を JavaScript で記述 |
| カスタムオブジェクトをデータソースに | 日付項目または日付/時間項目があれば、ToDo や行動を含む標準・カスタムのどのオブジェクトでも利用可能 | Apex とデータ層を自分で記述 |
| フィルター | 状況のフィルターピル、OwnerId=ME; Status__c=Confirmed のようなレコードフィルター、リソースフィルター、非表示の状況 | フィルターを自分で構築 |
| 予定の詳細とレコードへのリンク | 任意の項目 (参照項目も可) を表示するホバーカード、月表示の日付に名前を表示、予定一覧に列を追加、ワンクリックでレコードへ | 予定の描画をコードで完全に制御 |
| ラベルとボタン | ボタン、タイトル、保存、レコードの各ラベル、切替に表示する表示の種類、最小から全幅までのサイズ | ツールバーをコードで設定 |
| レコードの保存 | 保存時にレコードを作成。日付ごと、期間ごと、時間ブロックごと、リソースごとに 1 件。または日付を画面フロー (Screen Flow) に返す | 保存処理を自分で構築 |
| 予約ルール | 定員、競合チェック、最低事前通知、自動で進む予約期間、バッファー、営業時間、リソースごとのブロック日 | 自分で構築 |
| 言語とタイムゾーン | 9 言語に対応。日付と時刻は各ユーザーの Salesforce のロケールとタイムゾーンで表示 | 豊富なロケールとタイムゾーンのオプションをコードで設定 |
| セキュリティ | すべてのクエリと保存を表示中のユーザーとして実行するため、共有設定と項目レベルセキュリティが適用されます。Salesforce のセキュリティレビューに合格済み | 自分で書く Apex 次第 |
| 保守 | ベンダーがパッケージで更新を提供 | 自社コードを最新に保つ必要あり |
FullCalendar の用語と、MultiDatePick での対応箇所
FullCalendar を知っていれば、その用語のほとんどに直接対応するものがあります。違いは、どれも自分で書く関数ではなく設定項目だという点です。
| FullCalendar | MultiDatePick の設定 |
|---|---|
eventSources | 関連オブジェクトと日付項目。さらに積み上げ項目で、最大 5 階層先の参照関係にあるレコードも読み込み |
| 背景イベント | ブロック日付: 任意のオブジェクトから休業日、祝日、休暇を読み込み。終日でも一部の時間でも指定でき、理由も表示 |
businessHours | リソースごとの営業時間。リソースレコードの 2 つの項目から読み込み |
eventOverlap、selectOverlap | 競合の動作 (ブロック、スキップ、許可) とリソースごとの定員 |
validRange、selectConstraint | 最小日付と最大日付、何日先まで予約可能か、最低事前通知、予約間のバッファー |
select、dateClick | 複数の日付を選択、ドラッグで期間を選択、繰り返しパターンを追加、時間枠を選択 |
eventDrop、eventResize | タイムラインでドラッグして移動や時間変更。ドロップした時点で保存し、その前に休業日と競合をチェック |
eventClick | レコードを開く、または編集モードで複数レコードの状況、日付、時刻、リソースをまとめて変更 |
eventContent、ポップオーバー | ホバー項目、月表示の日付に表示する名前、予定一覧の列 |
resources | リソースオブジェクト: 会議室、機器、車両、人 (ユーザーを含む任意のオブジェクト) |
slotDuration、slotMinTime | 時間間隔と、最小時刻・最大時刻 |
locale、timeZone | 自動: 各ユーザーの Salesforce の言語、ロケール、タイムゾーン |
FullCalendar の方が適しているケース
FullCalendar の評価は伊達ではなく、プロジェクトによっては最適なツールです。
- 四半期の計画ボードや独自の配車レイアウトなど、どの製品にもない表示形式が必要な場合。
- 独自の HTML やアイコンをバーの中に入れるなど、予定を 1 ピクセル単位で描画したい場合。
- 予定のデータが Salesforce の外にあり、複数の API から同時に取得する場合。
- Apex、保存処理、テスト、権限を構築し、保守し続けられる開発者がいる場合。
- 予定を表示するだけでよく、無料のコアライブラリを使いたい場合。
このようなプロジェクトなら、FullCalendar は優れた土台になります。一方、今週中に Salesforce のレコードで動くカレンダーが必要なら、完成までの道のりはかなり長くなります。
MultiDatePick で省ける開発作業
FullCalendar で自分で作る必要がある部分は、MultiDatePick にすでに備わっています。
複数の日付を選択
飛び飛びの日、期間、繰り返しパターンを選び、子レコードとして保存するか画面フローに渡します。
定員付きの予約
リアルタイムの空き数バッジ、保存時の競合チェック、1 回の予約で複数リソースを確保。
守られるルール
事前通知、予約期間、バッファー、営業時間、休業日を、選択時にもドラッグ時にも適用。
セットアップウィザード
レコードについての 3 つの質問に答えたら、実際のカレンダーをライブプレビューで見ながらすべての設定を調整。
画面フロー
選択した日付、期間、時刻を Flow 変数として受け取り、次の処理に使えます。
公開予約ページ
ゲストユーザー向けの Experience Cloud サイトでも、同じカレンダーと同じルールで。
予約だけではありません
MultiDatePick は予約で知られていますが、既存のレコードを表示するカレンダーとしても使えます。取引先ページに配置すれば、取引先責任者や商談に登録されたものも含めて取引先の ToDo を表示できます。商談の完了予定日、キャンペーンのイベント日、プロジェクトのマイルストーンも、どのオブジェクトでも表示可能です。OwnerId=ME のようなレコードフィルターと一緒に Show All Records を有効にすれば個人用カレンダーに。読み取り専用の予定一覧や稼働率の表示を使えば、編集せずにスケジュールを確認できます。
よくある質問
Salesforce で最もカスタマイズできる LWC カレンダーは?
誰がカスタマイズするかで答えが変わります。FullCalendar の LWC ラッパーはすべてがコードなので、開発者にとって最も自由度が高い選択肢です。MultiDatePick は管理者向けの組み込みオプションが最も豊富で、3 つのコンポーネントに 130 以上の設定、5 つの表示、6 通りのレコード保存方法を備え、Apex は一切不要です。
Salesforce で FullCalendar は無料で使えますか?
コアライブラリはオープンソースです。ただしタイムライン表示とリソース表示は商用ライセンスが必要な Premium 機能で、Salesforce 側の処理 (レコードの読み込み、保存、セキュリティ、テスト) は自社で書いて保守するコードになります。
MultiDatePick に Apex や開発者は必要ですか?
いいえ。セットアップウィザードか Lightning App Builder で、標準オブジェクトにもカスタムオブジェクトにも設定できます。レコードは表示中のユーザーとして読み込み、保存されるため、共有設定と項目レベルセキュリティが適用されます。
MultiDatePick で ToDo、行動、商談を表示できますか?
はい。日付項目または日付/時間項目があるオブジェクトなら、標準でもカスタムでも使えます。積み上げ項目を使うと、取引先の取引先責任者に登録された ToDo のように、離れた場所からページのレコードを指すレコードも表示できます。
MultiDatePick にリソースタイムラインはありますか?
はい。タイムライン、週、稼働率ヒートマップ、予定一覧の各表示がカレンダーに含まれ、追加ライセンスは不要です。プランは 1 つで、すべての機能を使えます。
開発不要で、カスタマイズできるカレンダーを。
ライブデモを操作してみるか、Config Library の既製の設定から始めましょう。
- $20/ユーザー/月ですべての機能
- 30 日間無料、カード不要
- 100% Salesforce ネイティブ
- Apex 不要
- Salesforce AppExchange で近日公開