Randomized Banner

Background

My forum is known for a rotating series of fun banners. Here’s a plugin I use to enable randomly showing different banners between visits or when the user performs a refresh.

How to install

:information_source: Summary Adds a banner that is randomly chosen from a list.
:hammer_and_wrench: Repository GitHub - ScottMastro/discourse-randomized-banner: Randomized Discourse Banner Plugin
:open_book: Install Guide How to install plugins in Discourse


:arrow_down: REFRESH :arrow_down:


Plugin options

Banner images to be randomized are included in the banner images setting. To show a guest (user not logged in) a unique static banner, add it to the guest banner setting. To show all users a static banner, use the override banner setting.

SEO implications

Since the random nature of this plugin making the banner dynamic, a naive implementation may stick the random banner in to late causing a high Largest Contentful Paint (LCP) measure and may cause a Content Layout Shift (CLS).

For LCP, the optimize lcp option preloads the guest banner and override banner (if they exist) so they are drawn faster. The randomized banners are not preloaded to minimize preloading assets that aren’t used. It is important to keep the file sizes of your banners smaller to minimize the time to download the banners.

NOTE
I have kept the LCP down to sufficient levels on my forum, but I try to use banners smaller than 2MB and I use a CDN. I also made my guest banner about 200KB. But I changed the implementation of the plugin right before typing this post. There should not be LCP issues however there’s no guarantee. I plan to monitor my LCP. Please use with caution.

For CLS, content shift is avoided by defining the image size in advance in the HTML. The banner aspect ratio is needed in advance to draw the div that holds the banner. Therefore, you want all your random banners to have roughly the same aspect ratio. Other ratios will be accommodated by may be stretched or shrunk.

8 Likes