[Resolved] Author Pic in Byline

[gedosan]

Hi Guys

Bit of help needed for my author byline please guys.

First, I’d like to get my author bio picture appearing…

I’ve actually got a bit PHP that you shared a while ago, but when I apply it, it looks all messed up:

add_filter( ‘generate_post_author_output’, ‘tu_add_author_gravatar’ );
function tu_add_author_gravatar() {
printf( ‘ <span class=”byline”>%1$s</span>’,
sprintf( ‘<span class=”author vcard” itemtype=”http://schema.org/Person&#8221; itemscope=”itemscope” itemprop=”author”>%1$s %5$s<span class=”author-name” itemprop=”name”>%4$s</span></span>’,
__( ‘by’,’generatepress’),
esc_url( get_author_posts_url( get_the_author_meta( ‘ID’ ) ) ),
esc_attr( sprintf( __( ‘View all posts by %s’, ‘generatepress’ ), get_the_author() ) ),
esc_html( get_the_author() ),
get_avatar( get_the_author_meta( ‘ID’ ) )
)
);
}

Soooo. I’d like it, if possible, to be:

Author pic on left (in a circular image)
Then next to it, to the right ‘Written by: Author’ and underneath that ‘Last Updated: Date’

Thanks!
Ged

[Leo]

Hi there,

Have you checked out this page?
https://docs.generatepress.com/article/entry-meta-style/

It should be a good starting point.

[gedosan]

Cool – got it half way there. I’d like the ‘Last Updated Date’ to take the place of where the published date is (ie. can we get the last updated date under the written by author’?. Possible?

The PHP for the last updated is here by the way:

add_filter( ‘generate_post_date_output’, function( $output, $time_string ) {
$time_string = ‘<time class=”entry-date published” datetime=”%1$s” itemprop=”datePublished”>%2$s</time>’;

if ( get_the_time( ‘U’ ) !== get_the_modified_time( ‘U’ ) ) {
$time_string = ‘<time class=”entry-date updated-date” datetime=”%3$s” itemprop=”dateModified”>%4$s</time>’;
}

$time_string = sprintf( $time_string,
esc_attr( get_the_date( ‘c’ ) ),
esc_html( get_the_date() ),
esc_attr( get_the_modified_date( ‘c’ ) ),
esc_html( get_the_modified_date() )
);

return sprintf( ‘<span class=”posted-on”>%s</span> ‘,
$time_string
);
}, 10, 2 );

[Tom]

Hi there,

Just to confirm, are you wanting the updated date to appear directly below the published date? Can you share the current code you’re using?

Thanks!

[gedosan]

Hey Tom,

No, so I don’t want the published date to appear at all.

So author pic on the left, on the right ‘Written by Author’ and below that ‘Last Updated: May 14, 2020’

Cheers

[Tom]

Would the published date display if there is no updated date? Can you share your current code so I can modify it?

Thanks!

[gedosan]

Here’s the code for the last modified date that’s currently on my site (which incidentally was shared above already, maybe you missed it).

To avoid any confusion, I’ve shared another site above that already has the byline the way I want mine. I’ve added it after my URL…Cheers!

—-

add_filter( ‘generate_post_date_output’, function( $output, $time_string ) {
$time_string = ‘<time class=”entry-date published” datetime=”%1$s” itemprop=”datePublished”>%2$s</time>’;

if ( get_the_time( ‘U’ ) !== get_the_modified_time( ‘U’ ) ) {
$time_string = ‘<time class=”entry-date updated-date” datetime=”%3$s” itemprop=”dateModified”>%4$s</time>’;
}

$time_string = sprintf( $time_string,
esc_attr( get_the_date( ‘c’ ) ),
esc_html( get_the_date() ),
esc_attr( get_the_modified_date( ‘c’ ) ),
esc_html( get_the_modified_date() )
);

return sprintf( ‘<span class=”posted-on”>%s</span> ‘,
$time_string
);
}, 10, 2 );

[Tom]

Sorry, I meant the code you’re using the avatar and published date. That way I can tweak it to display the updated date instead 🙂

[gedosan]

Oh right, that code I took from your page (that Leo recommended above) > https://docs.generatepress.com/article/entry-meta-style/

We’ll get there in the end 😉

Cheers
Ged

[Tom]

We always do! 🙂

Let’s try this, instead:

add_filter( 'generate_post_author', '__return_false' );
add_filter( 'generate_post_date_output', function( $date ) {
    printf( 
        '<span class="meta-gravatar">%s</span>',
        get_avatar( get_the_author_meta( 'ID' ) )
    );

    echo '<span class="meta-data">';

    printf( ' <span class="byline">%1$s</span>',
        sprintf( '<span class="author vcard" itemtype="http://schema.org/Person" itemscope="itemscope" itemprop="author"><span class="author-name" itemprop="name">%3$s</span></span>',
            esc_url( get_author_posts_url( get_the_author_meta( 'ID' ) ) ),
            esc_attr( sprintf( __( 'View all posts by %s', 'generatepress' ), get_the_author() ) ),
            esc_html( get_the_author() )
        )
    );

    $time_string = '<time class="entry-date published" datetime="%1$s" itemprop="datePublished">%2$s</time>';

    $updated_time = get_the_modified_time( 'U' );
    $published_time = get_the_time( 'U' ) + 86400;

    if ( $updated_time > $published_time ) {
        $time_string = '<time class="entry-date updated-date" datetime="%3$s" itemprop="dateModified">%4$s</time>';
    }

    $time_string = sprintf( $time_string,
        esc_attr( get_the_date( 'c' ) ),
        esc_html( get_the_date() ),
        esc_attr( get_the_modified_date( 'c' ) ),
        esc_html( get_the_modified_date() )
    );

    printf( '<span class="posted-on">%s</span> ',
        $time_string
    );

    echo '</span>';
} );

[gedosan]

Cool, works great! Couple of small things…how do I reduce the space under it (to bring the featured image up a bit)? and how can I stop the author being a link?

Cheers

[Leo]

This option should work for the space:
https://docs.generatepress.com/article/content-separator/

Edited Tom’s code to remove the link.

[gedosan]

Thanks – as far as I can see that only reduces the space underneath the featured image not above it?

Cheers

[Leo]

Try this CSS:

.post-image-below-header.post-image-aligned-center .inside-article .featured-image {
    margin-top: 1em;
}

[gedosan]

Thanks guys for all your help, just remembered I never closed this thread. Cheers

[Author]

Posts