如何使用WordPress内置功能实现标签云展示

更新于 2025年4月18日 WordPress 教程

如何使用WordPress内置功能实现标签云展示

如何使用WordPress内置功能实现标签云展示

标签云是网站上一个非常实用的功能，它不仅能帮助访客快速了解你的内容分类，还能提升网站的内部链接结构，对SEO也有一定帮助。很多新手可能会觉得需要安装插件才能实现这个效果，但其实WordPress本身就内置了标签云功能，完全不需要额外安装插件。今天我们就来一起探索如何轻松调用这个功能，让你的网站内容更加清晰易读。

为什么需要标签云

当你写了一段时间博客后，会发现文章逐渐积累，访客可能很难快速找到感兴趣的内容。标签云就像一个内容地图，通过视觉化的方式展示你所有文章的标签，访客可以一目了然地看到哪些主题是你经常讨论的，也能通过点击标签快速跳转到相关文章。

WordPress的标签云功能非常灵活，你可以控制显示的数量、排序方式，甚至自定义样式。最棒的是，这一切都不需要你懂代码，也不需要安装额外的插件。下面我们就从准备工作开始，一步步实现这个功能。

准备工作

在开始之前，确保你已经为文章添加了标签。如果你还没有使用过标签功能，可以进入文章 > 标签，先创建几个标签并分配给相应的文章。标签和分类不同，它更像是文章的关键词，可以更灵活地组织内容。

另外，建议你登录WordPress后台时使用管理员账号，因为有些小工具和功能的设置可能需要管理员权限。好了，现在我们已经准备好，可以开始操作了。

通过小工具添加标签云

WordPress最方便的标签云添加方式就是通过小工具。进入外观 > 小工具，你会看到可用小工具的列表。找到标签云小工具，直接把它拖拽到你想要的侧边栏或页脚区域。

拖拽完成后，这个小工具会展开，你可以进行一些基本设置：

  • 标题：比如“热门标签”或“文章分类”，这个会显示在标签云上方。
  • 显示标签数量：默认是45个，你可以根据需要调整。
  • 排序方式：按名称字母顺序排列，或是按使用频率（文章数量）排序。
  • 是否显示文章数量：勾选后，每个标签后面会显示相关的文章数。

设置完成后，点击保存，然后刷新你的网站前台页面，就能看到标签云已经出现了。如果觉得标签大小差异不够明显，别担心，我们稍后会讲到如何通过CSS微调样式。

使用短代码嵌入标签云

也许你不想把标签云放在侧边栏，而是希望嵌入到文章或页面中。WordPress为此提供了非常方便的短代码功能。在任何文章或页面的编辑器中，你可以直接插入以下短代码：

[tag_cloud number="20" ***allest="12" largest="22" unit="px"]

这个短代码有几个常用参数可以调整：

  • number：控制显示的标签数量
  • ***allest和largest：设置最小和最大字体大小（单位可以是px、pt、em等）
  • unit：字体大小的单位
  • taxonomy：如果你还想显示分类目录而不仅仅是标签，可以设置为”category”

短代码的优势是灵活性高，你可以把它放在任何位置，甚至配合页面构建器使用。保存后更新页面，就能看到嵌入的标签云了。

通过主题文件直接调用

如果你对修改主题文件比较熟悉，或者想更精确地控制标签云的位置，可以直接在主题模板文件中插入以下PHP代码：

<?php wp_tag_cloud(array(
    '***allest' => 10, 
    'largest' => 22,
    'unit' => 'pt',
    'number' => 30,
    'orderby' => 'count',
    'order' => 'DESC'
)); ?>

这段代码可以放在sidebar.php、footer.php或其他任何模板文件中。参数和短代码类似，但因为是直接调用，所以执行效率会更高。

注意：修改主题文件前，建议先创建子主题，避免主题更新时丢失你的修改。如果你不确定如何操作，建议使用前面提到的小工具或短代码方法。

自定义标签云样式

默认的标签云可能和你的网站设计不太搭配，这时我们可以通过CSS来调整。进入外观 > 自定义 > 额外CSS，添加类似下面的代码：

.tagcloud a {
    background: #f5f5f5;
    padding: 5px 10px;
    margin: 0 5px 5px 0;
    border-radius: 3px;
    display: inline-block;
    transition: all 0.3s ease;
}

.tagcloud a:hover {
    background: #0073aa;
    color: white;
    text-decoration: none;
}

