Align the Title to Middle of Thumbnail

Hi,

Thanks for opening a new topic.

Alright, can you please tell me how you’re adding the popular posts list to that page? Are you using a shortcode? Also, are you using the Block editor (a.k.a. Gutenberg)?

thanks hector.

adding with this shortcode: [wpp range=”last30days” limit=5 stats_views=0 order_by=”views” thumbnail_width=100 thumbnail_height=75 taxonomy=’category; post_tag’ term_id=’2′]

and yes, using Gutenberg builder with the Gutentor plugin.

Alright, please try this (untested so let me know the results):

1. Change your shortcode to:

[wpp range='last30days' limit=5 stats_views=0 order_by='views' thumbnail_width=100 thumbnail_height=75 taxonomy='category; post_tag' term_id='2' post_html='<li class="flex-popular-post">{thumb} {title}</li>']

2. Add these CSS rules to your website (either via Customizer or directly into your theme’s stylesheet):

.wpp-list li.flex-popular-post {
    display: flex;
    align-items: center;
    justify-content: flex-start;
}

.wpp-list li.flex-popular-post .wpp-thumbnail {
    margin-right: 1em;
}

Updated short code and CSS but doesn’t seem to work, also list is pulling in post from other categories now.

It doesn’t seem that the shortcode is being executed correctly. Are you adding the shortcode using the Shortcode block? Or are you pasting it directly into the page?

directly on the page, tried with the shortcode block now and that works!
thanks Héctor, much appreciated!

Awesome, thanks for reporting back ??

Have a nice day!