
此主题组件已弃用,不再建议使用。其功能现已集成到 Discourse Core 中 —— 请参阅我们的文档,了解如何设置欢迎横幅:
→ Creating a banner to display at the top of your site
功能
默认情况下,此横幅出现在所有顶级话题页面上(最新/新/未读/热门/分类……即 顶部菜单 站点设置中的任何内容),但也可以设置为仅在社区的首页显示。
设置
| 名称 |
描述 |
| 显示位置 |
决定横幅出现在哪些页面上 |
| 插件出口 |
横幅在页面上的显示位置 |
| 浅色背景图片 |
浅色配色方案下横幅的背景图片 |
| 深色背景图片 |
深色配色方案下横幅的背景图片 |
| 平铺背景图片 |
重复背景图片 |
| 显示给谁 |
谁可以看到搜索横幅(已登录、未登录或两者皆可) |
| 特殊样式 |
可选的变体,用于更改搜索横幅的外观 |
| 翻译 |
默认值 |
| search_banner.headline |
欢迎来到我们的社区 |
| search_banner.subhead |
很高兴您来到这里。如果需要帮助,请在发帖前进行搜索。 |
| search_banner.search_button_text |
|
若要省略某一项不显示,请将字段留空。
自定义样式
HTML 元素在此横幅出现的任何位置都会获得名为 .display-search-banner 的类,而横幅本身被包裹在 .custom-search-banner 类中,因此通过一些 CSS,您应该能够根据需要自定义此横幅的外观。
未来增强
致谢
此组件大量借鉴了 @angus 的 Pavilion Header Search Theme Component
由我们托管? 主题组件在我们的 Standard、Business 和 Enterprise 计划中均可使用。
83 个赞
我已更新主题组件以添加一些新设置:
show on — 此选项决定横幅显示的位置,可选值包括:
top_menu(最新/分类/热门/新消息/未读)
homepage
all(除默认搜索页面和管理页面外的所有页面)
show for — 此选项决定谁可以看到横幅:
everyone
logged_in
logged_out
17 个赞
我刚刚做了一个小更新,为该组件添加了一个可选样式,它提供了一个没有标题的大型搜索栏:
可以通过新的“特殊样式”设置启用此功能。这只会启用一些额外的 CSS。
我将来也可能会在此处添加更多选项!
8 个赞
没有该设置。但是,您可以使用一些 CSS 添加它:
将以下内容添加到您的主题或新的主题组件中,并根据需要进行更改。 
.search-banner > .custom-search-banner {
/* title */
h1 {
color: #286989;
}
/* description */
p {
color: #286989
}
}
3 个赞
RBoy
(RBoy)
123
是否有办法隐藏搜索图标(使用 CSS 或其他方式)?我遇到了一个问题,即在与此组件结合使用时,搜索图标会出现重复:Advanced Header Search - #56 by RBoy
1 个赞
isaac
(Isaac Janzen)
124
.search-input .search-icon:first-child {
display: none;
}
应该只显示一个搜索图标。不过,我要说的是,同时使用搜索横幅和标题搜索会带来一些糟糕的用户体验副作用。
我建议只使用其中一个。
4 个赞
有人能帮帮我吗?我在 Discourse 上安装了这个主题,但图片右侧被裁剪了一部分,要让图片完全显示,我必须将站点的字体设置为“较小”。我有两个不同的 Discourse 安装,其中一个图片正常显示,另一个图片为什么被裁剪了?
2 个赞
ecki
(Bernd)
132
我在不同的浏览器/模式下显示图像的不同部分遇到了同样的问题。我通过将其做得非常宽来解决这个问题,这样右侧只在某些情况下显示。但对于对称图像来说,这并不容易。我猜想一些 CSS(无需搜索 thome-component-overwrite)会有帮助。
我设法解决了一部分问题,我禁用了其他主题中的主题组件,只保留了一个,令人难以置信的是,图像的字体大小为“正常”,只是因为手机的图像只显示了一侧,有什么办法可以让它在我的手机上完全显示吗?
您可以使用此 CSS 在新的主题组件中:
.custom-search-banner-wrap {
margin-top: 0;
}
3 个赞
PT_LB
(Paul)
154
Discourse 似乎也有我社区遇到的同样问题,覆盖层需要一些时间才能覆盖搜索底层(Discover)下的内容:

在我社区这个问题更明显:

不知道有没有人遇到过解决方法,可能需要延迟显示覆盖层?这可能会导致糟糕的用户体验。
1 个赞