高级搜索横幅

问题出在:

conditional-loading-section:not(.is-loading) {
    transition: opacity 5s ease-in-out;
}

您不能使用自定义 CSS 将此设置为 none,因为它会被主题默认的 conditional-loading-section.scss 覆盖。

1 个赞

是否可以将搜索横幅重新定位?

@awesomerobot

例如,将对齐方式从中心更改为右侧,或者仅通过向右轻微移动来调整位置?

1 个赞

不使用主题组件设置,但您可以使用自定义 CSS 轻松实现这一点。

2 个赞

我们用它来定位背景图像而不是文本

但无法重新调整图像与搜索横幅的对齐

非常感谢提供 CSS 代码

2 个赞

使用检查元素可以提供帮助。或者查看此组件的 CSS 源或 Air 主题,因为 CSS 在 common 中的前几行会定位搜索横幅,并使用 mods 进行定位。

未经测试,因为我没有 XP 遇到您提到的问题。

.display-search-banner {
  #main-outlet {
    padding-top: 2em;
    align: center !important;
  }
}

将此代码放入自定义 Theme component CSS common 中。

我能理解大家想提供代码的愿望。我自己还在学习中。但是,我们也需要努力学习基础知识。

您可以使用浏览器的检查元素来测试“align: center !important;”。

3 个赞

这看起来很棒,但是当我在 RTL 布局中使用它时,似乎填充没有正确转换。
LTR:

RTL:


在 RTL 模式下,设置图标和占位符的填充似乎已交换。

2 个赞

感谢告知!我已进行更新,应该可以解决此问题。

5 个赞

在最新的 3.3.1 tests-passed 中,仅在移动设备上,自动完成搜索结果中的类别图标未显示。即使在禁用所有插件的安全模式下,我也能重现此问题。

您可以在我们的主页上尝试:forum.cannabisanbauen.net

3 个赞

这里有一个临时的修复方法,等待官方修复:

.search-menu {
  .search-link {
    .badge-category {
      display: inline-flex;
    }
  }
}

这似乎与此 CSS 相关:

badge category 没有正确的显示方式。

但是,.badge-category 上已经有一个 inline-flex,所以我认为可以安全地移除组件中的 CSS。:thinking:

6 个赞

我添加了这个并设置了我的文本,但它只对登录用户显示,而对未登录用户不显示?我已经将设置设为“两者”:

登录:

未登录:

设置:

1 个赞

如果您编辑 English_US 的翻译会怎样?
我认为当您登录时,会使用您在偏好设置中选择的语言(或网站的默认语言)。当您注销时,文本将以您浏览器的语言偏好显示。因此,所有使用您未自定义语言的用户都将看到默认文本。所以您可能需要自定义更多语言。

4 个赞

太好了,谢谢,奏效了!

1 个赞

谨此通知大家,我们将很快把此功能的一个简化版本合并到核心中 FEATURE: Add welcome banner to core by martin-brennan · Pull Request #31516 · discourse/discourse · GitHub

此组件仍受支持,但从此 PR 开始,它已被重命名为 Advanced Search Banner DEV: Update theme name to Advanced Search Banner by martin-brennan · Pull Request #84 · discourse/discourse-search-banner · GitHub 。如果安装了此组件,则不会显示核心的欢迎横幅。

5 个赞

大家好。我已将此组件添加到我的网站。它显示了标题文本,但没有显示实际的搜索栏。有人知道是否有人遇到这个问题吗?

1 个赞

你是在使用窄屏幕还是移动设备?目前似乎在这种情况下搜索栏无法显示的问题存在

我在 iPhone 上的 Chrome 浏览器中查看我的社区页面。

嗯。你觉得我们可以提醒谁注意这个问题,还是构建它的人已经知道了?(我是 Discourse 新手,正在学习)。

1 个赞

没错,我就是那个人!我刚刚修复了它——如果你更新主题组件,搜索框现在应该会出现。

4 个赞

此组件在 Mint 主题中不显示。但我尝试过,它可以在其他主题中显示。

大家好!本周我将合并一项更改,该更改可能会影响您添加到此主题组件的自定义样式。

由于此搜索横幅可以显示在多个页面上,因此 H1 标签不适合用作标题,H1 应该有助于区分一个页面的内容与其他页面。因此,此更改会将 H1 替换为带有 custom-search-banner-headline 类的 DIV。

因此,如果您在主题中为 H1 应用了样式,您将需要将 H1 更改为 .custom-search-banner-headline — 在某些主题中,我已将该类添加到 H1 中,以使过渡无缝,例如:

5 个赞

最新版本似乎存在一个 bug。

正在运行 discourse 3.5.0.beta8-dev (679d51a985)

发生的情况是,当打开新主题时(在 Windows 10 上的 Chrome 浏览器中),顶行应该有搜索栏,但它不见了。如果我禁用主题组件,默认的 discourse 搜索栏会显示出来,但如果启用了该组件,顶部的搜索栏就会消失,并且右上角的搜索图标也会消失。如果我向下滚动一行,搜索按钮会出现在右上角,但搜索栏从未出现在主题的顶行。

配置为在 top_menuPlugin outletabove_main_container 显示。我很确定以前即使是主题,它也会显示在顶行。

问题是,在用户滚动之前,没有办法搜索,因为搜索图标和搜索栏都消失了。如果我禁用主题,默认的搜索栏和图标会正常显示,即页面加载时,搜索栏会显示出来,当用户向下滚动一行时,搜索栏会消失,取而代之的是搜索图标。

1 个赞