Communityサイトで画面フローを活用して、営業担当プロフィールをカード表示したかったのです。
![](https://skmz.jp/wp-content/uploads/2022/12/ProfileCard.png)
imgタグを普通に使うことはできない
![](https://skmz.jp/wp-content/uploads/2022/12/image-8.png)
例えば上記のように、imgタグを普通に画面フローの「表示テキスト」で入れてみます。
![](https://skmz.jp/wp-content/uploads/2022/12/image-6.png)
すると、こんな風にそのまま表示されてしまいます。
いちど、変数に入れてから使う
例えば、PhotoURLというテキスト変数を作って、そこにimgタグを割当するとこんな感じです。
![](https://skmz.jp/wp-content/uploads/2022/12/image-7.png)
![](https://skmz.jp/wp-content/uploads/2022/12/image-9.png)
<img src="{!GetUser.MediumPhotoUrl}" />
※{!GetUser.MediumPhotoUrl}の部分はお好きなURLや変数などを入れてください
![](https://skmz.jp/wp-content/uploads/2022/12/image-10-1024x578.png)
表示テキストで、「リソースを挿入」から先ほどimgタグを割当した変数を入れてください。
![](https://skmz.jp/wp-content/uploads/2022/12/ProfileCard.png)
なんと、画像(imgタグ)がそのまま表示されるではありませんか!
表示されなかった人へ
外部のWebサイトからリソースを表示することはリスクが伴います。
画像などの静的リソースは、なるべくSalesforce内で管理をするべきです。
画像URLを直接指定して表示されなかった場合、「CSP 信頼済みサイト」という設定が必要です。
設定→セキュリティ→CSP 信頼済みサイト
【新規信頼済みサイト】のボタンを押して、以下のように追加してください。
![](https://skmz.jp/wp-content/uploads/2022/12/image-11.png)
無事に、画像が表示されるようになります。
コメントする