如何在 WordPress 隱藏或設計您的子分類

WPressize Me

01/17/2024

為什麼在 WordPress 中使用子分類?

當您為您的 WordPress 網站撰寫文章時,您可以使用分類和標籤進行組織。適當地分類內容可以提升SEO,從而為您的網站帶來更多流量。組織文章同時也能改善網站導航,讓訪客更輕鬆找到他們想找的內容。當您的網站結構變得更複雜時,您甚至可以創建子分類。

例如,一個旅行博客可以有一個關於美國景點的分類。隨著其內容增長,可能會合理地創建一些城市的子分類,如芝加哥、洛杉磯和紐約市。

如果您在 WordPress 小工具中顯示分類,則可以使用平面列表或層次結構。訪問 WordPress 儀表板中的外觀 » 小工具(Widgets),然後選中您的分類小工具中的‘顯示層次結構’(Show hierarchy)框即可。

如何使用 CSS 隱藏您的子分類

在這篇文章中,我們將使用 CSS 代碼片段來隱藏和設計您的子分類。您可以將代碼片段直接添加到主題的 style.css 文件中,添加到諸如 WPCode 這樣的代碼片段插件中,或者通過 WordPress 儀表板中的主題定制器添加。

對於新手來說,添加 CSS 可能有些棘手,且錯誤操作可能使您的網站崩潰。如果您是新手,您可能會希望查看我們的指南,了解如何輕鬆地向您的 WordPress 網站添加自定義 CSS。

首先,將下面的代碼複製並粘貼到您的主題的 style.css 文件、代碼片段插件或者 WordPress 主題定制器中。

.children {
display:none;
}

之後,您可以訪問您的 WordPress 網站,確保子分類已隱藏。這樣看起來更加整潔,但您的訪客無法看到子分類。您可能會想查看我們的指南,了解如何在 WordPress 分類頁面上顯示子分類。

如何使用 CSS 設計您的子分類

您還可以使用 CSS 來自定義分類和子分類的外觀。這取決於您對 CSS 的知識以及您希望更改在當前主題中它們的外觀。

例如,如果您以層次結構顯示您的子分類,則添加垂直條可以快速看出哪些分類位於同一級別。下面是如何操作。

更改子分類樣式的步驟與隱藏它們的方法相同。您需要複製以下代碼並將其粘貼到 style.css 文件、WPCode 插件或 WordPress 主題定制器中。

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

完成後,您可以訪問您的 WordPress 網站以預覽更改過的樣式。根據您的需要隨意調整代碼以自定義樣式。

關於 WordPress 中分類和子分類的專家指南

現在您知道如何隱藏或設計您的子分類,您可能想查看其他一些關於使用 WordPress 中分類和子分類的教程:

  • 如何在 WordPress URL 中包含分類和子分類
  • 如何在 WordPress 小工具中顯示空分類
  • 如何在 WordPress 中顯示分類描述
  • 如何在 WordPress 中添加分類圖像 (分類圖標)

我們希望本教程幫助您學會如何隱藏您的子分類以及改變其樣式。您可能還想查看我們的必備 WordPress 插件列表,以促進您的網站增長或我們的教程,了解如何在 WordPress 中顯示相關文章。

如果您喜歡這篇文章,請訂閱我們的 YouTube 頻道。您也可以在 Twitter 和 Facebook 上找到我們。



Related Posts

  • 2025-02-16
  • WordPress 教学

你是否想过,能不能用更引人注目的方式取代WooCommerce中基本的促销徽章?答案是肯定的!通过自定义产品徽章,你可以在在线商店中突出新产品、折扣商品或限时优惠。在这篇文章中,我们将展示给你两个简单的方法,使用强大的插件或添加简单代码来为你的WooCommerce商店添加自定义产品徽章。

閱讀更多
  • 2025-01-18
  • WordPress 教学

我们都知道推荐计划是强大的武器。但要找到真正的品牌代言者并不容易。许多计划吸引的只是想快速赚钱的人,导致非真实的推广,无法有效转化客户。幸好,作为 WooCommerce 商店的店主,您有一个巨大的优势:一群真正喜爱和使用您产品的内置客户群。通过将这些现有客户转化为推广合伙人,您可以释放真实口碑营销的力量。

閱讀更多
  • 2025-01-10
  • WordPress 教学

最近,我们的一位比利时读者在其在线商店中苦于销售增长缓慢。除了其他建议外,我们建议他们在网站上设置Bancontact支付。Bancontact是一种主要在比利时使用的流行支付系统,客户可以通过银行账户进行安全的实时支付。

閱讀更多

{"email":"Email address invalid","url":"Website address invalid","required":"Required field missing"}
>