WordPress标签云小工具详解
WordPress标签云小工具是WordPress程序自带的一个小工具,它可以在我们的博客侧边栏展示网站的标签列表。今天WordPress小工具详解系列就从WordPress标签云小工具开始。带大家熟悉标签云小工具的各个细节。
在【外观->小工具】菜单中就可以找到标签云小工具,将它拖到我们的侧边栏中,就可以了。
我们可以设置标签云小工具的标题,你可以取你想要展示的名称【如:热门标签,热门搜索,标签云集等等】。还能设置标签的分类法,WordPress标签小工具可以设置标签分类法和链接分类目录。
设置完成,保存就可以了。
这是WordPress头条的标签云小工具。CSS文件在文章末尾贴给大家。
下面我们来深入分析标签云小工具的源码实现:
标签云源码位置:wp-includes\widgets\class-wp-widget-tag-cloud.php
源代码:(since 4.4.0)
__( 'A cloud of your most used tags.' ),
'customize_selective_refresh' => true,
);
parent::__construct( 'tag_cloud', __( 'Tag Cloud' ), $widget_ops );
}
/**
* Outputs the content for the current Tag Cloud widget instance.
*
* @since 2.8.0
* @access public
*
* @param array $args Display arguments including 'before_title', 'after_title',
* 'before_widget', and 'after_widget'.
* @param array $instance Settings for the current Tag Cloud widget instance.
*/
public function widget( $args, $instance ) {
$current_taxonomy = $this->_get_current_taxonomy($instance);
if ( !empty($instance['title']) ) {
$title = $instance['title'];
} else {
if ( 'post_tag' == $current_taxonomy ) {
$title = __('Tags');
} else {
$tax = get_taxonomy($current_taxonomy);
$title = $tax->labels->name;
}
}
/**
* Filter the taxonomy used in the Tag Cloud widget.
*
* @since 2.8.0
* @since 3.0.0 Added taxonomy drop-down.
*
* @see wp_tag_cloud()
*
* @param array $current_taxonomy The taxonomy to use in the tag cloud. Default 'tags'.
*/
$tag_cloud = wp_tag_cloud( apply_filters( 'widget_tag_cloud_args', array(
'taxonomy' => $current_taxonomy,
'echo' => false
) ) );
if ( empty( $tag_cloud ) ) {
return;
}
/** This filter is documented in wp-includes/widgets/class-wp-widget-pages.php */
$title = apply_filters( 'widget_title', $title, $instance, $this->id_base );
echo $args['before_widget'];
if ( $title ) {
echo $args['before_title'] . $title . $args['after_title'];
}
echo '';
echo $tag_cloud;
echo "\n";
echo $args['after_widget'];
}
/**
* Handles updating settings for the current Tag Cloud widget instance.
*
* @since 2.8.0
* @access public
*
* @param array $new_instance New settings for this instance as input by the user via
* WP_Widget::form().
* @param array $old_instance Old settings for this instance.
* @return array Settings to save or bool false to cancel saving.
*/
public function update( $new_instance, $old_instance ) {
$instance = array();
$instance['title'] = sanitize_text_field( $new_instance['title'] );
$instance['taxonomy'] = stripslashes($new_instance['taxonomy']);
return $instance;
}
/**
* Outputs the Tag Cloud widget settings form.
*
* @since 2.8.0
* @access public
*
* @param array $instance Current settings.
*/
public function form( $instance ) {
$current_taxonomy = $this->_get_current_taxonomy($instance);
$title_id = $this->get_field_id( 'title' );
$instance['title'] = ! empty( $instance['title'] ) ? esc_attr( $instance['title'] ) : '';
echo '' . __( 'Title:' ) . '
';
$taxonomies = get_taxonomies( array( 'show_tagcloud' => true ), 'object' );
$id = $this->get_field_id( 'taxonomy' );
$name = $this->get_field_name( 'taxonomy' );
$input = '';
switch ( count( $taxonomies ) ) {
// No tag cloud supporting taxonomies found, display error message
case 0:
echo '' . __( 'The tag cloud will not be displayed since there are no taxonomies that support the tag cloud widget.' ) . '';
printf( $input, '' );
break;
// Just a single tag cloud supporting taxonomy found, no need to display options
case 1:
$keys = array_keys( $taxonomies );
$taxonomy = reset( $keys );
printf( $input, esc_attr( $taxonomy ) );
break;
// More than one tag cloud supporting taxonomy found, display options
default:
printf(
'%2$s' .
'', $id, __( 'Taxonomy:' ), $name ); foreach ( $taxonomies as $taxonomy => $tax ) { printf( '%s', esc_attr( $taxonomy ), selected( $taxonomy, $current_taxonomy, false ), $tax->labels->name ); } echo '';
}
}
/**
* Retrieves the taxonomy for the current Tag cloud widget instance.
*
* @since 4.4.0
* @access public
*
* @param array $instance Current settings.
* @return string Name of the current taxonomy if set, otherwise 'post_tag'.
*/
public function _get_current_taxonomy($instance) {
if ( !empty($instance['taxonomy']) && taxonomy_exists($instance['taxonomy']) )
return $instance['taxonomy'];
return 'post_tag';
}
}
这里我们主要看一下这几行代码:
$tag_cloud = wp_tag_cloud( apply_filters( 'widget_tag_cloud_args', array(
'taxonomy' => $current_taxonomy,
'echo' => false
) ) );
主要知识点wp_tag_cloud函数和apply_filters函数。我们知道apply_filters是一个函数过滤器。这样我们就可以定制wp_tag_cloud函数的参数了。
具体的修改方法,请查看如何修改WordPress标签云小工具,你还可以根据WordPress标签云小工具的源码开发属于自己的标签云小工具。
附(本网站使用的标签云小工具CSS代码):
/* tag-cloud widget */
.widget_links {}
.widget_links li:after {}
.widget_links li:before {}
.widget_tag_cloud {}
.widget_tag_cloud a { padding:3px; float: left;
margin: 0 10px 10px 0;
padding: 0 15px;
background: #fff;
color: #5e6b73;
font-size: 14px;
height: 30px;
line-height: 30px;
border: 1px solid #E8ECEF;
border-radius: 16px;
-webkit-border-radius: 16px; }
.widget_tag_cloud a:hover{background: #a0aebc;border-color: #a0aebc;color: #fff;}
.widget_tag_cloud a:after {}
.widget_tag_cloud a:before {}
.tagcloud { padding:15px 0 15px 0; }
WordPress标签云小工具详解相关推荐
- nps内网穿透服务器搭建教程(阿里云)-小宇特详解
nps内网穿透服务器搭建教程(阿里云)-小宇特详解 前期准备 1.一台云服务器 2.配置安全组 3.在自己的电脑上安装nps 云服务器的话自己买,我这里使用的是阿里云 讲一下配置安全组 打开阿里云的官 ...
- 云小课 | 详解华为云独享型负载均衡如何计费
阅识风云是华为云信息大咖,擅长将复杂信息多元化呈现,其出品的一张图(云图说).深入浅出的博文(云小课)或短视频(云视厅)总有一款能让您快速上手华为云.更多精彩内容请单击此处. 摘要:华为云独享型负载均 ...
- python读取excel写入数据库_python实现读取excel写入mysql的小工具详解
Python是数据分析的强大利器 利用Python做数据分析,第一步就是学习如何读取日常工作中产生各种excel报表并存入数据中,方便后续数据处理. 这里向大家分享python如何读取excel,并使 ...
- nps内网穿透服务器搭建教程(ip显示阿里云的ip)-小宇特详解
nps内网穿透服务器搭建教程(ip显示阿里云的ip)-小宇特详解 一共有两部分,一部分是windows安装,一部分是linux系统(使得ip显示自己的阿里云). 前期准备 1.一台云服务器 2.配置安 ...
- 【阿里云课程】详解深度学习优化:泛化与正则化,学习率与最优化
大家好,继续更新有三AI与阿里天池联合推出的深度学习系列课程,本次更新内容为第6课中两节,介绍如下: 第1节:泛化与正则化 第1节课内容为:泛化与正则化,讲述泛化的概念与重要性,各种正则化方法,包括显 ...
- 什么是云服务器ECS?云服务器ECS详解
什么是云服务器ECS?云服务器ECS详解 一.前言 二.云服务器ECS详解 为什么选择云服务器ECS? 产品架构 产品定价 管理工具 部署建议 相关服务 三.写在后面的话 叮嘟!这里是小啊呜的学习课程 ...
- 一文带你理解云原生 | 云原生全景图详解
关注「开源Linux」,选择"设为星标"回复「学习」,有我为您特别筛选的学习资料~ 1带你了解云原生技术图谱 如果你研究过云原生应用程序和相关技术,大概率你遇到过 CNCF 的云原 ...
- 【input 标签的 type 属性详解】
input 标签的 type 属性详解 1. input 输入标签的 type 属性 1.1 input 标签的 type类型 属性的常用属性值 ⑴ 单行文本框: type="text&qu ...
- Android vector标签 PathData 画图超详解
此文章来源于https://www.cnblogs.com/yuhanghzsd/p/5466846.html点击打开链接 Android vector标签 PathData 画图超详解 SVG是一种 ...
最新文章
- keras 的 example 文件 babi_rnn.py 解析
- 对象检测和图像分割有什么区别?
- linux git yum安装包下载,在CentOS 8上用Yum及源代码安装Git的方法
- PHP-FPM,Nginx,FastCGI 三者之间的关系
- Matlab绘图基础——利用axes(坐标系图形对象)绘制重叠图像 及 一图多轴(一幅图绘制多个坐标轴)
- 为什么你应该尝试@reach/router
- 解决在已办任务菜单中都会抛出异常,由于definitionId=undefined导致的问题
- hadoop设置java环境_hadoop安装(3)_Linux配置JDK环境
- 【算法】插值查找算法
- [VB]使用ADO Recordset对象导入Excel
- 定位的特殊特性(HTML、CSS)
- 剩余方差matlab,用matlab的var函数求方差
- 上海计算机应用基础自考上机,上海市自学考试公共实践课程《计算机应用基础(实践)》上机考核大纲_自考资讯自考_自考报名_中国教育在线...
- 性早熟和微生物群:性激素-肠道菌群轴的作用
- CobaltStrike木马免杀代码篇之python反序列化分离免杀(一)
- html5 ios 键盘挡住输入框,IOS 键盘挡住输入框的问题解决办法
- ## Android Studio 开发(四)--蓝牙通信
- 积跬步,聚小流------具有滑动效果的导航
- Quartus-II的安装教程
- js根据年份计算年龄
热门文章
- re:正则表达式,字符串处理的杀手锏
- lol更新显示正在连接服务器,lol提示无法连接服务器请检查你的网络并重新连接的解决方法...
- Ubuntu使用备忘
- redis解决(DENIED Redis is running in protected mode because prote)
- ChatGPT 提问的艺术:制作清晰有效的提问指南 | Github优秀项目分享
- 中国移动GPRS概况
- halfstone 原理_躺在操场看天
- 菜鸟初学Echarts
- 关键点提取:face_recognition、疲劳检测、人脸校准、人脸数据库
- JDO和JPA的区别是什么