Add author avatar to posts

Hi there!

I am struggling to add the post category into this though which is a bit frustrating.

Here’s how I would do it:

function homepage_grid( $post_html, $p, $instance ){

    $categories = get_the_category($p->id);
    $category_output = '';

    if ( !empty($categories) ) {

        $category_output = 'Posted under ';

        foreach( $categories as $category ) {
            $category_output .= '<a href="' . esc_url( get_category_link( $category->term_id ) ) . '" alt="' . esc_attr( sprintf( __( 'View all posts in %s' ), $category->name ) ) . '" rel="category tag">' . esc_html( $category->name ) . '</a>, ';
        }

		$category_output = rtrim( $category_output, ', ' );

    }

    $output = '
    <article class="one-fourth post" itemscope itemtype="http://schema.org/CreativeWork">
        <div class="post-grid-featured-image"><a href="' . get_the_permalink($p->id) . '" rel="bookmark">' . get_the_post_thumbnail( $p->id, 'small-post-image') . '</a></div>
        <div class="entry-content" itemprop="text">
            <h3 class="entry-title" itemprop="headline"><a href="' . get_the_permalink($p->id) . '" rel="bookmark">' . $p->title . '</a></h3>
            <div class="entry-author-info">
                <a href="' . get_author_posts_url( get_the_author_meta( 'ID' ), get_the_author_meta( 'user_nicename' ) ) . '">' . get_avatar( get_the_author_meta('email'), 50) . '</a><a href="' .  get_author_posts_url( get_the_author_meta( 'ID' ) ) . '">' . get_the_author_meta( 'display_name' ) .'</a>
            </div>
        </div>
        <footer>' . $category_output . '</footer>
    </article>';

    return $output;
}
add_action( 'wpp_post', 'homepage_grid', 10, 3 );

I have a list of posts in the footer widget and the sidebar widget. The above is to be displayed on the homepage, main content. Is there a way to separate these so the widgets have a list and homepage has the above?

Yep. The $instance variable includes a key called widget_id ($instance['widget_id']) that you can use to give each widget a different output. If your theme uses the id parameter in before_widget, you will be able to see the widget_id in the HTML output of your sidebar/footer (eg. <article id="wpp-1"> ... </article>).

Let’s say for example that your widgets have the IDs wpp-2 and wpp-3 being the former the one in the sidebar and the latter the one in the footer, and that you want the widget sidebar to use the “stock” HTML output while the one in the footer will have a custom HTML output:

function homepage_grid( $post_html, $p, $instance ){

    // This is the sidebar widget, let's use the stock HTML output
    if ( 'wpp-2' == $instance['widget_id'] ) {
        return $post_html;
    }

    // If we got here, then use a custom HTML output

    $categories = get_the_category($p->id);
    $category_output = '';

    if ( !empty($categories) ) {

        $category_output = 'Posted under ';

        foreach( $categories as $category ) {
            $category_output .= '<a href="' . esc_url( get_category_link( $category->term_id ) ) . '" alt="' . esc_attr( sprintf( __( 'View all posts in %s' ), $category->name ) ) . '" rel="category tag">' . esc_html( $category->name ) . '</a>, ';
        }

		$category_output = rtrim( $category_output, ', ' );

    }

    $output = '
    <article class="one-fourth post" itemscope itemtype="http://schema.org/CreativeWork">
        <div class="post-grid-featured-image"><a href="' . get_the_permalink($p->id) . '" rel="bookmark">' . get_the_post_thumbnail( $p->id, 'small-post-image') . '</a></div>
        <div class="entry-content" itemprop="text">
            <h3 class="entry-title" itemprop="headline"><a href="' . get_the_permalink($p->id) . '" rel="bookmark">' . $p->title . '</a></h3>
            <div class="entry-author-info">
                <a href="' . get_author_posts_url( get_the_author_meta( 'ID' ), get_the_author_meta( 'user_nicename' ) ) . '">' . get_avatar( get_the_author_meta('email'), 50) . '</a><a href="' .  get_author_posts_url( get_the_author_meta( 'ID' ) ) . '">' . get_the_author_meta( 'display_name' ) .'</a>
            </div>
        </div>
        <footer>' . $category_output . '</footer>
    </article>';

    return $output;

}
add_action( 'wpp_post', 'homepage_grid', 10, 3 );

Note that $instance[‘widget_id’] is only available to widgets. Neither the wpp_get_mostpopular() template tag nor the [wpp] shortcode have access to this variable.

The domain speakwp.com throws a 403 Forbidden error here, so I can’t see the site 😛