<Brooke> <Codes>

The Tech Blog of Brooke.

Simple Portfolio Widget

Note: This post refers to code and a project from many years ago 😱. The content was edited in March of 2025 to remove dead links, improve clarity, or fix formatting, but no other edits were made. Enjoy this time capsule into the past.

Hi, I just wrote a simple portfolio widget and thought I would share. This code uses Justin Tadlock’s get_the_image plugin and custom widget code to display the featured image based on tag or post type.

Just drop this into your functions.php or create a plugin to see it in action

if ( function_exists( 'add_image_size' ) ) {
add_image_size( 'sidebar-thumb', 75,75,true   );

}
class PortfolioWidget extends WP_Widget
{
function PortfolioWidget()
{
$widget_ops = array('classname' => 'PortfolioWidget', 'description' => 'Displays a list of thumbnails for portfolio pieces in the sidebar' );
$this->WP_Widget('PortfolioWidget', 'Portfolio Thumbnails', $widget_ops);
}

function form($instance)
{
$instance = wp_parse_args( (array) $instance, array( 'title' => '','tags' => '', 'post_type' => '' ) );

$title = $instance['title'];
$tags = $instance['tags'];
$post_type = $instance['post_type'];
?>

<p><label for="<?php echo $this->get_field_id('title'); ?>">Title: <input id="<?php echo $this->get_field_id('title'); ?>" name="<?php echo $this->get_field_name('title'); ?>" type="text" value="<?php echo attribute_escape($title); ?>" /></label></p>
<p><label for="<?php echo $this->get_field_id('tags'); ?>">Tags: <input id="<?php echo $this->get_field_id('tags'); ?>" name="<?php echo $this->get_field_name('tags'); ?>" type="text" value="<?php echo attribute_escape($tags); ?>" /></label></p>
<p><label for="<?php echo $this->get_field_id('post_type'); ?>">Post Types: <input id="<?php echo $this->get_field_id('post_type'); ?>" name="<?php echo $this->get_field_name('post_type'); ?>" type="text" value="<?php echo attribute_escape($post_type); ?>" /></label></p>
<?php
}

function update($new_instance, $old_instance)

{
$instance = $old_instance;
$instance['title'] = $new_instance['title'];
$instance['tags'] =  $new_instance['tags'];
$instance['post_type'] = $new_instance['post_type'];

return $instance;
}

function widget($args, $instance)
{
extract($args, EXTR_SKIP);

echo $before_widget;
$title = empty($instance['title']) ? '' : apply_filters('widget_title', $instance['title']);
$tags = empty($instance['tags']) ? '' : wp_parse_id_list($instance['tags']);
$post_type = empty($instance['post_type']) ? '' : preg_split( '/[s,]+/',strtolower($instance['post_type']));

if (!empty($title))
echo $before_title . $title . $after_title;

$query = new WP_Query( array( 'post_type' => $post_type, 'tag_id' => $tags  ) );
while ( $query->have_posts() ) : $query->the_post();
echo get_the_image( array( 'meta_key' => 'Thumbnail','size' => 'sidebar-thumb') );
endwhile;
wp_reset_postdata();
echo $after_widget;
}

}

Let me know your thoughts or if you have any questions. If there is a large intrest I may post a complete write up and example with images.

Brooke.

,
0