Customizing entry meta

Hi there,

do you have a link to the site with the meta already setup using the document you linked to?

Hi David,

Yes how do I send you a private message? I don't want to publicize the url yet.

Thank you

You can edit the original topic and use the Site URL field to share the link privately.

Hi David,

Yes found it and added the page/website! :)

-Lo

Try this instead.
PHP:

// Generate author image and link in separate containers
add_filter( 'generate_post_author_output', function() {
    return sprintf( ' <div class="author vcard">%4$s</div><div class="author-wrap"><span class="label">Written by</span><a href="%1$s" title="%2$s" rel="author"><span class="author-name" itemprop="name">%3$s</span></a></div>',
            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' ) )
    );
} );

// Filter meta items to display date and author
add_filter( 'generate_header_entry_meta_items', function() {
    return array(
        'date',
        'author',
    );
} );

// Filter post date to display latest date
add_filter( 'generate_post_date_output', function( $output, $time_string ) {
    $time_string = '<span class="label">Last updated: </span><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 = '<span class="label">Last updated</span><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( '<div class="posted-on">%s</div> ',
        $time_string
    );
}, 10, 2 );

CSS:

.entry-meta:not(footer),
.entry-meta .posted-on,
.entry-meta .author-wrap {
    display: flex;
}

.entry-meta {
    align-items: center;
    justify-content: center;
}

.entry-meta .posted-on,
.entry-meta .author-wrap {
    flex-direction: column;
    font-size: 16px;
    padding: 0 25px;
    flex: 1;
}

.entry-meta .posted-on {
    text-align: right;
}

.entry-meta .label {
    font-size: 14px;
    color: #aaa;
    margin-bottom: 0.25em;
}

.author img {
    width: 60px;
    height: 60px;
    border-radius: 50%;
    vertical-align: middle;
}

Dude, you're the man!! :)

It works!

Awesome - first go as well :)

Hey guys,

So the code provided by David works perfectly fine.

But is it also possible to add this to an element header?

One of these methods is required for PHP:
https://docs.generatepress.com/article/adding-php/

and this for CSS:
https://docs.generatepress.com/article/adding-css/

Hi Leo,

I already know how to add custom PHP/CSS. The code provided by David works.

What I would like to know is if (and how) I can add the output of the author meta - as provided by David - into an element header in order to have more control.

Does this Header Element example help:

https://docs.generatepress.com/article/page-hero-examples/#example-2