我喜欢这个想法！我很乐意审查并合并实现该功能的 PR 
11 个赞
我非常喜欢这个想法 
所以我稍微尝试了一下。我相信有更好的实现方式，但目前在我的网站上运行得相当不错。
我使用了 大标题 - 小标题 组件的 <head> 模板代码来实现这一功能。
不幸的是，在 iPhone 上存在限制，因为底部导航栏会完全遮挡 Discourse 的标签栏。所以我将其隐藏了。
我已更新了此代码！
现在我把代码分享在这里（不确定是否可以合并）：
将此代码放入移动端的 <head> 部分：
<script type="text/discourse-plugin" version="0.8.18">
$(document).ready(function() {
var lastScrollTop = 0;
var body = $("body");
var scrollMax = 30;
$(window).scroll(function() {
var scroll = $(this).scrollTop();
if (lastScrollTop < scroll && scroll > scrollMax && !body.hasClass("tab-bar-hidden")) {
body.addClass("tab-bar-hidden");
} else if (lastScrollTop > scroll && body.hasClass("tab-bar-hidden")) {
body.removeClass("tab-bar-hidden");
}
lastScrollTop = scroll;
});
});
</script>
将此代码放入移动端的 CSS 部分：
html:not(.anon) {
#topic-progress-wrapper,
#reply-control.draft {
bottom: 49px;
}
#reply-control.draft {
margin-bottom: env(safe-area-inset-bottom);
padding-bottom: 0px;
transition: all .1s ease-out;
}
.posts-filtered-notice {
transition: all .1s ease-out;
bottom: 49px;
}
}
body.tab-bar-hidden {
.d-tab-bar {
bottom: -49px;
transition: all .2s ease-in;
}
#topic-progress-wrapper:not(.docked),
#reply-control.draft {
bottom: 0;
transition: all .2s ease-in;
}
#reply-control.draft {
margin-bottom: env(safe-area-inset-bottom);
padding-bottom: 0px;
transition: all .2s ease-in;
}
.posts-filtered-notice {
transition: all .2s ease-in;
bottom: 0;
}
}
.d-tab-bar {
transition: all .1s ease-out;
}
body:not(.footer-nav-ipad) .footer-nav {
display: none;
}
演示
17 个赞
你做的东西真酷！
5 个赞
这是个很实用的小组件，谢谢！
是否有办法让个别用户自定义它，或者完全隐藏它？
5 个赞
这太棒了，@Don，谢谢！我刚把你的代码（做了少量修改）推送到组件中了。
Discourse 原生并没有提供让个别用户自定义或隐藏该组件的选项，但你可以利用 Discourse 核心中的一个变通方法来实现：创建一个不包含该组件的主主题变体，然后让用户可以在“偏好设置” → “界面”中选择该变体。
效果如下所示：
不想使用该组件的用户可以选择“灰琥珀色（不含标签栏）”，其配置与“灰琥珀色”完全相同，只是不包含标签栏组件。
6 个赞
好主意！谢谢！
4 个赞
感谢 @Osama，这太棒了！
我注意到 CSS 中有一个问题。Discourse 标签栏会激活并将回复框向上推。我认为它应该仅在 #reply-control.draft 上激活，而不是整个 #reply-control。
4 个赞
好的，现在应该已经修复了。谢谢你告诉我！
6 个赞
只是想衷心感谢你们，这是对任何 Discourse 站点都极佳的补充。@discoverearth，你成功让它在所有用户面前永久显示了吗？
5 个赞
我正在尝试配置此功能，以便在用户浏览平台时自动点击标签页。在此用例中，我试图设置按钮来打开 Kanban、日历和投票插件的标签页。
Kanban：
如果我在某个分类或子分类中，并在 URL 后添加 ?board=default，它会导航到 Kanban 的标签页（Board），因此这是可行的。问题在于该插件使用的是相对于根目录的路径，而不是用户当前所在的路径。
（我还必须为首页想出一个变通方案，因为那里的 URL 逻辑不同。）
日历：
日历标签页需要在 URL 末尾添加 /l/calendar。
这看起来是可行的，但还需要删除用户当前所在分类/子分类之前的任何 URL 文本。例如，如果用户已导航到 latest 或 kanban，则需要在添加 /l/calendar 到末尾之前先移除 URL 中的那部分。
有人知道如何实现吗？如果能将这些插件与此功能结合使用，那将非常棒。现在标签页选择器在移动设备上基本是隐藏的，这对于重度使用 Kanban 或日历等组件的网站来说并不理想。
1 个赞
此插件是一个不错的作品，但无法与 DiscourseHub（至少在 iPhone 上）一起使用，因为它在同一位置隐藏了导航标签页。这样一来，用户就无法切换论坛。
因此，该插件仅适用于那些以某种方式不支持 DiscourseHub 或严重破坏用户体验（迫使用户在访问论坛后完全关闭应用）的论坛。
当然，懂编程的人可以只在浏览器使用时显示此标签栏……但在同一设备上让用户面对不同的用户界面，确实是个糟糕的主意。
使用此组件：
而在使用纯 DiscourseHub 时：
3 个赞
我很希望通知按钮能像默认版本顶部菜单按钮那样显示红色的未读通知提示，您能给我一些提示吗？我不太擅长编程。
@nildarar，您成功让按钮上显示通知数量了吗？谢谢。
1 个赞
你好！很喜欢这个概念。谢谢。
一个问题：为了与网站其他区域保持一致，我更喜欢使用 FontAwesome 图标的轮廓版本，而不是填充版本。
有什么方法可以指定这一点吗？通常，使用图标的完整名称——例如 far fa-star（而不仅仅是 star）——就能实现这种区分。但每当我尝试输入像这样的完整图标名称时，该组件在相应位置完全不显示任何内容。
有什么方法可以实现这一点吗？
1 个赞
这看起来很酷。有没有办法创建一个选项卡来显示关注的动态？这样用户就可以轻松地看到他们关注的所有人的动态。
另外，是否可以针对特定页面进行设置？
.user-main .about {
margin-bottom: 0;
color: var(--secondary);
display: none;
}
仅用于动态页面？
1 个赞
只是为了确认，您是指 Discourse Follow 的关注动态吗？如果是这样，请在您想要重定向到关注动态的标签设置中，将 feed 设置为路由（第三个部分）。
4 个赞
是的，我是。谢谢！
3 个赞
当然可以。在第三个或第四个选项卡设置中尝试以下内容，以达到中间效果。
New, plus, /new-topic
6 个赞
