the issue is with :
conditional-loading-section:not(.is-loading) {
transition: opacity 5s ease-in-out;
}
You can’t use the custom CSS to set this to none this is getting overwritten by the theme default conditional-loading-section.scss
1 Like
Is there a possibility to reposition the search banner?
For example to change the alignment from center to the right or just adjust the position by moving it slightly to the right?
1 Like
Not using Theme component settings, but that’s something you can easily achieve using your own custom CSS.
2 Likes
We are using it to position the background image instead of text
but unable to readjust the image with the search banner
would highly appreciate providing the CSS code
2 Likes
Using inspect element can help. Or even looking at this component’s CSS source or the Air Theme as the first part of the CSS under common first few lines target the search banner with mods targetting it.
Untested as an not XP the issue you mention.
.display-search-banner {
#main-outlet {
padding-top: 2em;
align: center !important;
}
Put this code in a custom theme-component CSS common.
I can appreciate the desire for ppl to provide how to code. As I am still learning myself. However we need to also work on educating ourselves with the basics.
You can possibly test the “align: center !important;” using your browser’s inspect element.
3 Likes
this looks great, however when using it in the RTL layout it seems that the padding doesn’t translate correctly.
LTR:
RTL:
it seems that the padding for the settings icon and the place holder are switched in RTL mode.
2 Likes
Thanks for letting us know! I’ve just made an update that should fix it.
5 Likes
On latests 3.3.1 tests-passed, only on mobile category icons on autocomplete search results are not displayed. I can reproduce the issue even in safe mode with all plugins disabled.
You can try here on our home page: forum.cannabisanbauen.net
3 Likes
Here’s a quick fix in waiting for an official fix:
.search-menu {
.search-link {
.badge-category {
display: inline-flex;
}
}
}
It seems related to this CSS:
The badge category doesn’t have the proper display.
However, there is already an inline-flex on .badge-category, so I think it’s safe to remove the CSS in the component. 
6 Likes
I’ve added this and set my text, but it only appears for logged in users, not logged out users? I have the settings set to Both:
Logged In:
Logged out:
Settings:
1 Like
What happens if you edit the English_US translation too?
I think when you are logged in, the language you chose in your preferences (or the site’s default locale) is used. When you are logged out, the text is shown in the language preference of your browser. So all users using a language you didn’t customize will see the default text. So maybe you want to customize even more languages.
4 Likes
Oh perfect, thank you that worked!
1 Like
FYI all, we are imminently merging a simplified version of this into core FEATURE: Add welcome banner to core by martin-brennan · Pull Request #31516 · discourse/discourse · GitHub .
This component is still supported, but it has been renamed to Advanced Search Banner from this PR onward DEV: Update theme name to Advanced Search Banner by martin-brennan · Pull Request #84 · discourse/discourse-search-banner · GitHub . If this component is installed, the core welcome banner will not be displayed.
5 Likes
Hi gang. I’ve added this component to my site. It shows the title text, but it’s not showing the actual search bar. Any idea if others are having this issue?
1 Like
Are you using a narrow screen or a mobile device? it appears there’s currently an issue with the search bar not appearing in these cases
I’m looking at my community page on my iphone (in a chrome browser).
Hmmm. Anyone you think we can alert about this or is the individual who built it already aware? (I’m new to Discourse and am learning).
1 Like
Yep, I’m the person! I just added a fix for it — if you update the theme component the search box should appear now.
4 Likes
This component doesn’t display in the Mint Theme. But i tried and it can be displayed in other themes.
Hi everybody! this week I’ll be merging a change that may impact custom styles you have added to this theme component.
Since this search banner can appear on multiple pages, an H1 for the headline is not ideal, a H1 should help distinguish one page’s content from another. So the change replaces the H1 with a DIV with the class custom-search-banner-headline.
So if you’ve applied styles to the H1 in a theme, you’ll want to change the H1 to .custom-search-banner-headline — in some themes I’ve added the class in addition to the H1 to make the transition seamless, for example:
5 Likes
There appears to be a bug with the latest version.
Running discourse 3.5.0.beta8-dev (679d51a985)
What’s happening is that when a new topic is opened (Chrome browser on Windows 10), the top row is supposed to have the search bar but it’s missing. If I disable the theme component the default discourse search bar shows up but if the component is enabled, the top search bar is missing AND also the search icon on the top right is missing. If I scroll down one line then the search button shows up on the top right but the search bar never shows up on the top line of a topic.
Configured for Showon top_menu and Plugin outlet on above_main_container. Pretty sure it used to show up on the top row earlier even for topics.
The problem is that until the user scrolls there’s no way to search since both the search icon and search bar are missing. If I disable the theme then the default search bar and icon show up just fine i.e. when the page loads, the search bar shows up and when the user scrolls down one line the search bar disappears and the instead the search icon shows up.
1 Like