Archived topic
Add read time to blog overview
6 replies · Started by Max on November 30, 2022
Hi there!
I'm using this code to add the read time to my blog posts;
function tu_estimated_reading_time() {
$post = get_post();
$content = $post->post_content;
$wpm = 238; // How many words per minute.
$clean_content = strip_shortcodes( $content );
$clean_content = strip_tags( $clean_content );
$word_count = str_word_count( $clean_content );
$m = ceil( $word_count / $wpm );
if($m < 2) {
$time = '1 min';
} else {
$time = $m . ' min';
}
return $time;
}
add_filter( 'generate_post_date_output', function( $output ) {
$output .= '<span class="read-time">— ' . tu_estimated_reading_time() . ' read</span>';
return $output;
} );How can I add the read time to the blog post overview as well?
I've used an element to modify the overview: https://jmp.sh/wzsZJiWD
Thanks!
Hi there,
add this to your PHP Snippets:
add_filter( 'render_block', function( $block_content, $block ) {
if (
!is_admin()
&& ! empty( $block['attrs']['className'] )
&& 'reading-time' === $block['attrs']['className']
){
$block_content = '<span class="read-time">— ' . tu_estimated_reading_time() . ' read</span>';
}
return $block_content;
}, 10, 2 );Then edit your Block Element, add a Headline block with some static text eg. read time and in Advanced > Additional CSS Class(es) add: reading-time
The above snippet will swap headline blocks content for the reading time.
Hey David, thanks for the code!
I've tried adding your code to the bottom of the read-time snippet, and also creating a new snippet based on it, but I get this error in both cases;
The snippet has been deactivated due to an error on line 0:
Parse error: syntax error, unexpected end of snippetAnything I'm doing wrong?
Ahh, I found a tiny error in your code. The correct version is;
add_filter( 'render_block', function( $block_content, $block ) {
if (
!is_admin()
&& ! empty( $block['attrs']['className'] )
&& 'reading-time' === $block['attrs']['className']
){
$block_content = '<span class="read-time">— ' . tu_estimated_reading_time() . ' read</span>';
}
return $block_content;
}, 10, 2 );It did replace the text, but it's now underneath the updated date: https://jmp.sh/fYMrtVoN
Is it possible to add it right after the date?
Updated: 15 November 2022 — 6 min read
Instead of
Updated: 15 November 2022
— 6 min readOh i am sorry about that - hell knows i didn't check that!
Whilst in a GP Element - if you add a Container Block it has the Inline post meta items option.
So add a container and place your meta headline blocks inside that and check the Inline post meta items
Thanks, that did the trick! Looks great now! Much appreciated.
Looks great - i like the site design very much :)
Glad to be of help.!