这段CSS会给标签添加浅灰色背景、圆角和悬停效果。你可以根据自己网站的风格调整颜色、间距等参数。如果不太熟悉CSS，可以尝试使用浏览器的开发者工具（按F12）实时预览修改效果。

常见问题及解决

标签云不显示怎么办？
首先检查你是否已经创建了标签并分配给了文章。如果没有标签，当然不会有任何显示。其次，查看是否在设置中限制了显示数量，可以尝试增加数字。

如何只显示特定分类的标签？
WordPress默认不支持这个功能，但你可以通过安装Tag Groups这类插件来实现更高级的标签管理。

标签云显示在移动设备上效果不佳
可以考虑在移动端隐藏标签云，或者通过媒体查询调整样式。在额外CSS中添加：

@media (max-width: 768px) {
    .tagcloud a {
        padding: 3px 6px;
        font-size: 80% !important;
    }
}

进阶技巧

如果你对标签云的功能还不满足，这里有几个延伸方向：

  1. 彩色标签云：通过为不同标签添加特定class，可以实现多彩标签效果
  2. 3D标签云：使用CSS3的transform属性创建更有视觉冲击力的效果
  3. AJAX标签云：让标签能够无需刷新页面就加载相关内容

这些高级功能可能需要一些额外的代码或插件支持，但基础的标签云已经能满足大多数网站的需求了。

结语

现在你的网站应该已经有了一个功能完善的标签云了！回顾一下，我们学会了三种添加标签云的方法：小工具、短代码和直接调用函数。每种方法都有其适用场景，你可以根据具体需求选择。

标签云虽小，却能大大提升用户体验。它不仅帮助访客发现更多内容，也让你的网站结构更加清晰。如果你想让标签云更有个性，不妨尝试调整CSS样式，或者探索那些能扩展标签功能的插件。

还有什么关于WordPress标签的问题吗？欢迎在评论区留言，我们一起探讨如何让你的网站内容更加出彩！

你可能还喜欢下面这些文章

Auditor：WordPress 文章内容安全审核插件Auditor：WordPress 文章内容安全审核插件

本插件可以识别文章中的敏感信息，如果文章存在敏感信息，文章将会自动移动到安全的敏感隔离区，禁止任何形式的前台访问。

WordPress小说主题wpnovo，支持多语言、付费阅读、VIP会员功能的精美小说模板WordPress小说主题wpnovo，支持多语言、付费阅读、VIP会员功能的精美小说模板

//demo.imwpweb.com/wpnovo/多设备支持主题支持PC和移动端界面，独立设置，互不干扰。移动端首页(右)图：小说页面PC端和移动端的展示付费订阅主题支持付费订阅功能，支持付费单章订阅、整本小说订阅模式。

WordPress自动内链插件 WPKAL ，网站全自动增加锚链接必备插件WordPress自动内链插件 WPKAL ，网站全自动增加锚链接必备插件

什么是内链内链，顾名思义就是在同一网站域名下的内容页面之间的互相链接（自己网站的内容链接到自己网站的内部页面，也称之为站内链接）。自动内链工作原理简单来说，我们设定一些词表以及词表对应的链接，比如词是wordpress插件，链接是http

WordPress 敏感词违禁词屏蔽插件 WPWJC 介绍与下载WordPress 敏感词违禁词屏蔽插件 WPWJC 介绍与下载

这款插件的核心功能就是一点：找出文章中的违禁词、敏感词等措辞不当的词语，替换成你设置的更合适的词或者直接替换“*”号。请注意，需要同时下载站长工具箱和违禁词屏蔽插件，安装插件时也需要两个插件同时安装。

WordPress 文章自动配图、缩略图插件 WPAC 介绍与下载WordPress 文章自动配图、缩略图插件 WPAC 介绍与下载

2、自动生成的图片并非真实在磁盘中的图片，而是动态生成的，如果保存到磁盘会占用大量空间，这个空间没必要浪费，因此修改主题代码，直接将缩略图的地址改为wpac自动生成的缩略图地址是一个非常好的方案。

WordPress 相关文章插件 wprecWordPress 相关文章插件 wprec

wprec利用相似度算法计算每篇文章之间的相似度，找到与当前文章最相似的一些文章，展现在文章底部作为相关文章。我们知道，相关推荐插件推荐的原理是根据当前文章的特征（文章的高权重标签），从文章库中召回相关文章，再根据相关性评分，最后选出To