新话题标题按钮

Discourse · 2018 年4 月 4 日 09:43


	摘要	New Topic Header Button 在所有页面的标题栏中添加了一个便捷的“新建主题”按钮
	预览	在 Discourse Theme Creator 上预览
	仓库	https://github.com/discourse/discourse-new-topic-button-theme-component
	安装指南	如何安装主题或主题组件
	Discourse 主题新手？	Discourse 主题使用入门指南

安装此主题组件

功能

一个简单的主题组件，用于在标题栏中添加 + 新建主题 按钮。该按钮将显示在每一页面上——即使在主题内部也会显示。

截图：

桌面端：

移动端：

设置：

名称	描述
new topic button icon	为按钮选择一个图标。您可以使用任何免费的 FontAwesome 6 图标名称，例如 `music` 或 `star`。
new topic button text	输入您希望按钮显示的文本。如果您只想使用图标，也可以将此留空。
new topic button title	输入您希望按钮使用的标题。如果留空，标题将与按钮文本相同。
hide default button	隐藏主题列表中的默认“新建主题”按钮。
show to anon	向未登录的访客显示该按钮，点击后将其重定向至登录页面。

由我们托管？ 主题组件可在我们的标准版、商业版和企业版计划中使用。

charleswalter · 2018 年11 月 3 日 17:09

Pretty awesome. Now we’re talking!

FYI, we pushed the button yesterday and it was our 2nd biggest day in registrations for the past 30 days. Not sure if it was coincidence or not, but I have a feeling it’s a good way to onboard new users. Will keep an eye on the metrics

(Realizing now it must have been a coincidence, because the button only appears for users who have already logged in. Nonetheless, activity does seem to be higher)

ElForoViajero · 2019 年2 月 5 日 18:50

Hi,

Is it possible to change the color of the button, but not change the color of all buttons in the site?

If so, which is the css code for the button only?

thanks!

dax · 2019 年2 月 5 日 18:55

Use this code, changing the color obviously.

#new-create-topic {
    background-color: red;
}

tophee · 2019 年2 月 5 日 20:43

Hm, how about showing the new topic button for everyone and make it act like the default Reply-to-topic button, i.e. as the user to login/sign up if they’re not logged in?

In fact, this might be something to consider for the default new topic button too, but I guess this feature would be most effective in this theme component…

codinghorror · 2019 年2 月 5 日 22:25

Inviting every random visitor to create a new topic… will end in tears

Nothing kills a site quicker than a page full of low-value or gibberish topics.

tophee · 2019 年2 月 5 日 23:21

Well, they can’t create that topic unless they sign up. And encouraging people to sign up is obviously a good thing (and is being done by default via the sign-up button and the reply-to-topic button). So I don’t really see why the new topic button should cause any problems.

ElForoViajero · 2019 年2 月 6 日 16:18

Is it possible to hide the button on mobile but show the floating button?

dax · 2019 年2 月 6 日 17:07

To hide the button on mobile add

.header-buttons #new-create-topic {
    display:none;
}

in your mobile > CSS tab

The floating button you are referring is the one used on the Material Design Theme component? If so you need to copy and paste the part of CSS relative to the floating button (New Topic Fab) from material-design-stock-theme/desktop/desktop.scss at main · discourse/material-design-stock-theme · GitHub to your mobile > CSS tab (deleting the lines that start with @include [...]).

However your requests are going off topic, it’s better if you open another topic.

ElForoViajero · 2019 年2 月 10 日 18:29

Thanks, sorry for the offtopicing

rogerco · 2020 年1 月 3 日 17:28

