 |
摘要 | 标题子菜单 允许您使用纯文本构建带有子菜单的标题菜单！ |
 |
预览 | 在 Discourse 主题创建器中预览 |
 |
仓库链接 | https://github.com/discourse/discourse-header-submenus |
 |
Discourse 主题新手？ | Discourse 主题使用入门指南 |
安装此主题组件
功能
桌面端
移动端
设置
| 名称 | 描述 |
|---|---|
| 菜单项 | 添加菜单项。每行一个项目，顺序为：文本、图标、标题、视图。 |
| 子菜单项 | 添加子菜单项。每行一个项目，顺序为：父级、文本、图标、URL、目标、标题。 |
| Svg 图标 | 包含上述列表中使用的每个图标的 FontAwesome 图标类。 |
| 固定模式 | 强制菜单在屏幕顶部可见，不受滚动位置影响 - 仅限桌面端 |
| 显示箭头 | 在菜单项旁边显示箭头图标 |
| 反转位置 | 在屏幕的另一侧显示菜单项 |
| 菜单背景 | 菜单的背景颜色。（十六进制、rgb、rgba 或 CSS 颜色名称） |
| 菜单项颜色 | 菜单项的颜色。（十六进制、rgb、rgba 或 CSS 颜色名称） |
| 菜单项激活背景 | 菜单项激活时的背景颜色。（十六进制、rgb、rgba 或 CSS 颜色名称） |
| 菜单项激活颜色 | 菜单项激活时的颜色。（十六进制、rgb、rgba 或 CSS 颜色名称） |
| 子菜单背景 | 子菜单的背景颜色。（十六进制、rgb、rgba 或 CSS 颜色名称） |
| 子菜单项颜色 | 子菜单项的颜色。（十六进制、rgb、rgba 或 CSS 颜色名称） |
| 子菜单项悬停背景 | 子菜单项悬停时的背景颜色。（十六进制、rgb、rgba 或 CSS 颜色名称） |
| 子菜单项悬停颜色 | 子菜单项悬停时的颜色。（十六进制、rgb、rgba 或 CSS 颜色名称） |
| 分隔线颜色 | 子菜单中分隔线的颜色。（十六进制、rgb、rgba 或 CSS 颜色名称） |
共有四组设置
-
菜单项
输入您希望在菜单中显示的项目。每行一个逗号分隔的项目，顺序如下：
文本，图标，标题，视图文本：菜单上显示的内容。
图标：显示在项目旁边的图标。如果您不想使用图标，请使用none。
标题：鼠标悬停时显示的文字。
视图：选择项目显示的设备。vdm同时显示在桌面端和移动端
vdo仅显示在桌面端，
vmo仅显示在移动端。由于空间有限，不建议在移动端添加超过 3-4 个项目。
-
子菜单项
输入您希望添加到菜单中的子菜单项列表。每行一个逗号分隔的项目，顺序如下：
父级，文本，图标，URL，目标，标题父级：该子菜单项应显示在其下的父菜单项名称。使用上述列表中的
文本值。
文本：该子菜单项显示的文字。
图标：该子菜单项的图标，如果不需要图标，请使用none。
URL：该菜单项链接到的路径。您也可以使用相对路径。
目标：选择该项目是在新标签页还是当前标签页中打开。使用blank在新标签页中打开链接，或使用self在当前标签页中打开。
标题：鼠标悬停时显示的文字。
分隔符：您还可以在子菜单项之间添加分隔符。要添加分隔符，请使用父级，divider。
下面是一个快速示例，涵盖上述第 1 点和第 2 点：
假设我想添加一个名为 设计 的菜单项，并向其子菜单添加一些项目，如下所示：
我首先将其作为 menu_item 输入：
设计，magic，获得灵感！, vdm
然后将这些作为 sub_menu 项输入：
设计，画廊，th，#，blank，供您欣赏的精彩画廊。
设计，设计流程，lightbulb-o，#，blank，学习基础知识。
设计，博客设计，columns，#，blank，什么构成了优秀博客？
设计，divider
设计，免费资源，gift，#，blank，大家都喜欢免费资源！
设计，Photoshop 教程，book，#，blank，初学者的 Photoshop。
设计，设计趋势，bar-chart，#，blank，紧跟当前趋势！
就是这样！
该主题默认附带一个占位符菜单，您可以查看它，如有问题请随时提问。
-
布局选项。
这些选项非常直观
-
颜色选项
这些选项默认为空，但如果您在此处添加颜色，它将覆盖组件的默认值，这些默认值基于当前的配色方案。
由我们托管？ 主题组件可在我们的标准版、商业版和企业版计划中使用。