wordpress标签云_如何在WordPress中建立更好的标签云

wordpress标签云

Once you’ve defined a great set of tags for your WordPress posts (or pages), you’ll want to display a tag cloud from somewhere in your template. This is normally achieved using the wp_tag_cloud() or wp_generate_tag_cloud() functions which do the hard work for you:

为WordPress帖子( 或页面 )定义了一套不错的标签后，您将希望在模板中的某个位置显示标签云。 通常使用wp_tag_cloud()或wp_generate_tag_cloud()函数可为您完成辛苦的工作：

<a href="http://www.mysite.com/tag/word" class="tag-link-7" title="1 topic" style="font-size: 8pt;">word</a>
<a href="http://www.mysite.com/tag/tag" class="tag-link-5" title="2 topics" style="font-size: 14.3pt;">tag</a>
<a href="http://www.mysite.com/tag/phrase" class="tag-link-6" title="4 topics" style="font-size: 22pt;">phrase</a>
<a href="http://www.mysite.com/tag/subject" class="tag-link-4" title="1 topic" style="font-size: 8pt;">subject</a>

Perhaps you’re happy with that. I’m not…

也许您对此感到满意。 我不是…

1. Inline styles? Didn’t we abandon those in 1998?
   内联样式？ 我们不是在1998年放弃了这些吗？
2. The classes are pointless. I’ll probably never need to style an individual tag and, even if I do, referencing it by ID is fragile.
   这些类是毫无意义的。 我可能永远不需要设置单个标签的样式，即使我这样做，通过ID引用它也很脆弱。
3. I don’t need the fully-qualified URL.
   我不需要完全限定的URL。

wp_tag_cloud() offers several options but I want more control! As well as addressing the points above, I’d like to assign five or six classes to tags depending on their popularity, e.g. ‘tagged1’ for the least-used tag through to ‘tagged5’ for the most used.

wp_tag_cloud()提供了几个选项，但我想获得更多控制权！ 除了解决上述问题外，我还要根据标签的受欢迎程度为标签分配五到六个类别，例如，“ tagged1”(用于最少使用的标签)到“ tagged5”(用于最常用的标签)。

Let’s write a PHP function which returns a customized tag cloud. It can be placed in your theme’s functions.php file (wp-content/themes/<themename>/functions.php) or a plugin.

让我们编写一个PHP函数，该函数返回定制的标签云。 可以将其放在主题的functions.php文件(wp-content / themes / <themename> /functions.php)或插件中。

First, we have our function name which accepts an array of named arguments and sets defaults:

首先，我们有一个函数名，该函数名接受命名参数数组并设置默认值：

