Archived topic
Tweak to Byline
5 replies · Started by Dave on June 1, 2021
Hi Guys,
I'm currently using the below code as a snippet to make my headshot appear next to my byline. I'm wondering if you can help me tweak it to do two things:
1. Add the word "By" in front, so it would read "By Dave Bowden" (or whatever the author's name is), instead of just the author's name.
2. Move either the image or the text so that the byline is aligned with the middle of the image, instead of the top of it.
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() )
)
);
echo $date;
echo '</span>';
} );
Hi there,
I would recommend replacing the snippet with a dynamic block element we've introduced in GPP 2.0 recently:
https://docs.generatepress.com/article/block-element-post-meta-template/
The template included should be relatively close to what you need and just need a little modification:
Let me know if this helps :)
Is there a way to get this effect without adding the block? I'm really concerned with site speed now that the new Google algorithm update has taken effect, and would prefer not to add a new plugin if possible.
Hi Dave,
Try this CSS:
.single-post .byline:before {
content: "by ";
}
.single-post .meta-data {
justify-content: center;
}That worked! Thanks so much.
You are welcome :)
