[Resolved] Data, title and read time

[Angelica]

I am trying to get Ghost’s style on my GP blog. I want my post list to look like: https://edition.ghost.io/tag/startup/

I somewhat managed it: https://angelcosta.com.br/

But the css it weird in small devices. Here is my code:

add_action( 'generate_before_entry_title', function() {
        echo '<div class="entry-meta">';
            generate_do_post_meta_item( 'date' );
        echo '</div>';
} );

add_action( 'generate_after_entry_title', function() {
        echo '<div class="entry-meta tempo-leitura">';
        echo  tu_estimated_reading_time();
        echo '</div>';
} );

function tu_estimated_reading_time() {

	$post = get_post();
	$conteudo = strip_tags( strip_shortcodes( $post->post_content ) );
	$words = str_word_count( $conteudo );
	$minutes = ceil( $words / 200 );
	if ($minutes < 2) {
		$estimated_time = '1 min';
	}
	else {
		$estimated_time = $minutes . ' min';
	}
	return $estimated_time;

}

And my css:

.inside-article {border-bottom:1px solid #eee; padding:0; vertical-align:middle;line-height: 1.0; height:40px; margin-bottom:10px }
.entry-meta, .entry-title {display:inline-block; }
.entry-meta {margin-right:15px; color:#AC1406}
@media (max-width:768px)  { 

}
.tempo-leitura {display:inline-block; float:right; color:#ccc}

h1.entry-title {
	text-align:center;
}

[Fernando]

Hi Angelica,

Out of curiosity, why not use a Block Element – Content Template and GenerateBlocks to create such a design?

Reference to Content Templates: https://docs.generatepress.com/article/block-element-content-template/

[Angelica]

Because sometimes I forget how awesome GP is.

I also hate the Guttenberg Editor and had it disabled.

But I think you gave me a new idea. I’m gonna have the block in the home page ( I wanted the same look for archives) and gonna have thumbnails for the archive now.

[David]

Hi there,

do you need any assistance with that ?

[Angelica]

Yes, I actually think I need help now…

The minimal version is for the archives and miniatures for the home page only. What is the best way to achieve that?

[Fernando]

Hi Angelica,

Yes, we can help you. First, may we know how you’re adding the “estimated reading time” of the blogs? Are you using a plugin and a Shortcode for that?

[Author]

Posts