// generate tag cloud
function My_TagCloud($params = array()) {

	extract(shortcode_atts(array(
		'orderby' => 'name',		// sort by name or count
		'order' => 'ASC',		// in ASCending or DESCending order
		'number' => '',			// limit the number of tags
		'wrapper' => '',		// a tag wrapped around tag links, e.g. li
		'sizeclass' => 'tagged',	// the tag class name
		'sizemin' => 1,			// the smallest number applied to the tag class
		'sizemax' => 5			// the largest number applied to the tab class
	), $params));

We now initialize $ret, our returned HTML, and $min and $max — the minimum and maximum number of times a tag is used:

现在，我们初始化$ret ，返回HTML以及$min和$max －使用标签的最小次数和最大次数：

// initialize
	$ret = '';
	$min = 9999999; $max = 0;

The WordPress get_tags() function is now called. It returns an array of tag objects:

WordPress的get_tags()函数现在被调用。 它返回一个标签对象数组：

// fetch all WordPress tags
	$tags = get_tags(array('orderby' => $orderby, 'order' => $order, 'number' => $number));

We now need to determine the the minimum and maximum number of times a tag is used in our site. The following loop sets $min and $max accordingly:

现在，我们需要确定在我们的网站中使用标签的最小和最大次数。 以下循环相应地设置$min和$max ：

// get minimum and maximum number tag counts
	foreach ($tags as $tag) {
		$min = min($min, $tag->count);
		$max = max($max, $tag->count);
	}

We can now create our custom tag cloud HTML. We need to loop through all tags a second time and fetch the URL and the link title — a message indicating how many articles use that tag:

现在，我们可以创建自定义标签云HTML。 我们需要第二次遍历所有标签，并获取URL和链接标题-一条消息，指示有多少文章使用该标签：

// generate tag list
	foreach ($tags as $tag) {
		$url = get_tag_link($tag->term_id);
		$title = $tag->count . ' article' . ($tag->count == 1 ? '' : 's');

Now for the tricky bit. By default, we want to assign a class ‘tagged1’ for the least-used tag through to ‘tagged5’ for the most used (the class name and numbers can be overridden by setting sizeclass, sizemin and sizemax parameters when calling the function).

现在为难点。 默认情况下，我们要为使用最少的标记分配一个类'tagged1'到为使用最多的标记分配一个'tagged5'(可以通过在调用函数时设置sizeclass ， sizemin和sizemax参数来覆盖类名和数字)。

We know the minimum and maximum number of times a tag can be used so a little math can determine the class name for us. However, the equation would cause a divide by zero error if each tag was used, say, only once. In that situation, we set the class to just $sizeclass:

我们知道标签可以使用的最小和最大次数，因此，通过一点数学就可以确定我们的类名称。 但是，如果每个标签仅使用一次，则该方程将导致零除误差。 在这种情况下，我们将类设置为$sizeclass ：

if ($max > $min) {
			$class = $sizeclass . floor((($tag->count - $min) / ($max - $min)) * ($sizemax - $sizemin) + $sizemin);
		}
		else {
			$class = $sizeclass;
		}

We now have enough information to create the HTML for our single tag and end the loop:

现在，我们有足够的信息来为我们的单个标记创建HTML并结束循环：

$ret .= 
			($wrapper ? "<$wrapper>" : '') . 
			"<a href="$url" class="$class" title="$title">{$tag->name}</a>" .
			($wrapper ? "</$wrapper>" : '');
	}

Finally, we remove the blog domain URL from $ret, return the value and complete the function block:

最后，我们从$ret删除博客域URL，返回值并完成功能块：

return str_replace(get_bloginfo('url'), '', $ret);
}

The function can be called in any theme file using My_TagCloud();. Arguments can be passed as an associative array, e.g. My_TagCloud(array('orderby'=>'count','order'=>'DESC'));. However, we could also permit content editors to add a tag cloud using a WordPress shortcode, e.g.

可以使用My_TagCloud();在任何主题文件中调用该函数My_TagCloud(); 。 参数可以作为关联数组传递，例如My_TagCloud(array('orderby'=>'count','order'=>'DESC')); 。 但是，我们也可以允许内容编辑者使用WordPress短代码添加标签云，例如

// enable [tagcloud] shortcode
add_shortcode('tagcloud', 'My_TagCloud');

In the following example we’ll create a tag cloud within an unordered list:

在以下示例中，我们将在无序列表中创建标签云：

$tags = OW_Tags(array('wrapper' => 'li'));
if ($tags) {
	echo "<h2>Tags</h2>n<ul class="tagcloud">$tags</ul>n";
}

This produces far tidier HTML code:

这会产生更整齐HTML代码：

<h2>Tags</h2>
<ul class="tagcloud">
<li><a href="/tag/word" class="tagged1" title="1 article">word</a></li>
<li><a href="/tag/tag" class="tagged2" title="2 articles">tag</a></li>
<li><a href="/tag/phrase" class="tagged5" title="4 articles">phrase</a></li>
<li><a href="/tag/subject" class="tagged1" title="1 article">subject</a></li>
</ul>

which is easier to style and maintain CSS:

这更易于样式化和维护CSS：

ul.tagcloud, ul.tagcloud li
{
	font-size: 1em;
	list-style-type: none;
	padding: 0;
	margin: 0;
}

ul.tagcloud li
{
	display: inline;
}

ul.tagcloud a
{
	text-decoration: none;
	padding: 3px 4px;
}

a.tagged1 { font-size: 0.60em; }
a.tagged2 { font-size: 0.80em; }
a.tagged3 { font-size: 1.00em; }
a.tagged4 { font-size: 1.20em; }
a.tagged5 { font-size: 1.40em; }

I hope you find it useful. Please use and adapt the code however you like in your own WordPress projects.

希望对你有帮助。 请在您自己的WordPress项目中使用和修改您喜欢的代码。

翻译自: https://www.sitepoint.com/better-wordpress-tag-cloud/

wordpress标签云