今天给大家带来一篇WordPress添加一个自定义小工具的教程,之前悟空搜分享了WordPress屏蔽后台自带默认小工具,没有印象的朋友可以看看:
[xx_insert_post station_article=”1696″]
创建小工具
创建一个小工具,需要使用 register_widget() 函数挂载一个继承于 WP_Widget 类的类,下边是一个简单的例子,创建了一个随机文章小工具。
注意,register_widget() 函数需要在 widgets_init 钩子上调用。
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39 class widget_tags extends WP_Widget{
//添加小工具
function __construct(){
$this->WP_Widget( 'random_posts', __( '随机文章', 'Bing' ), array( 'description' => __( '显示几篇随机文章', 'Bing' ) ) );
}
//小工具内容
function widget( $args, $instance ){
//导入当前侧边栏设置
extract( $args, EXTR_SKIP );
//输出小工具前代码
echo $before_widget;
//输出小工具标题
echo $before_title . '随机文章' . $after_title;
//随机文章
query_posts( 'orderby=rand&showposts=10' );
if( have_posts() ):
echo '<ul>';
while( have_posts() ):
the_post();
printf( '<li><a href="{5cc1b29162d549a8071384de182cc9fc6e6a0fd85e7907f22fd9e18cff4269c3}s" title="{5cc1b29162d549a8071384de182cc9fc6e6a0fd85e7907f22fd9e18cff4269c3}s">{5cc1b29162d549a8071384de182cc9fc6e6a0fd85e7907f22fd9e18cff4269c3}s</a></li>', get_permalink(), get_the_title(), get_the_title() );
endwhile;
echo '</ul>';
endif;
//输出小工具后代码
echo $after_widget;
}
}
function Bing_add_widget_tags(){
register_widget( 'widget_tags' );
}
add_action( 'widgets_init', 'Bing_add_widget_tags' );这样,后台就会出现了一个随机文章小工具,拖动到侧边栏上,会在前台显示十篇随机文章。
小工具设置
但我们会发现这个小工具并没有设置选项,那如何给这个小工具添加设置选项呢?设置选项涉及类的两个函数,update()(更新小工具设置时的处理函数)和 form()(设置表单)。
下边的代码添加了一个标题设置和显示文章数量的设置:
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68 class widget_tags extends WP_Widget{
//添加小工具
function __construct(){
$this->WP_Widget( 'random_posts', __( '随机文章', 'Bing' ), array( 'description' => __( '显示几篇随机文章', 'Bing' ) ) );
}
//小工具内容
function widget( $args, $instance ){
//导入当前侧边栏设置
extract( $args, EXTR_SKIP );
//输出小工具前代码
echo $before_widget;
//输出小工具标题
echo $before_title . '随机文章' . $after_title;
//随机文章
query_posts( 'orderby=rand&showposts=10' );
if( have_posts() ):
echo '<ul>';
while( have_posts() ):
the_post();
printf( '<li><a href="{5cc1b29162d549a8071384de182cc9fc6e6a0fd85e7907f22fd9e18cff4269c3}s" title="{5cc1b29162d549a8071384de182cc9fc6e6a0fd85e7907f22fd9e18cff4269c3}s">{5cc1b29162d549a8071384de182cc9fc6e6a0fd85e7907f22fd9e18cff4269c3}s</a></li>', get_permalink(), get_the_title(), get_the_title() );
endwhile;
echo '</ul>';
endif;
//输出小工具后代码
echo $after_widget;
}
//更新选项
function update( $instance, $old_instance ){
$instance['title'] = strip_tags( $instance['title'] );
$instance['number'] = (int) strip_tags( $instance['number'] );
return $instance;
}
//选项表单
function form( $instance ){
//添加默认设置
$instance = wp_parse_args( $instance, array(
'title' => __( '随机文章', 'Bing' ),
'number' => 10
) );
//设置表单
?>
<p>
<label for="<?php echo $this->get_field_id( 'title' ); ?>"><?php _e( '标题', 'Bing' ); ?>:</label>
<input class="widefat" id="<?php echo $this->get_field_id( 'title' ); ?>" name="<?php echo $this->get_field_name( 'title' ); ?>" type="text" value="<?php echo $instance['title']; ?>" />
</p>
<p>
<label for="<?php echo $this->get_field_id( 'number' ); ?>"><?php _e( '文章数量', 'Bing' ); ?>:</label>
<input class="widefat" id="<?php echo $this->get_field_id( 'number' ); ?>" name="<?php echo $this->get_field_name( 'number' ); ?>" type="number" value="<?php echo $instance['number']; ?>" />
</p>
<?php
}
}
function Bing_add_widget_tags(){
register_widget( 'widget_tags' );
}
add_action( 'widgets_init', 'Bing_add_widget_tags' );这样再展开小工具,就能看到设置了:
然后,在生成小工具内容的时候使用选项,就能达到用户自定义的效果。
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71 class widget_tags extends WP_Widget{
//添加小工具
function __construct(){
$this->WP_Widget( 'random_posts', __( '随机文章', 'Bing' ), array( 'description' => __( '显示几篇随机文章', 'Bing' ) ) );
}
//小工具内容
function widget( $args, $instance ){
//导入当前侧边栏设置
extract( $args, EXTR_SKIP );
//添加小工具标题过滤器
$title = apply_filters( 'widget_name', $instance['title'] );
//输出小工具前代码
echo $before_widget;
//输出小工具标题
echo $before_title . $title . $after_title;
//随机文章
query_posts( 'orderby=rand&showposts=' . $instance['number'] );
if( have_posts() ):
echo '<ul>';
while( have_posts() ):
the_post();
printf( '<li><a href="{5cc1b29162d549a8071384de182cc9fc6e6a0fd85e7907f22fd9e18cff4269c3}s" title="{5cc1b29162d549a8071384de182cc9fc6e6a0fd85e7907f22fd9e18cff4269c3}s">{5cc1b29162d549a8071384de182cc9fc6e6a0fd85e7907f22fd9e18cff4269c3}s</a></li>', get_permalink(), get_the_title(), get_the_title() );
endwhile;
echo '</ul>';
endif;
//输出小工具后代码
echo $after_widget;
}
//更新选项
function update( $instance, $old_instance ){
$instance['title'] = strip_tags( $instance['title'] );
$instance['number'] = (int) strip_tags( $instance['number'] );
return $instance;
}
//选项表单
function form( $instance ){
//添加默认设置
$instance = wp_parse_args( $instance, array(
'title' => __( '随机文章', 'Bing' ),
'number' => 10
) );
//设置表单
?>
<p>
<label for="<?php echo $this->get_field_id( 'title' ); ?>"><?php _e( '标题', 'Bing' ); ?>:</label>
<input class="widefat" id="<?php echo $this->get_field_id( 'title' ); ?>" name="<?php echo $this->get_field_name( 'title' ); ?>" type="text" value="<?php echo $instance['title']; ?>" />
</p>
<p>
<label for="<?php echo $this->get_field_id( 'number' ); ?>"><?php _e( '文章数量', 'Bing' ); ?>:</label>
<input class="widefat" id="<?php echo $this->get_field_id( 'number' ); ?>" name="<?php echo $this->get_field_name( 'number' ); ?>" type="number" value="<?php echo $instance['number']; ?>" />
</p>
<?php
}
}
function Bing_add_widget_tags(){
register_widget( 'widget_tags' );
}
add_action( 'widgets_init', 'Bing_add_widget_tags' );文章到这里就已经完成了WordPress如何添加自定义小工具的全部教程了,希望对你有些帮助。
扫码关注wp悟空搜
精选优质免费WordPress主题模板,分享最新WordPress实用建站教程!
记住我们的网址:ztJun.com
原文链接:https://xiaohost.com/1711.html,转载请注明出处。
评论0