The Silverline BlogExpert Salesforce tips & tricks, articles and musings. Sprinkled with fun.

Salesforce Lightning Components: Banner


Hello again, Admins and App Builders! Two weeks ago, Kathleen shared one of our favorite new Lightning Components which can help you with event management and registering people for events. Have you checked out RSVP yet?  Be sure to share your feedback if you have!

Today, we’re going to check out another free component we’ve released to help you build beautiful Lightning apps – it’s called BannerAs we here at Silverline build out new Lightning Apps, our top priority is always the user experience. We know strong UX is critical to promote user adoption and get people buzzing about how powerful Salesforce is! So, how do you make your Lightning apps really pop? One way is with the visual appeal of banner images!

We knew there was a common need to quickly and easily add custom images and text to Home Pages, Record Layouts, and in new custom Apps. Plus, one of the most popular components in our AppExchange intranet app has always been the banner. So, we built this new Banner component, available to any Salesforce user who has enabled the Lightning Experience, to help admins easily display a slideshow of images and text on any record page.

Here’s a quick list of some of its features:

  • Configure a group of images to display on any record page, or in your Community
  • Place your Banner in the main section of the page, or in the sidebar
  • Use static image links or pull dynamically from a Salesforce document folder
  • Customize image height from 50px to 1000px and add descriptions and call-to-action links
  • Define custom transitions to make the experience engaging!

As you can see from the options below, this component is super customizable!  On the component edit page, you can choose up to 21 custom behaviors, including the transition effects, number of seconds in a transition, height of the images, and whether to display descriptions. Click the image below to see in high-res glory all the available options:

Silverline Lightning Components: Banner

Banner in Action

As you can see in the screenshot, I added the Banner component to my Trailhead environment. While I was doing the Build a Battle Station project, I thought my users would be way more psyched to see previews of what the Battle Station could look like once built, so I used the App Builder and Banner to pull in some space station inspiration photos. I also turned on the image thumbnails so they can click in to see more.

Once I customized the component and previewed the record page with Banner saved to the Main section of the record, I realized that it might be nicer to have smaller images in the sidebar with links to enlarge. Below is a preview of the same component in the Sidebar section!

Silverline Lightning Components: Banner - Sidebar

Now I can view the images in context with my Related Lists, Detail components, and more – a much better user experience! But even if you’re not building a Battle Station app for your users, we’ve seen a lot of other great use cases. (If you ARE building Battle Station apps for real, please be in touch – we totally want to get into interstellar space travel projects.)

Some other great examples we’ve seen for Banner:

  • Use in conjunction with Path to show custom internal images to illustrate your processes
  • Include on your Product or Asset record pages to show graphics and photographs
  • Add to your Opportunity sidebar to promote current internal sales SPIFs via graphics
  • Use on your Home page to share photos from your company’s recent events and celebrate the team!

Ready to try out our Banner Lightning Component?

Download Banner for free and get started now! And let us know how you’re using it, or if you need help getting started in the comments below! And if you need step by step help on how to get started, be sure to check out the Banner User Guide on the AppExchange.

Additional Components:

Leave a Reply

1 Comment threads
0 Thread replies
Most reacted comment
Hottest comment thread
1 Comment authors
Mike Ewan Recent comment authors
newest oldest most voted
Notify of
Mike Ewan
Mike Ewan

Can you comment as to when this will be compatible with community? The base url for the community is getting passed in to the url for the image in the document folder, which is invalid

Need a custom solution? We can help. Let's Chat