跳至主要内容

在文章中创建工具切换器

您可以使用工具切换器来展示如何使用特定工具完成任务。

关于工具切换器

在某些文章中,我们编写了针对不同工具(GitHub UI、GitHub CLI、GitHub Desktop、cURL、Codespaces、VS Code、GraphQL API 等)的内容。工具切换器允许用户选择一个工具,以便仅查看与该工具相关的內容,因为不同的工具可能具有不同的概念或过程信息。

Screenshot of tool switchers in an article. The tool switchers are indicated with a dark orange outline.

在阅读文档时,用户可以通过两种方式使用工具切换器。

  • 探索 - 对于可以使用不同工具完成的任务,工具切换器会向用户表明,任务可以有多种完成方式。例如,使用 GitHub CLI 或 GitHub Desktop,而不是 GitHub UI。

  • 直达目标 - 当用户知道他们想要如何完成一项任务,并且不需要查看其他选项时,工具切换器会移除不太相关的內容,以便他们能够快速找到所需的信息。

使用工具标签

您可以通过在 Markdown 中使用工具标签,将工具切换器添加到文章中。工具标签是 Liquid 标签,用于包裹您想要在特定工具切换器选项卡中显示的內容。

例如,以下代码块显示了三个不同工具的內容。

{% vscode %}
This content is specific to Visual Studio Code.
{% endvscode %}

{% visualstudio %}
This content is specific to Visual Studio.
{% endvisualstudio %}

{% jetbrains %}
This content is specific to JetBrains IDEs.
{% endjetbrains %}

默认情况下,Markdown 中使用的第一个工具标签将被选中用于文章。您可以在文章的前置内容中指定 defaultTool: 属性,为文章定义不同的默认工具。有关更多信息,请参阅 内容自述文件

您还可以通过在链接末尾添加 ?tool=TOOLNAME,链接到选择特定工具的文章。有关更多信息,请参阅 "样式指南."

每篇文章最多包含八种不同的工具。包含更多工具会导致工具切换器选项卡与文章的目录内容重叠,从而阻止用户使用工具切换器或目录内容。您不太可能需要在文章中包含八种不同的工具。一般来说,计划在文章中使用尽可能少的工具。

何时使用工具标签

我们只在文章必须包含特定于工具的信息才能帮助用户完成任务时使用工具标签。

不要仅仅为了显示不同语言的示例而使用工具切换器。只有当文章中描述的任务或概念根据用户使用的工具而改变时,才使用工具切换器。

添加新工具

GitHub Docs 文档并维护 GitHub 产品、GitHub 开发的工具以及与 GitHub 合作开发的精选第三方扩展的工具标签。

只有当新工具是准确记录特定用户需求的唯一方式时,才会添加新工具。如果作者确定添加新工具是准确记录内容的唯一方式,他们需要在内容设计计划中提出新工具。审查内容设计计划的人员应考虑任何替代方法,以在不添加新工具的情况下满足文档需求。如果新工具是创建准确文档的唯一方式,则应添加新工具。如果存在不添加新工具的替代内容解决方案,则应使用该选项。

要添加新工具,请在 lib/all-tools.js 文件的 allTools 对象中添加一个键值对作为条目。键是您在文章中引用工具的标签,值是工具在文章顶部的工具选择器中将如何标识。例如,vscode: 'Visual Studio Code'

按字母顺序添加新工具。