Salesforce の画面に画像を配置する方法　静的リソース＆リッチテキストコンポーネント

Salesforce の画面に画像を配置するシリーズ、今回は静的リソース＆リッチテキストコンポーネントを使用します。リッチテキストコンポーネントなので、Lightning アプリケーションビルダーを使って作成するLightning ページ（アプリケーションページ、ホームページ、レコードページ）上に配置することができます。

今回は例として、『キャンペーン』のレコード画面に、画像付きの「関連レコード（キャンペーンメンバーの状況）と共にコピー」の手順を載せます。

静的リソースを作成する

「Salesforce のレコード詳細画面に画像を配置する方法　静的リソース＆数式項目の場合」で載せた静的リソースの作成手順とほぼ同様です。

1.［設定 ＞ホーム ＞カスタムコード ＞静的リソース］の画面を開いて、【新規】をクリックします。


2.「名前」を入力し、ファイルを選択して保存します。
「説明」は必要に応じて入力してください。「キャッシュコントロール」は、コミュニティなどを使用していない場合は、「公開」でOKです。

リッチテキストコンポーネントを配置して画像を張り付ける

1.別タブでキャンペーンのLightningレコードページを開き、リッチテキストコンポーネントを画面にドラッグ＆ドロップして配置します。
Lightningレコードページの作成方法については、会員登録（無料）で閲覧できるプレミアムコンテンツの「Lightning ページの作成②レコードページを作成する」をご参照ください。


2.コンポーネントをクリックして、右側にエディタを表示させます。


3.静的リソースの画面で、 「ファイルを表示」リンクをクリックします。


4. 表示された画像を右クリックし、「画像をコピー」を選択します。


6. Lightning レコードページに戻り、リッチテキストコンポーネントのエディタに直接ペーストし保存します。

レコードページを見てみると…

画像が表示されました。

ひとこと

操作における注意事項や、必ず読んでもらいたいメッセージなどを載せる、といった活用方法が考えられます。また、コンポーネント表示の検索条件を使うことで、レコードの値や操作を行っているユーザによって表示/非表示を設定することもできます。

関連記事

Salesforce のレコード詳細画面に画像を配置する方法　静的リソース＆数式項目の場合
Salesforce のレコード詳細画面に画像を配置する方法　ファイル＆数式項目の場合
Lightning ページの作成②レコードページを作成する（プレミアムコンテンツ）