[Resolved] Author Pic in Byline

Home Forums Support Author Pic in Byline

  • This topic has 15 replies, 3 voices, and was last updated 5 months ago by Leo.
Viewing 15 posts - 1 through 15 (of 16 total)
  • Author
    Posts
  • #1283089
    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

    #1283117
    Leo
    Staff
    Customer Support

    Hi there,

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

    It should be a good starting point.

    #1283152
    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 );

    #1283391
    Tom
    Lead Developer
    Lead Developer

    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!

    #1283642
    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

    #1284535
    Tom
    Lead Developer
    Lead Developer

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

    Thanks!

    #1284768
    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 );

    #1285053
    Tom
    Lead Developer
    Lead Developer

    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 🙂

    #1285181
    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

    #1286003
    Tom
    Lead Developer
    Lead Developer

    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>';
    } );
    #1286875
    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

    #1287475
    Leo
    Staff
    Customer Support

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

    Edited Tom’s code to remove the link.

    #1288197
    gedosan

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

    Cheers

    #1288838
    Leo
    Staff
    Customer Support

    Try this CSS:

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

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

Viewing 15 posts - 1 through 15 (of 16 total)
  • You must be logged in to reply to this topic.