如何在 WordPress 中隐藏或设置子类别的样式

你想在 WordPress 中隐藏子类别，或者设置它们的样式以便您的类别列表更易于阅读吗？在 WordPress 中，你的帖子可以分为不同的类别和子类别。这有助于导航和搜索引擎优化，但一长串子类别在你的网站上并不总是看起来很好。

在本教程中，将向你展示如何使用代码片段隐藏子类别并更改其样式。

为什么在 WordPress 中使用子类别？

当你为 WordPress 网站撰写帖子时，可以使用类别和标签来组织它们。当你正确分类内容时，可以提高你的搜索引擎优化（SEO），这将为你的网站带来更多流量。

组织你的帖子还可以改善你网站的导航，以便访问者可以更轻松地找到他们正在寻找的内容。当你的网站结构变得更加复杂时，甚至可以创建子类别。

例如，旅游博客可能有一个关于美国观光目的地的类别。随着内容的增长，为芝加哥、洛杉矶和纽约等城市创建子类别可能是有意义的。

如果在WordPress 小部件中显示类别，则可以使用平面列表或层次结构。以下是每个选项在我们的演示网站上的外观：

子类别可以显示在分层列表中

可以通过访问WordPress 仪表板上的外观→小部件并选中类别小部件上的“显示层次结构”框来完成此操作。

无论选择哪个选项，该列表最终都会变得很长且难以管理，并且在你的WordPress 网站上看起来也不会很好。

如何使用 CSS 在 WordPress 中隐藏子类别

我们使用 CSS 代码片段来隐藏子类别并设置其样式。可以将代码片段直接添加到主题的 style.css 文件、代码片段插件（如WPCode）中，或者使用WordPress 仪表板中的主题定制器添加它们。

添加 CSS 对于初学者来说可能很棘手，犯一个错误可能会破坏你的 WordPress 网站。

让我们看看如何在 WordPress 中隐藏子类别。

隐藏子类别的步骤

需要复制以下代码并将其粘贴到主题的 style.css 文件、代码片段插件或 WordPress 主题定制器中：

.children { display: none; }

• 使用主题定制器隐藏子类别

要使用主题定制器，您首先需要导航到“外观”»“自定义”

然后单击列表底部的“其他 CSS”。之后，只需粘贴代码，然后单击“发布”按钮即可。

现在可以访问你的 WordPress 网站以确保子类别已隐藏。以下是测试网站的前后截图：

隐藏子类别前、后：

这看起来更干净，但现在你的访问者看不到子类别。可能想查看我们的指南，了解如何在 WordPress 类别页面上显示子类别。

如果这样做，那么当的访问者单击“美国”类别时，他们将在该页面上看到子类别的链接，例如芝加哥、洛杉矶和纽约市。

如何使用 CSS 在 WordPress 中设置子类别的样式

还可以使用 CSS 自定义类别和子类别的外观。这将取决于自己对 CSS 的了解以及您希望对它们在当前主题中的外观进行哪些更改。

设置子类别样式的步骤

更改子类别的样式与隐藏它们的过程相同。需要复制下面的代码并将其粘贴到 style.css、WPCode 插件或 WordPress 主题定制器中：

.children {
    padding: 0 0 0 5px;
    margin: 0 0 0 2px;
    border-left: 1px solid #333;
}

使用主题定制器设置子类别样式

如果使用主题定制器，单击“发布”按钮。

完成后，可以访问你的 WordPress 网站来预览更改。

还可以使用 CSS 来设置 WordPress 主题的其它元素的样式。例如，可以使用 CSS 为各个类别设置不同的样式。

结论

在 WordPress 中隐藏或设置子类别的样式可以帮助你保持网站的整洁和易于导航。通过使用简单的 CSS 代码片段，可以轻松地控制子类别的显示方式。