Using an Image for a Global Banner Topic - Dimensions?

Product Support

AI-generated summary

The discussion revolves around using an image as a global banner on a Discourse forum. hannah.neil wants to display a graphic announcing their user conference, but encountered issues with image dimensions when pinning a topic as the global banner. nolo suggests using the Versatile Banner theme component. Alternatively, awesomerobot recommends using a 1050px x 150px image, and provides custom CSS to re-scale the image on smaller browsers. hannah.neil appreciates the guidance and feels more confident in implementing a solution.

1

Hello!

My goal: I am looking for an easy way to have an image as a pinned global banner. We’re announcing our user conference and have a pretty graphic I’d like to display instead of just text.

What I’ve Tried:

  • I created a topic with only an image in the body, no text, and pinned that as the global banner. It worked but the dimensions were definitely incorrect - too much height, not enough width.
  • I don’t want to use the settings > global notice function as it is certainly not an emergency.

If this has worked for you before, what dimensions did you use for the image? If I’m barking up the wrong tree entirely, is there another simple way to do this?

Thank you!

2

Maybe use this theme component?

3

That theme component might be a good route, but if you really want to use the pinned banner you can fit a 1050px x 150px image in there without hitting any scrollbars.

Note that as you narrow the browser the image won’t fit, and scroll will return. You can avoid this with a little custom CSS added to your theme to re-scale the image… but the image will start getting really small once you’re down to the size of a mobile device, so it’s not perfect.

#banner img {
    width: 100%;
    height: auto;
}
4

Thank you all for the help! I appreciate the guidance and will try these solutions. This feels significantly less intimidating now.