This post is about how to Create a most viewed widget for wordpress blog?
This can be done in two steps.
- Create a meta field with each post and store a view count whenever a user see your single bog post.
- Create a widget which get top posts order by your meta field.
STEP 1: Create a meta field
Add below code in single.php inside of the loop.
if(empty($views)){$views=1;}else{$views++;}
update_post_meta( get_the_id(), ‘views’, $views++);
What does it do?
This creates a meta field key ‘views’ and stores its value with each post. When you put this code on single.php whenever a user opens a post it will update ‘view’ by adding 1.
If there is no views at the time it will make it 1 for first time. you can echo $views and see the value increasing with each refresh over single post.
STEP 2: Create a widget for most viewed post.
Add below code to the functions.php
function __construct() {
parent::__construct(
‘sim_most_viewed_widget’, // Base ID
‘Most Viewed Posts’, // Name
array(‘description’ => __( ‘Displays your popular posts’))
);
}
function update($new_instance, $old_instance) {
$instance = $old_instance;
$instance[‘title’] = strip_tags($new_instance[‘title’]);
$instance[‘post_type’] = strip_tags($new_instance[‘post_type’]);
$instance[‘numberOfListings’] = strip_tags($new_instance[‘numberOfListings’]);
return $instance;
}
function form($instance) {
if( $instance) {
$title = esc_attr($instance[‘title’]);
$post_type = esc_attr($instance[‘post_type’]);
$numberOfListings = esc_attr($instance[‘numberOfListings’]);
} else {
$title = ”;
$post_type = ”;
$numberOfListings = ”;
}
?>
<p>
<label for=”<?php echo $this->get_field_id(‘title’); ?>”><?php _e(‘Title’, ‘sim_most_viewed’); ?></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(‘post_type’); ?>”><?php _e(‘Post Type’, ‘sim_most_viewed’); ?></label>
<input class=”widefat” id=”<?php echo $this->get_field_id(‘post_type’); ?>” name=”<?php echo $this->get_field_name(‘post_type’); ?>” type=”text” value=”<?php echo $post_type; ?>” />
</p>
<p>
<label for=”<?php echo $this->get_field_id(‘numberOfListings’); ?>”><?php _e(‘Number of Listings:’, ‘sim_most_viewed’); ?></label>
<select id=”<?php echo $this->get_field_id(‘numberOfListings’); ?>” name=”<?php echo $this->get_field_name(‘numberOfListings’); ?>”>
<?php for($x=1;$x<=10;$x++): ?>
<option <?php echo $x == $numberOfListings ? ‘selected=”selected”‘ : ”;?> value=”<?php echo $x;?>”><?php echo $x; ?></option>
<?php endfor;?>
</select>
</p>
<?php
}
function widget($args, $instance) {
extract( $args );
$title = apply_filters(‘widget_title’, $instance[‘title’]);
$numberOfListings = $instance[‘numberOfListings’];
echo $before_widget;
if ( $title ) {
echo $before_title . $title . $after_title;
}
$this->getMostViewedListings($numberOfListings);
echo $after_widget;
}
function getMostViewedListings($numberOfListings) {
global $post;
add_image_size( ‘sim_most_viewed_widget_size’, 85, 45, false );
$listings = new WP_Query( array(
‘post_type’ => ‘post’,
‘meta_key’ => ‘views’,
‘orderby’ => ‘meta_value_num’,
‘posts_per_page’ => $numberOfListings
) );
if($listings->found_posts > 0) {
echo ‘<ul class=”sim_most_viewed_widget”>’;
while ($listings->have_posts()) {
$listings->the_post();
$image = (has_post_thumbnail($post->ID)) ? get_the_post_thumbnail($post->ID, ‘sim_most_viewed_widget_size’) : ‘<div class=”noThumb”></div>’;
$listItem = ‘<li>’ . $image;
$listItem .= ‘<a href=”‘ . get_permalink() . ‘”>’;
$listItem .= get_the_title() . ‘</a>’;
$listItem .= ‘<span>Added ‘ . get_the_date() . ‘</span></li>’;
echo $listItem;
}
echo ‘</ul>’;
wp_reset_postdata();
}else{
echo ‘<p style=”padding:25px;”>No listing found</p>’;
}
}
} //end class
register_widget(‘Sim_Most_Viewed_Widget’);
Now you can see a widget ‘Most Viewed Posts’ in widget listing. Add it to desired place.