How To Create Custom Widgets


Sponsored Links




WordPress is the most Usable Publishing System I ever use and found, there are so many blogger and internet writer uses WordPress on they blog. WordPress has many free themes and plugins, the other reason is, they add nice featured such as widgets, with WordPress Widgets, we can add anything without touching the themes files, just drag and setting and done ;)

On this WP Tricks, I will show you, how to create Custom Widgets. This tricks written by Darren Hoyt and Ben Gillbanks, and original published on Darren Hyot Blog
Let’s Get Started, first open your functions.php theme and paste or re writes this code

class My_Widget extends WP_Widget {
	function My_Widget() {
		parent::WP_Widget(false, 'Our Test Widget');
	}
function form($instance) {
		// outputs the options form on admin
	}
function update($new_instance, $old_instance) {
		// processes widget options to be saved
		return $new_instance;
	}
function widget($args, $instance) {
		// outputs the content of the widget
	}
}
register_widget('My_Widget');

This code above, only add Example Custom Widget, without some setting and options activated, on the next tricks from Darren Hyot blog, They give example by writing Popular Post widget, let’s do it, below your code above add this code

<?php
class bm_widget_popularPosts extends WP_Widget {

	function bm_widget_popularPosts() {
		parent::WP_Widget(false, 'Popular Posts');
	}

	function widget($args, $instance) {
		$args['title'] = $instance['title'];
		bm_popularPosts($args);
	}

	function update($new_instance, $old_instance) {
		return $new_instance;
	}

	function form($instance) {
		$title = esc_attr($instance['title']);
?>
		<p><label for="<?php echo $this->get_field_id('title'); ?>"><?php _e('Title:'); ?> <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; ?>" /></label></p>
<?php
	}
 }
function bm_popularPosts($args = array(), $displayComments = TRUE, $interval = '') {

	global $wpdb;

	$postCount = 5;

	$request = 'SELECT *
		FROM ' . $wpdb->posts . '
		WHERE ';

	if ($interval != '') {
		$request .= 'post_date>DATE_SUB(NOW(), ' . $interval . ') ';
	}

	$request .= 'post_status="publish"
			AND comment_count > 0
		ORDER BY comment_count DESC LIMIT 0, ' . $postCount;

	$posts = $wpdb->get_results($request);

	if (count($posts) >= 1) {

		if (!isset($args['title']) {
			$args['title'] = 'Popular Posts';
		}

		foreach ($posts as $post) {
			wp_cache_add($post->ID, $post, 'posts');
			$popularPosts[] = array(
				'title' => stripslashes($post->post_title),
				'url' => get_permalink($post->ID),
				'comment_count' => $post->comment_count,
			);
		}

		echo $args['before_widget'] . $args['before_title'] . $args['title'] . $args['after_title'];
?>

		<ol>
<?php
		foreach ($popularPosts as $post) {
?>
			<li>
				<a href="<?php echo $post['url'];?>"><?php echo $post['title']; ?></a>
<?php
			if ($displayComments) {
?>
			(<?php echo $post['comment_count'] . ' ' . __('comments', BM_THEMENAME); ?>)
<?php
			}
?>
			</li>
<?php
		}
?>
		</ol>

<?php
		echo $args['after_widget'];
	}
}
?>

And done, you have Popular Post widget and with this similar tricks you can made more sophocated custom widget, such as add Google AdSense widget, Flickr widget, Recent Twitter widgets and Many more

Subscribe to Full RSS Feed

RSS FeedIf you thing this article useful, please consider subscribing to our RSS Feed or e-mail updates and stay updated with us. You can also follow @WPTricksNet on twitter for latest updates.

About WP Tricks

We are WordPress Family, we collected and writed useful tips and tricks for you WordPress. We share it for you...

Related Tips and Trick from Local Data and on The Net


5 Responses to How To Create Custom Widgets

  1. Pingback: designfloat.com

  2. WP GPL says:

    Custom Widget is the best solutions for theme developer to enhanced they theme. And This tricks is really useful.. thanks for share Widgets tricks.

  3. max says:

    thanks for the tips. really useful..

  4. Prashant says:

    thanks it really helped me a lot!!!!!!

  5. erdincgc says:

    Thanks for the nice article. I also wish to beware users that there must be one “)” more at line 46, so, instead of
    if (!isset($args['title'])

    there should be
    if (!isset($args['title']))

    cys

Leave a Reply

Your email address will not be published. Required fields are marked *

You may use these HTML tags and attributes: <a href="" title=""> <abbr title=""> <acronym title=""> <b> <blockquote cite=""> <cite> <code> <del datetime=""> <em> <i> <q cite=""> <strike> <strong>