1

On a blog with pingbacks and trackbacks (pings) enabled I want to show just a link with link text and a favicon of the external site in a compact list: no date, no text.

How can I do that?

3

The first you do: separate regular comments and pingbacks. In your comments.php set the type parameter for both:

<ol class="commentlist">
<?php
// show regular comments
wp_list_comments(
    array (
        'type'     => 'comment',
        'style'    => 'ul'
    )
);
?></ol>

<ol class="pinglist">
<?php
// show pingbacks and trackbacks, short: "pings"
wp_list_comments(
    array (
        'type'     => 'pings',
        'style'    => 'ul'
    )
);
?></ol>

Now, there is a problem: You don’t want to print an empty <ol> if there are no approved pings.

So I let’s use a simple ping counter:

/**
 * Count amount of pingbacks + trackbacks for a post.
 *
 * @param int $post_id Post ID for comment query. Default is current post.
 * @return int
 */
function t5_count_pings( $post_id = NULL )
{
    $pings    = 0;
    $comments = FALSE;

    if ( NULL !== $post_id )
    {
        $comments = get_comments(
            array (
                'post_id' => $post_id, # Note: post_ID will not work!
                'status'  => 'approve'
            )
        );
    }
    elseif ( ! empty ( $GLOBALS['wp_query']->comments ) )
    {
        $comments = $GLOBALS['wp_query']->comments;
    }

    if ( ! $comments )
        return 0;

    foreach ( $comments as $c )
        if ( in_array ( $c->comment_type, array ( 'pingback', 'trackback' ) ) )
            $pings += 1;

    return $pings;
}

Now we wrap our ping list into a conditional:

if ( $num = t5_count_pings() )
{
?>
<h2 id="pingbacks"><?php
    printf( _n( 'One pingback', '%d pingbacks', $num, 't5_theme' ), $num );
?></h2>
<ol class="pinglist">
<?php
wp_list_comments(
    array (
        'type'     => 'pings',
        'style'    => 'ul'
    )
);
?></ol>
<?php
}

If t5_count_pings() returns a 0, PHP will read that like a FALSE and the list container will not be printed.

Now the formatting. wp_list_comments() accepts a parameter callback, and we can use that to render the content of each ping. I named mine t5_list_pings_callback() and add it like this:

wp_list_comments(
    array (
        'type'     => 'pings',
        'style'    => 'ul',
        'callback' => 't5_list_pings_callback'
    )
);

The content of this function is very simple:

/**
 * Callback for wp_list_comments( array ( 'type' => 'pings' ) )
 *
 * @param  object $comment
 * @return string
 */
function t5_list_pings_callback( $comment )
{
    $url     = esc_url( $comment->comment_author_url );
    $icon    = t5_external_favicon( $url );
    $name    = esc_html( $comment->comment_author );

    print "<li><a href='$url'>$icon $name</a>";
}

Two important notes:

  1. Do not add the closing </li>. WordPress will do that for you.
  2. We need a function t5_external_favicon(). Let’s ask Google.

.

/**
 * Get an img element for a favicon from Google.
 *
 * @param  string $url
 * @param  string $class class attribute
 * @param  int    $size
 * @param  string $alt
 * @return string
 */
function t5_external_favicon( $url, $class = 'icon', $size = 16, $alt = '' )
{
    $host     = parse_url( $url,  PHP_URL_HOST );
    $icon_url = "https://plus.google.com/_/favicon?domain=$host";

    return "<img class='$class' width='$size' height='$size' alt='$alt' src='$icon_url' />";
}

We use an empty alt attribute because the images are really just decoration. And the width and height should always be set, because some sites use really large icons.

And that’s it. This is how it looks on wpkrauts.com:

screenshot

|improve this answer|||||

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service, privacy policy and cookie policy

Not the answer you're looking for? Browse other questions tagged or ask your own question.