I am using YARPP for my site so I modified the default YARPP template to make it look more like the “Recent Posts” shortcode.

1. Use this code to replace the content of “yarpp-template-example.php”
2. Select “X Theme” as your YARPP template file.
3. Enjoy 🙂

<?php 
/*
YARPP Template: X Theme
Author: Roman Lifshits
Description: X Theme YARPP template.
*/
?><h3>Related Posts</h3>
<?php
$yarpp = "<div class=\"x-recent-posts cf man\" style=\"text-align: right;\" data-x-element=\"recent_posts\" data-x-params=\"{&quot;fade&quot;:false}\" data-fade=\"false\">";

if (have_posts()) : while (have_posts()) : the_post();

	$image			= wp_get_attachment_image_src( get_post_thumbnail_id(), 'entry-cropped' );
	$bg_image		= ( $image[0] != '' ) ? ' style="background-image: url(' . $image[0] . ');"' : '';
	$image_yarpp		= '<div class="x-recent-posts-img"' . $bg_image . '></div>';
	$image_yarpp_class	= 'with-image';
	  
	$yarpp .= '<a class="x-recent-post4 ' . $image_yarpp_class . '" href="' . get_permalink( get_the_ID() ) . '" title="' . esc_attr( sprintf( __( 'Permalink: "%s"', csl18n() ), the_title_attribute( 'echo=0' ) ) ) . '">'
			. '<article id="post-' . get_the_ID() . '" class="' . implode( ' ', get_post_class() ) . '">'
			 . '<div class="entry-wrap">'
			   . $image_yarpp
			   . '<div class="x-recent-posts-content">'
				. '<h3 class="h-recent-posts">' . get_the_title() . '</h3>'
				. '<span class="x-recent-posts-date">' . get_the_date() . '</span>'
			   . '</div>'
			 . '</div>'
			. '</article>'
		   . '</a>';

endwhile; endif;

$yarpp .= '</div>';
echo $yarpp;
?>

This was a public service announcement. Enjoy 🙂

– Roman

Thank you so much. Have a wonderful day!.