# 高级搜索横幅

**URL:** <https://meta.discourse.org/t/advanced-search-banner/122939>\
**Category:** Theme component\
**Tags:** official, deprecated, search-banner, advanced-search-banner\
**Created:** [2019年七月15日 03:49 UTC](https://meta.discourse.org/t/advanced-search-banner/122939 "2019-07-15T03:49:07Z")\
**Posts on this page:** 16\
**Page:** 4

<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:** [2025年八月25日 21:58 UTC](https://meta.discourse.org/t/advanced-search-banner/122939/201 "2025-08-25T21:58:42Z")

</div>

现在已修复此问题，更新您的网站后 `js.welcome_banner.search` 将可以正常工作。

---

<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:** [2025年八月26日 04:13 UTC](https://meta.discourse.org/t/advanced-search-banner/122939/202 "2025-08-26T04:13:26Z")

</div>

欢迎横幅已修复。现在应该使用该横幅，看起来这个主题组件不再需要了。

---

<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:** [2025年十月1日 18:45 UTC](https://meta.discourse.org/t/advanced-search-banner/122939/203 "2025-10-01T18:45:46Z")

</div>

我的高级搜索横幅（好看）：

 ![ad-se-ba](https://global.discourse-cdn.com/meta/original/4X/0/1/1/01148b252746efd1b0d557218c1c94ca5856f5f5.jpeg)

内置的欢迎横幅（难看）：

 ![wel-ban](https://global.discourse-cdn.com/meta/original/4X/7/4/1/74114d406b5f341969e11fd7412eae7e43c03c13.jpeg)

不确定为什么像这样的方便组件，所有设置都在一个地方，却被弃用，转而使用这个横幅，你必须去不同的地方才能更改所有设置。

然后弄清楚如何（我猜）更改 CSS 以恢复漂亮的圆角和合适的文本大小。我在这方面很糟糕……

所以有人知道需要创建什么才能让下面的图片看起来像上面的图片吗？

---

<div class="post-metadata">

**Author:** ![carbonrich](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/carbonrich/32/274219_2.png) [@carbonrich](https://meta.discourse.org/u/carbonrich)\
**Post date:** [2025年十一月11日 11:55 UTC](https://meta.discourse.org/t/advanced-search-banner/122939/204 "2025-11-11T11:55:58Z")

</div>

是的，您需要调整容器的 border-radius 以及标题和文本的大小。

您是如何使用内置的欢迎横幅添加额外文本的？

---

<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:** [2025年十一月12日 18:56 UTC](https://meta.discourse.org/t/advanced-search-banner/122939/206 "2025-11-12T18:56:16Z")

</div>

> [@carbonrich](#):
>
> 是的，您需要调整容器的 border-radius 以及标题和文本的大小。

是的，我终于找到了……

```plaintext
// This fixes the built in welcome banner
.--with-bg-img .welcome-banner__wrap {
  border-radius: 20px;
}
.welcome-banner__title {
  font-size: var(--font-up-4);
  max-width: 900px;
}
.welcome-banner__subheader {
  font-size: 17px;
}

.sidebar-section-link .sidebar-row {
  display: none;
}

```

> [@](#):
>
> 您是如何使用内置的欢迎横幅添加额外文本的？

你是说副标题吗？  
我按照此页面上的第 2 步操作：

> [@Creating a banner to display at the top of your site](https://meta.discourse.org/t/creating-a-banner-to-display-at-the-top-of-your-site/153718):
>
> bookmark This guide explains different methods to create and customize banners on your Discourse site, from simple dismissible banners to more advanced options. person_raising_hand Required user level: Moderator (Dismissible banner), Administrator Banners are an effective way to communicate important information to your site visitors. This guide will walk you through various methods to create and customize banners on your Discourse site. Welcome banner A welcome banner greets new and r…

---

<div class="post-metadata">

**Author:** ![yuriy](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/yuriy/32/498097_2.png) [@yuriy](https://meta.discourse.org/u/yuriy)\
**Post date:** [2025年十一月13日 12:18 UTC](https://meta.discourse.org/t/advanced-search-banner/122939/207 "2025-11-13T12:18:47Z")

</div>

> [@tknospdr](#):
>
> 不确定为什么这样一个方便的组件，所有设置都在一个地方，却被弃用了

迁移的主要原因之一是切换到基于主题的界面，这允许更精细化的自定义。

基本上，只有一个控制是否显示或隐藏欢迎横幅的设置被移到了每个主题设置中。所有其他设置都组织在一个名为 `Admin > Appearance > Interface & layout` 的部分中。

> [@tknospdr](#):
>
> 那么有人知道需要创建什么才能让下面的图片看起来像上面的图片吗？

看起来这张图片的尺寸比欢迎横幅的高度要大，所以它是垂直居中的。如果调整 CSS 有挑战，另一种选择是上传一张裁剪高度适合欢迎横幅的图片。

> [@carbonrich](#):
>
> 您是如何使用内置的欢迎横幅添加额外文本的？

如果您指的是标题下方的文本 _“Please sign up for…”_，可以在 `Admin > Appearance > Site texts` 中编辑，搜索 `js.welcome_banner.subheader`：

 ![js.welcome_banner.subheader](https://global.discourse-cdn.com/meta/original/4X/1/5/f/15f9c8ed13df2a43713fdbc5fc6154034b5fffaa.png)

---

<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:** [2025年十一月19日 17:00 UTC](https://meta.discourse.org/t/advanced-search-banner/122939/208 "2025-11-19T17:00:12Z")

</div>

> [@tknospdr](#):
>
> 我不确定为什么像这样一个所有设置都在一处的地方的便捷组件被弃用，转而采用这个横幅，您必须到不同的地方去更改所有设置。

我们听到了！这种页面跳转是我们希望在整个管理体验中得到改善的方面之一。

为了改善这种情况，我们刚刚合并了一个新的管理页面，该页面将在 Discourse 更新中很快提供——它添加了一个新页面，将现有的“欢迎横幅”设置集中在一起。您可以直接访问 /admin/config/welcome-banner，或通过管理导航“外观”部分下的“欢迎横幅”链接访问它。

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

---

<div class="post-metadata">

**Author:** ![Neil\_Evans](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/neil_evans/32/511055_2.png) [@Neil\_Evans](https://meta.discourse.org/u/Neil_Evans)\
**Post date:** [2025年十二月23日 11:09 UTC](https://meta.discourse.org/t/advanced-search-banner/122939/209 "2025-12-23T11:09:14Z")

</div>

“高级搜索横幅”允许我输入 HTML 文本（例如嵌入链接）。这在新的“欢迎横幅”中似乎也有效（我正在编辑 **登录会员的副标题** ）——但当我返回管理页面时，HTML 已被移除——因此无法再次编辑。是否可以添加对设置/编辑 HTML 的支持——或者我应该以不同的方式进行操作？

---

<div class="post-metadata">

**Author:** ![dax](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/dax/32/244677_2.png) [@dax](https://meta.discourse.org/u/dax)\
**Post date:** [2025年十二月23日 12:46 UTC](https://meta.discourse.org/t/advanced-search-banner/122939/210 "2025-12-23T12:46:59Z")

</div>

通常，只支持某些 HTML 标签；出于安全原因，所有其他标签都会被移除。在某些文本中也不允许使用 HTML。

您的使用场景是什么？您想在横幅中添加什么内容？

---

<div class="post-metadata">

**Author:** ![Neil\_Evans](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/neil_evans/32/511055_2.png) [@Neil\_Evans](https://meta.discourse.org/u/Neil_Evans)\
**Post date:** [2025年十二月23日 13:14 UTC](https://meta.discourse.org/t/advanced-search-banner/122939/211 "2025-12-23T13:14:10Z")

</div>

我想添加一个指向我们支持页面的链接——因为我们的论坛仅供讨论使用。我在旧横幅中使用了以下格式来实现此目的：  
请在发帖前搜索您的话题。如需技术帮助，请使用 [我们的支持](https://www.oursupportsite.com/)

我只是觉得很奇怪，因为 HTML 在新的欢迎横幅中确实显示得很好——只是之后无法在管理界面中编辑，因为文本框内容会丢失。

---

<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:** [2026年一月5日 21:40 UTC](https://meta.discourse.org/t/advanced-search-banner/122939/212 "2026-01-05T21:40:07Z")

</div>

啊哈！感谢您的报告——该 URL 与错误实际上没有关系……问题在于文本的长度。我们查找表单文本的方式在某个点会被截断……所以它被遗漏了。我正在对该页面进行一些其他更新，这将解决这个问题。

---

<div class="post-metadata">

**Author:** ![Neil\_Evans](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/neil_evans/32/511055_2.png) [@Neil\_Evans](https://meta.discourse.org/u/Neil_Evans)\
**Post date:** [2026年一月6日 13:26 UTC](https://meta.discourse.org/t/advanced-search-banner/122939/213 "2026-01-06T13:26:32Z")

</div>

好消息——感谢您对此事的调查。请在更新后告知我，我将使用我的本地系统重新测试。

---

<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:** [2026年一月6日 18:48 UTC](https://meta.discourse.org/t/advanced-search-banner/122939/214 "2026-01-06T18:48:47Z")

</div>

这是 Discourse 的一部分，所以您将在下次更新时获得修复。

---

<div class="post-metadata">

**Author:** ![Neil\_Evans](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/neil_evans/32/511055_2.png) [@Neil\_Evans](https://meta.discourse.org/u/Neil_Evans)\
**Post date:** [2026年一月7日 18:36 UTC](https://meta.discourse.org/t/advanced-search-banner/122939/216 "2026-01-07T18:36:17Z")

</div>

这现在运行得很棒——谢谢！！

---

<div class="post-metadata">

**Author:** ![Overgrow](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/overgrow/32/478189_2.png) [@Overgrow](https://meta.discourse.org/u/Overgrow)\
**Post date:** [2026年六月25日 12:29 UTC](https://meta.discourse.org/t/advanced-search-banner/122939/217 "2026-06-25T12:29:14Z")

</div>

> [@Discourse](#):
>
> 此主题组件已弃用，不应再使用。

我赞同这样的观点：这则横幅是整套组件中最实用的。令人遗憾的是它已被弃用。目前它没有直接的替代方案（即同时包含搜索框和按钮的组合）。

---

<div class="post-metadata">

**Author:** ![Moin](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/moin/32/554653_2.png) [@Moin](https://meta.discourse.org/u/Moin)\
**Post date:** [2026年六月30日 19:57 UTC](https://meta.discourse.org/t/advanced-search-banner/122939/218 "2026-06-30T19:57:59Z")

</div>

> [@Overgrow](#):
>
> 目前它没有直接的等效替代品（即搜索框和按钮的组合）。

我不确定你指的是哪些按钮，但一般来说，搜索横幅的替代品是欢迎横幅。

我脑海中浮现的“按钮”是 @Arkshine 的 [https://meta.discourse.org/t/banner-featured-links/327497。该组件还支持在欢迎横幅下方的出口处显示按钮：](https://meta.discourse.org/t/banner-featured-links/327497%E3%80%82%E8%AF%A5%E7%BB%84%E4%BB%B6%E8%BF%98%E6%94%AF%E6%8C%81%E5%9C%A8%E6%AC%A2%E8%BF%8E%E6%A8%AA%E5%B9%85%E4%B8%8B%E6%96%B9%E7%9A%84%E5%87%BA%E5%8F%A3%E5%A4%84%E6%98%BE%E7%A4%BA%E6%8C%89%E9%92%AE%EF%BC%9A)

> [@Arkshine](#):
>
> ![chrome_EWCjlxQ02A](https://global.discourse-cdn.com/meta/original/4X/9/3/8/938643b035803041b73060df1654b5d0c697a490.jpeg)

[上一頁](https://meta.discourse.org/t/advanced-search-banner/122939.md?page=3)
