当前位置:首页 > CMS教程 > 正文

WordPress如何将分类目录设置在页面左侧?

在WordPress后台,进入“外观”>“小工具”,将“分类目录”小工具拖拽到左侧边栏区域(如“主侧边栏”)即可,部分主题也可在“外观”>“自定义”>“小工具”中直接添加并选择左侧位置。

在WordPress中将分类目录显示在网站左侧是常见的布局需求,通常通过侧边栏实现,以下是三种专业方法,根据您的技术能力选择最适合的方案:

使用小工具实现(推荐新手)

  1. 进入WordPress后台 → 外观 → 小工具
  2. 在左侧可用小工具中找到“分类目录”
  3. 将其拖拽至“侧边栏”区域(通常名为Sidebar或主侧边栏)
  4. 点击展开小工具设置:
    • 勾选“显示为下拉框”可节省空间
    • 启用“显示文章计数”增强信息量
    • 勾选“显示层级”保留父子分类关系
  5. 点击“更新”保存设置

若侧边栏不在左侧:进入外观 → 自定义 → 小工具,检查主题是否提供多区域侧边栏,选择名称含”Left”或”Primary”的区域

通过菜单系统控制(适合定制导航)

  1. 进入外观 → 菜单
  2. 点击“创建新菜单”并命名(如”左侧分类导航”)
  3. 在左侧“分类目录”板块中:
    • 勾选需显示的分类
    • 点击“添加到菜单”
  4. 拖拽菜单项调整层级顺序
  5. “显示位置”中勾选侧边栏区域(如”主侧边栏”)
  6. 点击“保存菜单”

优势:可混合添加分类、页面、自定义链接,自由控制排序

WordPress如何将分类目录设置在页面左侧?  第1张

代码实现(高级用户)

通过主题文件添加精准控制的分类列表:

  1. 使用FTP或外观 → 主题文件编辑器
  2. 打开sidebar.php文件(部分主题在index.php
  3. 在需要显示的位置插入代码:
    <?php 
      $args = array(li'   => '<h3 class="cat-title">文章分类</h3>',
        'show_count' => true,
        'depth'      => 2 
      );
      wp_list_categories($args); 
    ?>
  4. 添加CSS美化样式(在外观→自定义→额外CSS中):
    .cat-title {
      font-size: 1.2em;
      border-bottom: 1px solid #eee;
      padding-bottom: 10px;
    }
    .widget_categories li {
      margin: 8px 0;
    }

️ 重要提示:修改主题文件前请创建子主题,避免更新丢失修改

常见问题解决

侧边栏不显示?
检查主题是否支持:进入 外观 → 自定义 → 布局设置,选择”左侧边栏”布局
  <dt>主题无侧边栏选项?</dt>
  <dd>安装轻量插件:<a href="https://wordpress.org/plugins/custom-sidebars/" target="_blank">Custom Sidebars</a> 或 <a href="https://wordpress.org/plugins/widget-options/" target="_blank">Widget Options</a></dd>
  <dt>分类显示错位?</dt>
  <dd>在<strong>额外CSS</strong>中添加:<code>.widget { float: left; width: 100%; }</code></dd>
</dl>

通过以上方法,您可以在不降低网站性能的前提下实现分类目录左侧显示,建议:

  • 优先使用小工具系统 – 安全且可维护性高
  • 定期更新分类结构 – 确保导航时效性
  • 移动端测试 – 在手机端查看折叠效果

合理设置分类位置可提升用户体验,配合优质内容创作,将增强网站在搜索引擎中的E-A-T(专业性、权威性、可信度)表现。

引用资源:

  • WordPress官方小工具文档:https://wordpress.org/support/article/wordpress-widgets/
  • wp_list_categories()函数参考:https://developer.wordpress.org/reference/functions/wp_list_categories/
  • Google搜索E-A-T指南:https://developers.google.com/search/docs/essentials/e-e-a-t
0