# Advanced Search Banner

**URL:** https://meta.discourse.org/t/advanced-search-banner/122939
**Category:** Theme component
**Tags:** official, deprecated, search-banner, advanced-search-banner
**Created:** [July 15, 2019, 3:49am UTC](https://meta.discourse.org/t/advanced-search-banner/122939 "2019-07-15T03:49:07Z")
**Posts on this page:** 20
**Page:** 3

<div class="post-metadata">

### Author: ![awesomerobot](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/awesomerobot/32/142900_2.png) [@awesomerobot](https://meta.discourse.org/u/awesomerobot)
#### Post date: [July 17, 2025, 7:01pm UTC](https://meta.discourse.org/t/advanced-search-banner/122939/180 "2025-07-17T19:01:02Z")

</div>

Not entirely sure what’s causing this, but it seems like it is probably related to [Themeable site settings are now available](https://meta.discourse.org/t/themeable-site-settings-are-now-available/374232)

Which theme are you using? How are these settings for the theme configured?

 ![image](https://global.discourse-cdn.com/meta/original/4X/b/4/3/b43896c7a589c20b71169d07b27323738fd5dc9b.png)

I think if you have `search field in site header` set and this component installed, you end up in the state you describe where search is _only_ in the banner and doesn’t appear in the header at all… does that sound accurate?

---

<div class="post-metadata">

### Author: ![RBoy](https://avatars.discourse-cdn.com/v4/letter/r/2bfe46/32.png) [@RBoy](https://meta.discourse.org/u/RBoy)
#### Post date: [July 17, 2025, 9:56pm UTC](https://meta.discourse.org/t/advanced-search-banner/122939/181 "2025-07-17T21:56:55Z")

</div>

Using the default theme and these are the settings.

 ![IMG_0256](https://global.discourse-cdn.com/meta/original/4X/d/d/6/dd64eda9bc5233642792b1ad668e39910f4dad08.jpeg)

---

<div class="post-metadata">

### Author: ![RBoy](https://avatars.discourse-cdn.com/v4/letter/r/2bfe46/32.png) [@RBoy](https://meta.discourse.org/u/RBoy)
#### Post date: [July 26, 2025, 5:23pm UTC](https://meta.discourse.org/t/advanced-search-banner/122939/182 "2025-07-26T17:23:07Z")

</div>

Any idea the root cause and if needs a component fix or discourse fix?

---

<div class="post-metadata">

### Author: ![tknospdr](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/tknospdr/32/529762_2.png) [@tknospdr](https://meta.discourse.org/u/tknospdr)
#### Post date: [August 4, 2025, 2:16pm UTC](https://meta.discourse.org/t/advanced-search-banner/122939/183 "2025-08-04T14:16:47Z")

</div>

I updated one of my sites and this theme component got… squished.

Unfortunately, I don’t have a screenshot of what the homepage looked like before the update, but I’ll post a screenshot of what it looks like now. It’s basically been smashed so it’s not as tall as it used to be.

 ![squished](https://global.discourse-cdn.com/meta/original/4X/7/7/a/77aaf7a7a8387354920cedf5a6dec457d2569d61.jpeg)

And here’s the original banner, the search bar used to be in the open area that’s now missing.

 ![advanced-search-banner-a](https://global.discourse-cdn.com/meta/original/4X/6/0/9/609c9563f4d8c7d229b495a2cb967782a63aa2df.jpeg)

---

<div class="post-metadata">

### Author: ![tknospdr](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/tknospdr/32/529762_2.png) [@tknospdr](https://meta.discourse.org/u/tknospdr)
#### Post date: [August 4, 2025, 5:09pm UTC](https://meta.discourse.org/t/advanced-search-banner/122939/184 "2025-08-04T17:09:03Z")

</div>

Looks like it’s not an issue with the search banner per se.

I made sure to uncheck the box to update theme component with Discourse updates, then I updated my other production site, and that one shrunk the banner as well.

How do I get the original banner size back? These smaller ones are ugly.

---

<div class="post-metadata">

### Author: ![tknospdr](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/tknospdr/32/529762_2.png) [@tknospdr](https://meta.discourse.org/u/tknospdr)
#### Post date: [August 4, 2025, 5:25pm UTC](https://meta.discourse.org/t/advanced-search-banner/122939/185 "2025-08-04T17:25:27Z")

</div>

Found a screenshot of pre-update on my 2nd site.

What it used to look like:

 ![PNG image](https://global.discourse-cdn.com/meta/original/4X/4/7/1/471c27858894e58d71deb3d10d6cb111ed742d8e.jpeg)

And now:

 ![PNG image](https://global.discourse-cdn.com/meta/original/4X/1/f/8/1f8042f552d5506d3352a87da7b3f647baaec417.jpeg)

The admin notice is for an unrelated bit of code and does not exist on my other site.

---

<div class="post-metadata">

### Author: ![eisammy](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/eisammy/32/528804_2.png) [@eisammy](https://meta.discourse.org/u/eisammy)
#### Post date: [August 4, 2025, 7:06pm UTC](https://meta.discourse.org/t/advanced-search-banner/122939/186 "2025-08-04T19:06:34Z")

</div>

Same here, for some reason my banner broken

try this temporary fix =\> desktop =\> common

```plaintext
.search-banner {
    background-image: url(https://segredin.com/uploads/default/original/1X/3f044a906d2c358806610fc756e09991d25323ed.webp);
    background-size: cover;
    background-repeat: no-repeat;
    border-radius: 15px;
    margin-bottom: 10px !important;
    height: 17em;
    padding-top: 50px
}

```

@edit

> [@tknospdr](#):
>
> Corrigido com `padding-top: 50px`

---

<div class="post-metadata">

### Author: ![tknospdr](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/tknospdr/32/529762_2.png) [@tknospdr](https://meta.discourse.org/u/tknospdr)
#### Post date: [August 4, 2025, 7:27pm UTC](https://meta.discourse.org/t/advanced-search-banner/122939/187 "2025-08-04T19:27:57Z")

</div>

Thanks, that fixes the size of the banner, but the contents are at the top instead of centered.

 ![banner](https://global.discourse-cdn.com/meta/original/4X/6/c/e/6ce6391033d6281ebd6bb32f8204fd14c19dd1fb.jpeg)

---

<div class="post-metadata">

### Author: ![tknospdr](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/tknospdr/32/529762_2.png) [@tknospdr](https://meta.discourse.org/u/tknospdr)
#### Post date: [August 4, 2025, 7:44pm UTC](https://meta.discourse.org/t/advanced-search-banner/122939/188 "2025-08-04T19:44:23Z")

</div>

Fixed with `padding-top: 50px`

---

<div class="post-metadata">

### Author: ![tknospdr](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/tknospdr/32/529762_2.png) [@tknospdr](https://meta.discourse.org/u/tknospdr)
#### Post date: [August 4, 2025, 8:30pm UTC](https://meta.discourse.org/t/advanced-search-banner/122939/189 "2025-08-04T20:30:14Z")

</div>

Of course this is still 100% broken in moblle.

---

<div class="post-metadata">

### Author: ![eisammy](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/eisammy/32/528804_2.png) [@eisammy](https://meta.discourse.org/u/eisammy)
#### Post date: [August 4, 2025, 9:32pm UTC](https://meta.discourse.org/t/advanced-search-banner/122939/190 "2025-08-04T21:32:07Z")

</div>

What your site? on mobile this search banner simply disappear maybe some class changed idk.

---

<div class="post-metadata">

### Author: ![awesomerobot](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/awesomerobot/32/142900_2.png) [@awesomerobot](https://meta.discourse.org/u/awesomerobot)
#### Post date: [August 4, 2025, 9:50pm UTC](https://meta.discourse.org/t/advanced-search-banner/122939/191 "2025-08-04T21:50:07Z")

</div>

Looks like a variable’s name was changed and that broke the padding, I’ve just added a fix [FIX: restore padding broken due to missing variable by awesomerobot · Pull Request #100 · discourse/discourse-search-banner · GitHub](https://github.com/discourse/discourse-search-banner/pull/100)

So you should be able to restore the previous spacing by updating the component.

> [@eisammy](#):
>
> on mobile this search banner simply disappear maybe some class changed idk.

Yeah there’s a simpler version of the banner included in Discourse by default now, and there’s some CSS to hide it on mobile… it can be restored with some custom CSS

```css
@use "lib/viewport";

@include viewport.until(sm) {
  .welcome-banner {
    display: block;
  }
}

```

---

<div class="post-metadata">

### Author: ![tknospdr](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/tknospdr/32/529762_2.png) [@tknospdr](https://meta.discourse.org/u/tknospdr)
#### Post date: [August 5, 2025, 3:04pm UTC](https://meta.discourse.org/t/advanced-search-banner/122939/192 "2025-08-05T15:04:24Z")

</div>

Perfect, thanks so much for restoring this component!

---

<div class="post-metadata">

### Author: ![bartv](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/bartv/32/130052_2.png) [@bartv](https://meta.discourse.org/u/bartv)
#### Post date: [August 13, 2025, 7:02am UTC](https://meta.discourse.org/t/advanced-search-banner/122939/193 "2025-08-13T07:02:40Z")

</div>

Does this component track usage data? We’d like to see how effective it actually is for our community.

---

<div class="post-metadata">

### Author: ![NateDhaliwal](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/natedhaliwal/32/313494_2.png) [@NateDhaliwal](https://meta.discourse.org/u/NateDhaliwal)
#### Post date: [August 13, 2025, 7:12am UTC](https://meta.discourse.org/t/advanced-search-banner/122939/194 "2025-08-13T07:12:32Z")

</div>

@bartv No, I don’t believe it does.

---

<div class="post-metadata">

### Author: ![RBoy](https://avatars.discourse-cdn.com/v4/letter/r/2bfe46/32.png) [@RBoy](https://meta.discourse.org/u/RBoy)
#### Post date: [August 24, 2025, 2:59am UTC](https://meta.discourse.org/t/advanced-search-banner/122939/195 "2025-08-24T02:59:34Z")

</div>

It doesn’t seem to have fixed the issue. The search bar in the top site header section just doesn’t appear. I just updated to the latest 3.6.0 Beta1-Dev and problem still exists. The only way I can get back the search bar in the top site header is to disable this component and enable the Discourse Header Search component or enable Search bar in site header for the theme, but the moment I enable this component they all disappear from the site header.

Any idea why this has stopped working? This was one of the nicest components I used, I really miss it’s features.

---

<div class="post-metadata">

### Author: ![RBoy](https://avatars.discourse-cdn.com/v4/letter/r/2bfe46/32.png) [@RBoy](https://meta.discourse.org/u/RBoy)
#### Post date: [August 24, 2025, 10:15pm UTC](https://meta.discourse.org/t/advanced-search-banner/122939/196 "2025-08-24T22:15:47Z")

</div>

> [@Discourse](#):
>
> > We are planning to deprecate support for this theme component soon and advise you to use the **[welcome banner](https://meta.discourse.org/t/creating-a-banner-to-display-at-the-top-of-your-site/153718#p-762961-welcome-banner-1)** feature instead.

I guess that answers my question. After the latest update to the Welcome banner, I just enabled that and it seems to replace the functionality of this component as well as the Discourse Header Search.

The welcome banner is still missing some nice customization this component has like the ability to add a subhead text (extremely helpful as it can prompt users to use the search bar rather than just lie there like an empty box). Hopefully that will make it’s way into the Welcome banner.

On the flip side, is there a way to use the CSS customization feature in discourse to edit the subheading text in the search banner ?

---

<div class="post-metadata">

### Author: ![NateDhaliwal](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/natedhaliwal/32/313494_2.png) [@NateDhaliwal](https://meta.discourse.org/u/NateDhaliwal)
#### Post date: [August 24, 2025, 11:35pm UTC](https://meta.discourse.org/t/advanced-search-banner/122939/197 "2025-08-24T23:35:47Z")

</div>

> [@RBoy](#):
>
> edit the subheading text in the search banner

Are you referring to this Advanced Search Banner component? If so, I believe this setting does this:

> [@Discourse](#):
>
> search\_banner.subhead

---

<div class="post-metadata">

### Author: ![RBoy](https://avatars.discourse-cdn.com/v4/letter/r/2bfe46/32.png) [@RBoy](https://meta.discourse.org/u/RBoy)
#### Post date: [August 25, 2025, 12:30am UTC](https://meta.discourse.org/t/advanced-search-banner/122939/198 "2025-08-25T00:30:16Z")

</div>

No, I’m referring to the text inside the search box that says _Search_

 ![image](https://global.discourse-cdn.com/meta/original/4X/f/8/7/f872694b1e8190d32c81a0ee3176d4f1e138387f.png)

---

<div class="post-metadata">

### Author: ![manuel](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/manuel/32/468169_2.png) [@manuel](https://meta.discourse.org/u/manuel)
#### Post date: [August 25, 2025, 10:53am UTC](https://meta.discourse.org/t/advanced-search-banner/122939/200 "2025-08-25T10:53:40Z")

</div>

You can change the text variable `js.search.title` in /admin/customize/site\_texts.

But as you mentioned in [Creating a banner to display at the top of your site - #23 by RBoy](https://meta.discourse.org/t/creating-a-banner-to-display-at-the-top-of-your-site/153718/23), the more specific variable should be `js.welcome_banner.search`- but it doesn’t seem to work right now.

[Previous page](https://meta.discourse.org/t/advanced-search-banner/122939.md?page=2)

[Next page](https://meta.discourse.org/t/advanced-search-banner/122939.md?page=4)
