FKB Pro - 社交主题

FKB Pro 是一个经过高度修改、细节丰富且专业的社交风格主题,同时保持了良好的用户友好性。:rocket:

:warning: 此主题较为敏感,可能与您使用的其他主题组件或插件兼容性不佳! 请在使用前进行测试。通常需要进行一些 CSS 修改。如果您遇到任何问题,请报告,我会进行修复。


布局

桌面端: 三栏布局。

支持侧边栏


移动端:


圆角

FKB Pro 默认在到处都使用高度圆角,但我知道并非每个人都喜欢这样,所以我添加了一些主题设置,以便更轻松地自定义。

如果您不喜欢圆角……请将此值设置为 0


主题卡片

主要部分

  1. 标题 (点击跳转到最后一帖)
  2. 摘要 (点击跳转到首帖)
  3. 图片 (点击跳转到最后一帖)

其他部分

  1. 左上角:作者数据(头像、姓名、用户名)以及主题创建日期。
    (点击打开用户卡片)
  2. 右上角:分类徽章
  3. 底部居中:标签
  4. 左下角:主题点赞数和浏览量
    (点击跳转到首帖,如果可用则总结主题)
  5. 右下角:最后发帖人头像、日期和回复数。
    (点击头像打开用户卡片,点击日期跳转到最后一帖,点击回复数打开回复选择)

徽章样式

  1. 圆点
    Screenshot 2022-07-28 at 13.20.14

  2. 条形
    Screenshot 2022-07-28 at 13.17.04

  3. 方框
    Screenshot 2022-07-28 at 13.18.34


分类页面

由于中间区域大小有限,请使用单栏分类页面样式。我对这些样式进行了一些自定义,以更好地适配此主题。

仅分类、分类和最新主题、分类和热门主题

分类方框

或者

您可以使用由 @jordan.vidrine 创建的 Modern Category + Group Boxes 主题组件


FKB 面板

桌面端: 右侧边栏。

对于匿名访客,它会显示一条欢迎消息。此消息与 js.signup_cta.value_prop 相同。标题 Welcome 文本您可以在主题翻译中更改。

或者

对于匿名访客,有一个选项可以启用自定义侧边栏。您可以向侧边栏添加自定义内容,例如图片和描述。


对于已登录用户,它包含用户信息,如个人资料图片、统计数据、徽章,并使用用户卡片图片作为背景。底部还包含一些快捷按钮。


配色方案

该主题包含两种配色方案:FKB Pro - 浅色FKB Pro - 深色

配色方案

FKB Pro - 浅色

  • primary #242526
  • secondary #ffffff
  • tertiary #147efb
  • quaternary #147efb
  • header_background #ffffff
  • header_primary #242526
  • highlight #147efb
  • danger #f8745c
  • success #42b72a
  • love #fa6c8d

FKB Pro - 深色

  • primary #ffffff
  • secondary #242526
  • tertiary #147efb
  • quaternary #4267b2
  • header_background #242526
  • header_primary #ffffff
  • highlight #147efb
  • danger #f8745c
  • success #42b72a
  • love #fa6c8d

还有一些自定义配色方案,您可以在设置中更改。

自定义配色方案

fkb-bg

  • light #f0f2f5
  • dark #18191a

fkb-header-btn

  • light #e1e5eb
  • dark #3a3b3e

fkb-header-btn-hover

  • light #d2d8e1
  • dark rgba(var(--primary-rgb),.1)

fkb-btn

  • light #e1e5eb
  • dark #383838

fkb-btn-hover

  • light #d2d8e1
  • dark rgba(var(--primary-rgb),.1)

关于最新更新 :arrow_down_small:

以及这里 :arrow_down_small:

还有许多其他我没有提到的自定义选项。:slightly_smiling_face:


致谢 :heart: 非常感谢 @awesomerobot 创建了 Fakebook 主题,以及 @jordan.vidrine 创建了 Fakebook Modern 主题。

63 个赞

iPad 的屏幕相当……宽。我是说,真的非常宽 :wink:

我猜这是因为没有侧边栏。有什么想法吗?

3 个赞

太棒了!

