Shortcode Layout | WordPress.org

Hi there!

Yes, it can be done. Please share again your shortcode (make sure to use the Code block to insert it here) and I’ll show you how.

[wpp range="last24hours stats_views=0 cat="-9227' thumbnail_width=105 thumbnail_height=75 limit=6 stats_date=1 stats_date=1 stats_date_format="j F Y" post_html="<li>{thumb} {title} <br><span class="date-span">{date}</span></li>"]

Alright, try changing your shortcode to this:

[wpp range="last24hours" stats_views=0 cat="-9227" thumbnail_width=105 thumbnail_height=75 limit=6 stats_date=1 stats_date_format="j F Y" post_html="<li><div class="thumbnail-container">{thumb}</div> <div class="popular-post-details">{title} <br><span class="date-span">{date}</span></div></li>"]

… and then add these CSS rules to your site:

.wpp-list p:empty {
	display: none;
}

.wpp-list li {
	display: flex;
	justify-content: flex-start;
}

.wpp-list li .thumbnail-container {
	width: 105px; /* img width */
	margin-right: 10px;
}

.wpp-list li .thumbnail-container img {
	float: none;
	width: 100%;
	height: auto;
}

.wpp-list li .popular-post-details {
	width: calc(100% - 105px - 10px); /* img width - margin */
}