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…
也许您对此感到满意。 我不是…
- Inline styles? Didn’t we abandon those in 1998?内联样式? 我们不是在1998年放弃了这些吗?
- 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引用它也很脆弱。
- 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标签云
wordpress标签云_如何在WordPress中建立更好的标签云相关推荐
- django 传递中文_如何在Django中建立消息传递状态
django 传递中文 by Ogundipe Samuel 由Ogundipe Samuel 如何在Django中建立消息传递状态 (How to Build a Message Delivery ...
- wordpress图像大小_如何在WordPress中添加图像积分(逐步操作)
wordpress图像大小 Recently, some of our readers asked us about how to properly add image credits in Word ...
- wordpress添加媒体_如何在WordPress中添加新帖子并利用所有功能
wordpress添加媒体 Are you trying to create a new post in WordPress? Do you want to learn about all the W ...
- wordpress添加媒体_如何在WordPress中添加精选内容滑块
wordpress添加媒体 Do you want to add a featured content slider like Yahoo or ESPN? Many popular sites us ...
- wordpress添加媒体_如何在WordPress中添加jQuery FAQ手风琴
wordpress添加媒体 Recently one of our users asked us if there was a way for them to add a FAQ accordion ...
- wordpress谷歌字体_如何在WordPress中添加Google Maps
wordpress谷歌字体 You can add all kind of content into your WordPress site. At WPBeginner we have shown ...
- wordpress添加媒体_如何在WordPress中添加社交媒体共享计数小部件
wordpress添加媒体 Earlier on this blog, we created a Social Media Cheat Sheet for WordPress, but that on ...
- wordpress标题设置_如何在WordPress中的帖子标题中添加赞助的帖子前缀
wordpress标题设置 Often you see bloggers publish sponsored posts on their blog. Recently one of our user ...
- wordpress默认密码_如何在WordPress中为新用户设置默认管理员配色方案
wordpress默认密码 One of the most talked about feature of WordPress 3.8 is the new admin interface. It i ...
最新文章
- MonoRail学习笔记一:一个小例子
- MVC4 下DropDownList使用方法(转)
- 2015年第六届蓝桥杯 - 省赛 - C/C++大学B组 - F. 加法变乘法
- 【BZOJ1042】硬币购物(动态规划,容斥原理)
- mysql 5.1升级5.6_mysql 5.1.71升级到5.6.30
- php 连接oracle乱码,PHP查询oracle数据显示乱码问题
- 好东西,将你的英文版TFS变为中文版?:Visual Studio 2005 Team Foundation Server 语言更改包...
- 二分查找算法-java
- 玩转群晖NAS套件系列一:cloud sync套件的安装与使用保姆级教程!
- 服务器XP系统打印机共享设置,小编调解xp系统打印机共享设置和使用的详细教程...
- 第二门课 改善深层神经网络:超参数调试、正则化以及优化(Improving Deep Neural Networks:Hyperparameter tuning…)
- 移动端H5页面必用代码
- C++ sort排序函数用法
- 小于等于、 大于等于Mybatis 、oracle
- 基于python的对比度增强(线性变换、直方图正规化、直方图均衡化、CLAHE)
- 计算机专业高级工程师考哪些专业,高级工程师职称考试项目有哪些
- css3 animation 实现帧动画
- 运行阶段及面向对象技巧
- Visual Studio 2013 下载地址 V12各种版本官方下载网址
- 51单片机之外部中断方式 ——— INT0 中断
热门文章
- 使用pdf.js实现pdf文件的在线预览(有码源)
- Quested V2108录音室监听音箱评测
- UML图绘制(三)-----活动图的画法 一
- Win32程序标准开发流程 .
- 关于剪报插件在新版本Chrome浏览器下不能使用的解决方案(最新)
- 【腾讯优测干货分享】使用多张图片做帧动画的性能优化 1
- 校园招聘攻略----硬件工程师基础问题(六)
- 彩票 量子计算机,科学家发明了能预测未来的量子计算机?且慢,它还不能预测彩票中奖号码...
- SAP天天学-教程(一)SAP公司简介
- java 随机数random