为 WordPress 添加“热门文章”小工具

WordPress 提供了很多内置的小工具（widget）以方便对网站进行功能定制，比如搜索、日历、标签云、近期文章、分类目录等等，这些小工具可以满足大部分网站对管理、检索文章的需求。目前的 wordpress 没有提供一些比较通用的功能，比如本篇文章要介绍的 “热门文章” 功能，这个功能的实现方法有多种，本文将基于 wordpress 的小工具（widget）来实现，这样可以在一个页面的不同区块进行复用。

WordPress 小工具（widget）有一套内置的实现规则，所有对现有小工具进行功能扩展都需要遵循这些规则，这些规则主要就是从对小工具基础类 WP_Widget 进行扩展来体现的。这个类主要有四个方法可以根据小工具的功能需求做重载（修改），它们分别是：

• public function __construct() {} //构造函数，widget 实例初始化
• public function widget( $args, $instance ) {} //小工具内容的显示输出
• public function update( $new_instance, $old_instance ) {} //widget实例参数修改
• public function form( $instance ) {} //后台管理小工具参数的维护界面

“热门文章” 小工具就是通过对这四个函数做重载来实现的，下面逐一说明并给出具体的实现方法

1、 __construct() 函数，小工具实例参数初始化，比如类名、描述等，代码如下：

public function __construct() {
  $widget_ops = array(
	'classname' => 'widget_hot_entries',
	'description' => __( 'Your site’s most hot Posts.' ),
	'customize_selective_refresh' => true,
	);
  parent::__construct( 'hot-posts', __( 'Hot Posts' ), $widget_ops );
  $this->alt_option_name = 'widget_hot_entries';
}

2、 widge()函数，显示热门文章的标题链接，代码如下：

public function widget( $args, $instance ) {
	if ( ! isset( $args['widget_id'] ) ) {
		$args['widget_id'] = $this->id;
	}

	$title = ( ! empty( $instance['title'] ) ) ? $instance['title'] : __( 'Hot Posts' );
	$title = apply_filters( 'widget_title', $title, $instance, $this->id_base );
	$number = ( ! empty( $instance['number'] ) ) ? absint( $instance['number'] ) : 5;
	if ( ! $number ) {
		$number = 5;
	}
	$show_date = isset( $instance['show_date'] ) ? $instance['show_date'] : false;

	$r = new WP_Query( apply_filters( 'widget_posts_args', array(
		'posts_per_page'      => $number,
		'no_found_rows'       => true,
		'post_status'         => 'publish',
		'ignore_sticky_posts' => true,
		'meta_key' => 'wpb_post_views_count',//文章点击数key
		'orderby' => 'meta_value_num',//按文章点击数排序
		'order' => 'DESC',
	), $instance ) );

	if ( ! $r->have_posts() ) {
		return;
	}
	?>
	<?php echo $args['before_widget']; ?>
	<?php
	if ( $title ) {
		echo $args['before_title'] . $title . $args['after_title'];
	}
	?>
	<ul>
		<?php foreach ( $r->posts as $hot_post ) : ?>
			<?php
			$post_title = get_the_title( $hot_post->ID );
			$title      = ( ! empty( $post_title ) ) ? $post_title : __( '(no title)' );
			?>
			<li>
				<a href="<?php the_permalink( $hot_post->ID ); ?>"><?php echo $title ; ?></a>
				<?php if ( $show_date ) : ?>
					<span class="post-date"><?php echo get_the_date( '', $hot_post->ID ); ?></span>
				<?php endif; ?>
			</li>
		<?php endforeach; ?>
	</ul>
	<?php
	echo $args['after_widget'];
}

3、update()函数，对当前的 widget 实例参数做修改，在小工具管理界面中修改参数，比如热门文章的显示条数，代码如下：

public function update( $new_instance, $old_instance ) {
	$instance = $old_instance;
	$instance['title'] = sanitize_text_field( $new_instance['title'] );
	$instance['number'] = (int) $new_instance['number'];
	$instance['show_date'] = isset( $new_instance['show_date'] ) ? (bool) $new_instance['show_date'] : false;
	return $instance;
}

4、form()函数，对小工具的相关参数进行修改的用户界面，代码如下：

public function form( $instance ) {
	$title     = isset( $instance['title'] ) ? esc_attr( $instance['title'] ) : '';
	$number    = isset( $instance['number'] ) ? absint( $instance['number'] ) : 5;
	$show_date = isset( $instance['show_date'] ) ? (bool) $instance['show_date'] : false;
?>
	<p><label for="<?php echo $this->get_field_id( 'title' ); ?>"><?php _e( 'Title:' ); ?></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 $title; ?>" /></p>

	<p><label for="<?php echo $this->get_field_id( 'number' ); ?>"><?php _e( 'Number of posts to show:' ); ?></label>
	<input class="tiny-text" id="<?php echo $this->get_field_id( 'number' ); ?>" name="<?php echo $this->get_field_name( 'number' ); ?>" type="number" step="1" min="1" value="<?php echo $number; ?>" size="3" /></p>

	<p><input class="checkbox" type="checkbox"<?php checked( $show_date ); ?> id="<?php echo $this->get_field_id( 'show_date' ); ?>" name="<?php echo $this->get_field_name( 'show_date' ); ?>" />
	<label for="<?php echo $this->get_field_id( 'show_date' ); ?>"><?php _e( 'Display post date?' ); ?></label></p>
<?php
}

通过上面四个步骤就把 “热门文章” 小工具的代码写好了，如果要把小工具集成到wordpress 后台管理工具中，还需要对 “热门文章” 小工具进行注册，代码如下：

function register_hot_widget() {
    register_widget( 'WP_Widget_Hot_Posts' );
}
add_action( 'widgets_init', 'register_hot_widget' );

接下来，使用 wordpress 后台管理工具选择 “外观” – “主题编辑” 子菜单，在右边主题文件列表里选择模板函数（functions.php）， 滚动代码到尾部，把上面五个部分的所有代码添加到里面即可。

最后有一点要说明的是，热门文章是根据文章的点击量排序产生的，如何记录文章的阅览量，请参考另一篇文章《如何给 wordpress 添加文章阅览计数功能》。