这很好，但从我的角度来看有两个缺点。
首先是按钮在顶部栏的位置。顶部栏已经添加了其他内容，这使得它显得有些拥挤。
其次是它出现在每一个页面上，即使在一些不太合理的地方（例如在我的个人资料页面或群组列表页面）。
从我的角度来看，主要的使用场景是让用户在查看帖子时更容易避免发布离题的回复。我认为它真正需要且有用的地方是在查看主题/帖子时，理想情况下，我希望它既出现在顶部（与主题标题对齐），也出现在底部，靠近主要的蓝色“回复”按钮。
一个折中的方案是：在当前显示位置的基础上，仅在 /t/xxx 页面显示。
这是否可行？

Eduardo_Braga · 2020 年1 月 31 日 17:42

我不想在移动设备上显示它，该如何操作？

我还希望向未注册用户显示它，点击按钮后会提示您登录

pfaffman · 2020 年1 月 31 日 17:57

哦，真糟糕。我不知道“位置错误”是什么意思（在我的测试网站上看起来没问题），但我原本以为按钮会起作用，现在发现它不起作用。看来事情不像我想象的那么简单。

dax · 2020 年1 月 31 日 19:04

创建一个新的主题组件，并在 Mobile > CSS 选项卡中添加以下内容：

.mobile-view #new-create-topic {
    display:none
}

eextra · 2020 年2 月 20 日 23:13

好主意——你做到了吗？

jord8on · 2020 年4 月 9 日 04:40

有人能告诉我应该针对哪些 CSS 样式，才能让这个“+ 新主题”按钮的外观和功能与我网站上的彩色“回复”按钮完全一致吗？（即默认状态，以及悬停和点击激活状态）

以下是我想要的效果的视觉说明…

rogerco · 2020 年4 月 30 日 17:18

将其类名改为 btn-primary 吗？
（不确定页面上是否可以同时存在两个 btn-primary 元素）
如果你想要一个纯 CSS 的解决方案，请检查蓝色主按钮（包括其所有状态）的样式，并复制该样式。

irek · 2021 年4 月 15 日 11:07

感谢 @Joe 提供的此组件。
它运行完美，只有一个小小的例外
在移动设备上，我仍然看到两个按钮：新的 <kbd>+ </kbd> 按钮和默认的 <kbd>+ New Topic</kbd> 按钮。

我通过修改以下样式定义使默认按钮消失：

现在它在桌面端和移动端都能正常工作，但如果您的组件能自动处理这个问题就更好了。特别是如果由于某种原因管理员禁用了您的组件，任何 <kbd>+ New Topic</kbd> 按钮都将不可见。

irek · 2021 年4 月 21 日 14:17

@Johani 我提交了一个包含上述更改的拉取请求。

能否请您查看一下？

manuel · 2021 年6 月 26 日 11:29

感谢提供这个组件！我认为确实存在一些很好的使用场景，即始终在标题栏中保留“创建新主题”的选项。不过，我在实现的一个细节上遇到了困难，想看看其他人是如何处理的：

目前，该组件会反映用户当前所在的分类，并在打开编辑器时自动预填该分类。但它并未反映用户是否对该特定分类拥有写入权限。因此，编辑器会预填该分类（尽管用户无法手动选择该分类），并在尝试保存主题时导致错误。

默认的“新建主题”按钮通过在这些分类上禁用按钮来解决这个问题。但我觉得直接照搬这种行为可能也不太直观，因为在标题栏放置按钮的初衷是提供全局创建新主题的入口。如果该按钮有时无法使用，会显得很奇怪。

对于这种情况，有什么通用的好方法吗？或者，其他使用该组件的人是如何处理的？是否应该完全放弃预填功能？

话题		回复	浏览量
Customize new topic button text Theme component official , topic-button-text	29	3652	2026 年4 月 9 日
Create a new topic button with category and topic template Administrators how-to	13	8216	2021 年9 月 3 日
Discourse Button Styles Theme component	40	10721	2025 年9 月 18 日
A reddit-ish theme for Discourse Theme	113	14796	2026 年4 月 10 日
Make "New Topic" button more prominent UX	9	1798	2021 年7 月 23 日

新话题标题按钮

功能

截图：

设置：

相关话题