Search Banner

:discourse2: Summary Search Banner puts a search bar along with optional headline and subhead text in a banner above the main topic list navigation.
:eyeglasses: Preview Preview it on
:hammer_and_wrench: Repository Link
:open_book: New to Discourse Themes? Beginner’s guide to using Discourse Themes

Install this theme component

By default this banner appears on all top-level topic pages (latest/new/unread/top/categories… anything in the top menu site setting) but it can also be set to only display on a community’s homepage.

:sparkling_heart: This very heavily borrows from @angusHeader Search Theme Component

Available settings

  • Set the headline and subhead text
  • Show the banner on all top-level topic pages (default), just the homepage, or all pages
  • Show the banner for everyone, logged in, or logged out users
  • Set a background image (light mode and dark mode)

Custom styling

The HTML element gets a class named .display-search-banner wherever this banner appears, and the banner itself is wrapped with the .custom-search-banner class, so with some CSS you should be able to customize the appearance of this banner however you see fit.

Future enhancements

  • Add an option to enable the banner in specific categories

Incredible work! :sparkles: Suggestion: add an option to hide this theme component from logged-in users (only visible to visitors/non-users).


Increible work. Thanks for explain this info

This is awesome. is there any way we can put a picture background for the search banner ?

It’s in the theme component settings.


amazing theme component :star_struck: :heart:

it’d be great if it can be merged into other available banner themes, i.e. Versatile Banner, as an option.


How do we show search banner everywhere page? Every topic, every category? Thank!

I’ve updated the theme component to add some new settings:

show on — this determines where the banner appears and has the options

  • top_menu (latest/categories/top/new/unread)
  • homepage
  • all (all pages except the default search page and admin pages)

show for — this determines who sees the banner

  • everyone
  • logged_in
  • logged_out

Thanks a lot for this theme!!!


hi, i have a image after header and I want to put this search after this not before, how to make this?

First of all great thing, looks super clean and easy to manage!

Is there any way to add basic html to the description text? I would love to add some icons and links.

I’ve installed it and it’s really great

Is there any way to display it only to tl0 + tl1 users?

1 Like

This theme component shows users in search (mobile view) but why doesn’t the normal search bar shows users in mobile search?

1 Like

Brilliant theme @awesomerobot! Thanks a million.


There seems to be an issue with the Who’s Online plugin and the official Search banner theme component .

That is, the user card is being displayed in an irregular fashion when this plugin is enabled with that theme-component.

After disabling the theme-component, it’s aligned the right way.
Can you please check if there’s something that you could do on this?
(Something like a fix to always display the user-card below the clicked location, instead of automatically choosing an alignment?)

I don’t think this is a theme-specific issue. I tried with all themes including the default one and the issue persists.


This means it is a problem with the theme component, not the plugin. I’ve made a change to the component that should fix it (also moved your post to the component topic).


Thanks a lot, works good now :slight_smile:

Yeah I got that. Just thought if the issue could be fixed from the plugin by setting something like always displaying the user-card only beside the user-icon. (And also thought if this theme-component was no longer being updated since the last commit was almost 1 year ago :wink: )


hi, after the recent update, the search banner won’t show up if the Topic list sidebar navigation theme is also active.


oh I see, I wasn’t accommodating the plugin outlet in the layout… if you update the component this should fix it: