WordPress（Hueman主题）如何在右侧边栏创建分类下拉筛选器

不需要安装额外插件，依托WordPress核心自带功能就能实现你需要的侧边栏分类筛选效果，具体操作如下：

最简实现：用官方自带分类小工具 #

• 登录WordPress后台，打开「外观」-「小工具」设置页
• 在可用小工具列表找到「分类目录」模块，点击选择要挂载的位置为Hueman主题的右侧主边栏，确认添加
• 在小工具的设置面板中，勾选显示为下拉菜单，可按需开启「显示文章数」「展示分类层级」「隐藏无文章的空分类」选项，开启分类层级后就能实现父分类嵌套子分类的级联下拉效果，和你参考的筛选逻辑一致
• 保存设置后刷新前台页面，就能看到可正常使用的分类下拉筛选菜单，WordPress会自动加载下拉选项的跳转逻辑，Hueman主题对官方原生小工具有完善的样式适配，不会出现排版错位问题。

自定义调整方案 #

如果对原生小工具的样式、交互不满意，也不需要安装插件，用主题自带功能就能调整：

• 回到小工具设置页，给右侧边栏添加「自定义HTML」小工具
• 粘贴如下代码即可生成可控性更高的分类下拉：

<?php wp_dropdown_categories(array(
    'show_option_none' => '选择分类',
    'hierarchical' => 1,
    'show_count' => 1,
    'orderby' => 'name',
)); ?>
<script>
const catDropdown = document.getElementById("cat");
catDropdown.addEventListener("change", function(){
    if(this.value > 0){
        window.location.href = `/?cat=${this.value}`
    }
})
</script>

• 如果需要调整下拉框的配色、尺寸、圆角等样式，进入「外观」-「自定义」-「额外CSS」板块，写对应CSS规则匹配站点整体设计即可。

内容的提问来源于stack exchange，提问作者exprees