我唯一的建议是让汉堡菜单更宽一些,然后添加内边距

1 个赞

还有一个小问题:

  • 我的论坛不使用 solved-plugin
  • 我们不使用徽章

你知道如何隐藏这两个更好 :wink:

除此之外……这个主题在桌面和移动设备上看起来都很有前途(平板电脑有点问题)

顺便说一句——versatile banner 有一个小布局问题。它将它下面的内容推得太靠左了。

3 个赞

您好,

我已将一个修复程序推送到平板电脑视图。请更新主题。 :slightly_smiling_face:

6 个赞

速度真快。

好多了,谢谢。我得到了一个新的默认主题……

1 个赞

谢谢 :slightly_smiling_face: 是的,我认为这是默认设置。打开菜单时,第一个项目处于焦点状态。

3 个赞

是的,我只是建议它们之间可以留一点空隙,除此之外,这个主题看起来不错,尽管我讨厌 Facebook 和 Meta 哈哈。

谢谢 :slightly_smiling_face: 我为此推送了一个修复程序。

我添加了两个主题设置。

我会检查一下。

3 个赞

这让我成了痛处 :rofl:

有一个问题。不是对我,而是对我的前五名贡献者来说,这是生死攸关的问题——嗯,也许有点夸张了,但他们真的很想要这个。

类别设置:

通常会显示类似这样的内容(在 iPad 上,但您明白我的意思)

如果类别描述或名称比几个字符长,您的布局就会中断:

禁用 在上面显示子类别列表… 当然可以解决这个问题。

但我最终还是只使用顶级类别,并大量依赖标签(这样的话,您的主题在很多方面都相当合适)——所以,如果修复这个问题需要花费太多时间和/或您有更重要的事情要做,我完全可以接受您以后再处理这个问题。

3 个赞

您好,我为 Discourse Reactions 添加了一个修复程序:slightly_smiling_face:
您可以将其安装为主题组件。

1 个赞

感谢您的报告 @Jagster。我已推送此问题的修复程序。FIX: Topic list category layout by VaperinaDEV · Pull Request #3 · VaperinaDEV/fkb-pro-theme · GitHub

2 个赞

您好,我已经为此推送了一个修复程序。谢谢 :slightly_smiling_face: 请更新主题。

之前

之后

1 个赞

很棒的主题。请添加更多帖子进行测试。

1 个赞

:slightly_smiling_face: 谢谢。我已将 OP 更新为主题创建者预览链接,现在您也可以在 https://discourse.theme-creator.io/theme/dodesz/fkb-pro 上进行尝试。

2 个赞

很棒的主题!如果我能找到一种获得域名和邮件服务器的方法,我一定会使用这个主题。

2 个赞

您好,

我添加了一个新功能 :tada: 现在您可以为访客添加自定义侧边栏内容。

3 个赞

感谢更新此主题。

如果您能将此主题开发成类似博客(忘掉 Facebook 主题 :sweat_smile:)的形式,那就太棒了。

来自 https://www.newsbreak.com/ 的建议

3 个赞

我不同意 :wink:

Blogish 的需求与那些认为 Facebook/Instagram/等是最佳用户体验/用户界面的用户所寻求的社交媒体风格有所不同。

因此——可能存在一个看起来更像博客(无论现在这意味着什么……)的主题。但现在这样就很好。

(WordPress 作为博客平台比 Discourse 优越得多;它们是两种完全不同的工具,用于不同的目的……)

1 个赞

您好,很棒的主题!

我们论坛中的主题预览没有显示为三列,而只显示为一列布局。我怀疑是 CSS 问题,但仍在尝试找出原因。

有两个问题:

  • 在桌面模式下,是否可以在最小屏幕宽度(或使用媒体 CSS 规则等设置几个断点)时拥有固定宽度的列?在非常大的显示器(24 或 27 英寸)上,灵活的宽度让我有点头疼,“三个列之间的空白区域”有点尴尬。
  • 该主题是否与右侧区块的组件兼容 Right Sidebar Blocks - theme-component - Discourse Meta?如果兼容,这将使右侧列更加有用/功能丰富。
2 个赞