Customize Flatsome Recent Posts Widget

 

This post is to provide customization for Flatsome Recent Posts Widget

---

By default the widget is only available to show recent posts by number, and it is limited if need do filtration for category, tag, author and etc..

By inserting following PHP codes into the Theme Editor under Appearance, and you can have a easy customized shortcode to be insert anywhere.

 

 

Step 1:

Adding the following PHP codes into Theme Editor.

function wpb_postsbycategory( $atts = array() ) {

// set up default parameters
// This is the shortcode handler, run default params when no variable, overwrite it when have params
extract(shortcode_atts(array(
‘category_name’ => ”,
‘posts_per_page’ => 5
), $atts));

// the query
// Along with the shortcode handler, add all variables into query
$the_query = new WP_Query( array(
‘category_name’ => $category_name,
‘posts_per_page’ => $posts_per_page
) );

// The Loop
if ( $the_query->have_posts() ) {
$string .= ‘<ul>’;
$is_first = ”;
while ( $the_query->have_posts() ) {
$the_query->the_post();
if ( empty($is_first) ) {
$string .= ‘<li class=”recent-blog-posts-li” style=”margin: 0;”>’;
$is_first = ‘First one is occupied’;
} else {
$string .= ‘<li class=”recent-blog-posts-li” style=”margin: 0; border-top: 1px solid #ececec;”>’;
}
$string .= ‘ <div class=”flex-row recent-blog-posts align-top pt-half pb-half”>
<div class=”flex-col mr-half”>
<div class=”badge post-date badge-small badge-outline”>
<div class=”badge-inner bg-fill”>’;
$string .= ‘<span class=”post-date-day”> ‘ . get_the_date(‘j’) . ‘</span><br/>’;
$string .= ‘<span class=”post-date-month is-xsmall”> ‘ . get_the_date(‘M’) . ‘</span>’;
$string .= ‘ </div>
</div>
</div>
<div class=”flex-col flex-grow”>’;
$string .= ‘<a href=”‘ . get_the_permalink() .'” title=”‘ . get_the_title() . ‘” rel=”bookmark”>’ . get_the_title() .'</a>’;
$string .= ‘<span class=”post_comments op-7 block is-xsmall”><a href=”‘ . get_the_permalink() .’#respond”></a></span>’;
$string .= ‘ </div>
</div>
</li>’;
}
} else {
// no posts found
}
$string .= ‘</ul>’;

return $string;

/* Restore original Post Data */
wp_reset_postdata();
}
// Add a shortcode
// This is the part naming your shortcode
add_shortcode(‘categoryposts’, ‘wpb_postsbycategory’);

Step 2:

Using the named shortcode eg. [categoryposts] anywhere.

[categoryposts] => Will run the default params

[categoryposts category_name=events] => Overwrite category_name & run default posts_per_page

[categoryposts category_name=events posts_per_page=5 ] => Overwrite all params

** To note that this is only available to show posts without showing thumbnails

Published by: Moses
If there is any other better way please let me know