How to create a Custom Widget in WordPress
<?php
//Create custom widget
class Custom_latest_post_Widget extends WP_Widget {
function __construct() {
parent::__construct(
'custom_latest_post_Widget', // Base ID
'Latest Post List', // Name
array('description' => __( 'Displays your latest posts. Outputs the post thumbnail, title and date per listing'))
);
}
function widget($args, $instance) { //output
extract( $args );
// these are the widget options
$title = apply_filters('widget_title', $instance['title']);
$numberOfListings = $instance['numberOfListings'];
$post_types = $instance['post_types'];
$thumbnail_image = $instance['thumbnail_image'];
$enable_excerpt = $instance['enable_excerpt'];
$excerpt_length = $instance['excerpt_length'];
$publish_date = $instance['publish_date'];
$read_more_link = $instance['read_more_link'];
$read_more_text = $instance['read_more_text'];
echo $before_widget;
// Check if title is set
if ( $title ) {
echo $before_title . $title . $after_title;
}
$this->getRealtyListings($numberOfListings, $post_types, $thumbnail_image, $enable_excerpt, $excerpt_length, $publish_date, $read_more_link, $read_more_text);
echo $after_widget;
}
function update($new_instance, $old_instance) {
$instance = $old_instance;
$instance['title'] = strip_tags($new_instance['title']);
$instance['post_types'] = strip_tags($new_instance['post_types']);
$instance['numberOfListings'] = strip_tags($new_instance['numberOfListings']);
$instance['thumbnail_image'] = strip_tags($new_instance['thumbnail_image']);
$instance['enable_excerpt'] = strip_tags($new_instance['enable_excerpt']);
$instance['excerpt_length'] = strip_tags($new_instance['excerpt_length']);
$instance['publish_date'] = strip_tags($new_instance['publish_date']);
$instance['read_more_link'] = strip_tags($new_instance['read_more_link']);
$instance['read_more_text'] = strip_tags($new_instance['read_more_text']);
return $instance;
}
// widget form creation
function form($instance) {
// Check values
if( $instance) {
$title = esc_attr($instance['title']);
$numberOfListings = esc_attr($instance['numberOfListings']);
$post_types = esc_attr($instance['post_types']);
$thumbnail_image = esc_attr($instance['thumbnail_image']);
$enable_excerpt = esc_attr($instance['enable_excerpt']);
$excerpt_length = esc_attr($instance['excerpt_length']);
$publish_date = esc_attr($instance['publish_date']);
$read_more_link = esc_attr($instance['read_more_link']);
$read_more_text = esc_attr($instance['read_more_text']);
} else {
$title = '';
$numberOfListings = '';
$post_types = '';
$thumbnail_image = '';
$enable_excerpt = '';
$excerpt_length = '';
$publish_date = '';
$read_more_link = '';
$read_more_text = '';
}
?>
<p>
<label for="<?php echo $this->get_field_id('title'); ?>"><?php _e('Title', 'custom_latest_post_Widget'); ?></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_types'); ?>"><?php _e('Post Type:', 'custom_latest_post_Widget'); ?></label>
<select id="<?php echo $this->get_field_id('post_types'); ?>" name="<?php echo $this->get_field_name('post_types'); ?>">
<?php $post_types_array = array('post', 'news', 'product');
foreach($post_types_array as $single_post_types){ ?>
<option <?php echo $single_post_types == $post_types ? 'selected="selected"' : '';?> value="<?php echo $single_post_types;?>"><?php echo $single_post_types; ?></option>
<?php } ?>
</select>
</p>
<p>
<label for="<?php echo $this->get_field_id('numberOfListings'); ?>"><?php _e('Number of Listings:', 'custom_latest_post_Widget'); ?></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>
<p>
<label for="<?php echo $this->get_field_id('thumbnail_image'); ?>"><?php _e('Show Thumbnail Image : ', 'custom_latest_post_Widget'); ?></label>
<input class="widefat" id="<?php echo $this->get_field_id('thumbnail_image'); ?>" type="checkbox" name="<?php echo $this->get_field_name('thumbnail_image'); ?>" <?php if((!empty($thumbnail_image)) && ($thumbnail_image == 'thumb_image')){echo 'checked';}?> value="thumb_image">
</p>
<p>
<label for="<?php echo $this->get_field_id('enable_excerpt'); ?>"><?php _e('Enable Excerpt : ', 'custom_latest_post_Widget'); ?></label>
<input class="widefat" id="<?php echo $this->get_field_id('enable_excerpt'); ?>" type="checkbox" name="<?php echo $this->get_field_name('enable_excerpt'); ?>" <?php if((!empty($enable_excerpt)) && ($enable_excerpt == 'show_excerpt')){echo 'checked';}?> value="show_excerpt">
</p>
<p>
<label for="<?php echo $this->get_field_id('excerpt_length'); ?>"><?php _e('Excerpt Length:', 'custom_latest_post_Widget'); ?></label>
<select id="<?php echo $this->get_field_id('excerpt_length'); ?>" name="<?php echo $this->get_field_name('excerpt_length'); ?>">
<?php for($x=10;$x<=150;$x=$x+10): ?>
<option <?php echo $x == $excerpt_length ? 'selected="selected"' : '';?> value="<?php echo $x;?>"><?php echo $x; ?></option>
<?php endfor;?>
</select>
</p>
<p>
<label for="<?php echo $this->get_field_id('publish_date'); ?>"><?php _e('Publish Date : ', 'custom_latest_post_Widget'); ?></label>
<input class="widefat" id="<?php echo $this->get_field_id('publish_date'); ?>" type="checkbox" name="<?php echo $this->get_field_name('publish_date'); ?>" <?php if((!empty($publish_date)) && ($publish_date == 'date')){echo 'checked';}?> value="date">
</p>
<p>
<label for="<?php echo $this->get_field_id('read_more_link'); ?>"><?php _e('Read More Link : ', 'custom_latest_post_Widget'); ?></label>
<input class="widefat" id="<?php echo $this->get_field_id('read_more_link'); ?>" type="checkbox" name="<?php echo $this->get_field_name('read_more_link'); ?>" <?php if((!empty($read_more_link)) && ($read_more_link == 'more_link')){echo 'checked';}?> value="more_link">
</p>
<p>
<label for="<?php echo $this->get_field_id('read_more_text'); ?>"><?php _e('Read More Text : ', 'custom_latest_post_Widget'); ?></label>
<input class="widefat" id="<?php echo $this->get_field_id('read_more_text'); ?>" name="<?php echo $this->get_field_name('read_more_text'); ?>" type="text" value="<?php echo $read_more_text; ?>" placeholder="Read More" />
</p>
<?php
}
function getRealtyListings($numberOfListings, $post_types, $thumbnail_image, $enable_excerpt, $excerpt_length, $publish_date, $read_more_link, $read_more_text) { //html
global $post;
add_image_size( 'custom_latest_post_Widget_size', 85, 45, false );
/*
if($post_types == 'product'){
$tax_query = array(array('taxonomy' => 'products_type','field' => 'slug','terms' => 'market-reports'));
}else{
$tax_query = '';
}
*/
$args = array(
'post_type' => $post_types,
'posts_per_page' => $numberOfListings,
//'tax_query' => $tax_query
);
$listings = new WP_Query($args);
//$listings->query('post_type='.$post_types.'&posts_per_page=' . $numberOfListings . $new_var );
if($listings->found_posts > 0) {
echo '<ul class="custom_latest_post_Widget">';
while ($listings->have_posts()) {
$listings->the_post();
$image = (has_post_thumbnail($post->ID)) ? get_the_post_thumbnail($post->ID, 'realty_widget_size') : '<div class="noThumb"></div>';
$listItem = '<li>';
if(!empty($thumbnail_image)){
$listItem .= '<div class="list_left_thumb">';
$listItem .= $image;
$listItem .= '</div>';
}
$listItem .= '<div class="list_right_thumb">';
$listItem .= '<a href="' . get_permalink() . '">';
$listItem .= get_the_title() . '</a>';
if(!empty($enable_excerpt)){
if(!empty($excerpt_length)){
$length = $excerpt_length;
}else{
$length = 100;
}
$listItem .= '<div class="list_excerpt">';
$listItem .= substr(get_the_excerpt(), 0, $length).'...';
$listItem .= '</div>';
}
if(!empty($publish_date)){
$listItem .= '<div class="list_publish_date">'.date('M d Y', strtotime(get_the_date())).'</div>';
}
if(!empty($read_more_link)){
$listItem .= '<div class="list_link"><a href="'.get_the_permalink().'">';
if(!empty($read_more_text)){
$listItem .= $read_more_text;
}else{
$listItem .= 'Read More';
}
$listItem .= '</a></div>';
}
$listItem .= '</div>';
$listItem .= '</li>';
echo $listItem;
}
echo '</ul>';
wp_reset_postdata();
}else{
echo '<p style="padding:25px;">No listing found</p>';
}
}
} //end class custom_latest_post_Widget
register_widget('Custom_latest_post_Widget');
?>
