Below, you’ll find a detailed guide on how to add the WP Responsive Recent Post Slider/Carousel Shortcodes to your WordPress website, including their parameters, examples, and PHP function code. Additionally, we’ll assist you with common issues that might cause the WP Responsive Recent Post Slider/Carousel Plugin shortcodes not to show or not to work correctly.
Before starting, here is an overview of the WP Responsive Recent Post Slider/Carousel Plugin and the shortcodes it provides:
"WP Responsive Recent Post Slider/Carousel is a versatile WordPress plugin designed to showcase your latest posts in an engaging slider or carousel format, fully optimized for all device screens."
- [recent_post_carousel]
- [recent_post_slider]
[recent_post_carousel] Shortcode
The wp-responsive-recent-post-slider plugin shortcode is a tool that displays recent posts in a responsive carousel format. It allows customization of the carousel’s appearance and functionality. It adjusts the number of posts, design, category, content display, and scrolling options. It also includes settings for autoplay and speed. This shortcode ensures compatibility with various page builders by not displaying previews during editing. It also supports RTL languages.
Shortcode: [recent_post_carousel]
Parameters
Here is a list of all possible recent_post_carousel shortcode parameters and attributes:
limit
– sets the maximum number of posts to displaydesign
– specifies the design template to usecategory
– filters the posts by categoryshow_date
– decides whether to show the post dateshow_category_name
– determines if the category name is shownshow_content
– controls whether the post content is displayedcontent_words_limit
– sets the word limit for post contentslides_to_show
– sets the number of slides to show at onceslides_to_scroll
– determines the number of slides to scrolldots
– enables or disables navigation dotsarrows
– enables or disables navigation arrowsautoplay
– controls whether the slides play automaticallyautoplay_interval
– sets the interval between auto-played slidesspeed
– controls the speed of the slide transitionhide_post
– hides specific posts based on their IDsposts
– displays specific posts based on their IDspost_type
– sets the type of post to displaytaxonomy
– sets the taxonomy to filter postsshow_author
– decides whether to show the post authorshow_read_more
– controls whether the “Read More” link is shownmedia_size
– sets the size of the post’s featured imagertl
– enables or disables right-to-left layoutlazyload
– defines the type of lazy loading, if anyclassName
– adds custom class names to the slider’s containeralign
– sets the alignment of the sliderextra_class
– adds extra class names to the slider’s container
Examples and Usage
Basic example – Showcases a simple usage of the shortcode to display a recent post carousel.
[recent_post_carousel limit="5" design="design-1" category="news" show_date="true" show_category_name="true" show_content="true"]
Advanced examples
Display a recent post carousel with specific settings such as autoplay, scroll speed, and custom word limit for content.
[recent_post_carousel limit="10" design="design-2" category="sports, tech" show_date="true" show_category_name="true" show_content="true" content_words_limit="30" slides_to_show="3" slides_to_scroll="1" dots="true" arrows="true" autoplay="true" autoplay_interval="3000" speed="500"]
Display a recent post carousel with additional parameters such as post type, taxonomy, media size, and alignment.
[recent_post_carousel limit="5" design="design-1" category="news" show_date="true" show_category_name="true" show_content="true" post_type="post" taxonomy="category" media_size="full" align="center"]
PHP Function Code
In case you have difficulties debugging what causing issues with [recent_post_carousel]
shortcode, check below the related PHP functions code.
Shortcode line:
add_shortcode('recent_post_carousel', 'wprps_post_carousel');
Shortcode PHP function:
function wprps_post_carousel( $atts, $content = null ) {
// Taking some global
global $post;
// SiteOrigin Page Builder Gutenberg Block Tweak - Do not Display Preview
if( isset( $_POST['action'] ) && ($_POST['action'] == 'so_panels_layout_block_preview' || $_POST['action'] == 'so_panels_builder_content_json') ) {
return "[recent_post_carousel]";
}
// Divi Frontend Builder - Do not Display Preview
if( function_exists( 'et_core_is_fb_enabled' ) && isset( $_POST['is_fb_preview'] ) && isset( $_POST['shortcode'] ) ) {
return '<div class="wppsac-builder-shrt-prev">
<div class="wppsac-builder-shrt-title"><span>'.esc_html__('Recent Carousel View', 'wp-responsive-recent-post-slider').'</span></div>
recent_post_carousel
</div>';
}
// Fusion Builder Live Editor - Do not Display Preview
if( class_exists( 'FusionBuilder' ) && (( isset( $_GET['builder'] ) && $_GET['builder'] == 'true' ) || ( isset( $_POST['action'] ) && $_POST['action'] == 'get_shortcode_render' )) ) {
return '<div class="wppsac-builder-shrt-prev">
<div class="wppsac-builder-shrt-title"><span>'.esc_html__('Recent Carousel View', 'wp-slick-slider-and-image-carousel').'</span></div>
recent_post_carousel
</div>';
}
extract(shortcode_atts(array(
'limit' => 10,
'design' => 'design-1',
'category' => '',
'show_date' => 'true',
'show_category_name' => 'true',
'show_content' => 'true',
'content_words_limit' => 20,
'slides_to_show' => 3,
'slides_to_scroll' => 1,
'dots' => 'true',
'arrows' => 'true',
'autoplay' => 'true',
'autoplay_interval' => 3000,
'speed' => 500,
'hide_post' => array(),
'posts' => array(),
'post_type' => 'post',
'taxonomy' => 'category',
'show_author' => 'true',
'show_read_more' => 'true',
'media_size' => 'full',
'rtl' => 'false',
'lazyload' => '',
'className' => '',
'align' => '',
'extra_class' => '',
), $atts, 'recent_post_carousel'));
$unique = wppsac_get_unique();
$shortcode_designs = wppsac_carousel_designs();
$posts_per_page = ! empty( $limit ) ? $limit : 10;
$cat = ! empty( $category ) ? explode( ',', $category ) : '';
$design = ( $design && ( array_key_exists( trim( $design ), $shortcode_designs ) ) ) ? trim($design) : 'design-1';
$showCategory = ( $show_category_name == 'true' ) ? true : false;
$showContent = ( $show_content == 'true' ) ? true : false;
$showDate = ( $show_date == 'true') ? true : false;
$showAuthor = ( $show_author == 'true') ? true : false;
$showreadmore = ( $show_read_more == 'false') ? false : true;
$words_limit = ! empty( $content_words_limit ) ? $content_words_limit : 20;
$slides_to_show = ! empty( $slides_to_show ) ? $slides_to_show : 3;
$slides_to_scroll = ! empty( $slides_to_scroll ) ? $slides_to_scroll : 1;
$dots = ( $dots == 'false' ) ? 'false' : 'true';
$arrows = ( $arrows == 'false' ) ? 'false' : 'true';
$autoplay = ( $autoplay == 'false' ) ? 'false' : 'true';
$autoplay_interval = ! empty( $autoplay_interval ) ? $autoplay_interval : 3000;
$speed = ! empty( $speed ) ? $speed : 500;
$post_type = ! empty( $post_type ) ? $post_type : 'post';
$taxonomy = ! empty( $taxonomy ) ? $taxonomy : 'category';
$media_size = ! empty( $media_size ) ? $media_size : 'full'; // you can use thumbnail, medium, medium_large, large, full
$exclude_post = ! empty( $hide_post ) ? explode( ',', $hide_post ) : array();
$posts = ! empty( $posts ) ? explode( ',', $posts ) : array();
$lazyload = ( $lazyload == 'ondemand' || $lazyload == 'progressive' ) ? $lazyload : ''; // ondemand or progressive
$align = ! empty( $align ) ? 'align'.$align : '';
$extra_class = $extra_class .' '. $align .' '. $className;
$extra_class = wppsac_sanitize_html_classes( $extra_class );
// For RTL
if( empty( $rtl ) && is_rtl() ) {
$rtl = 'true';
} elseif ( $rtl == 'true' ) {
$rtl = 'true';
} else {
$rtl = 'false';
}
// Shortcode file
$design_file_path = WPRPS_DIR . '/templates/carousel/' . $design . '.php';
$design_file = file_exists( $design_file_path ) ? $design_file_path : '';
// Enqueus required script
wp_enqueue_script( 'wpos-slick-jquery' );
wp_enqueue_script( 'wppsac-public-script' );
// Slider configuration
$carousel_conf = compact( 'slides_to_show', 'slides_to_scroll', 'dots', 'arrows', 'autoplay', 'autoplay_interval','speed', 'rtl', 'lazyload' );
ob_start();
// WP Query Parameters
$args = array (
'post_type' => $post_type,
'post_status' => array( 'publish' ),
'orderby' => 'date',
'order' => 'DESC',
'posts_per_page' => $posts_per_page,
'post__not_in' => $exclude_post,
'post__in' => $posts,
);
// Category Parameter
if( $cat != "" ) {
$args['tax_query'] = array(
array(
'taxonomy' => $taxonomy,
'terms' => $cat,
'field' => 'term_id',
)
);
}
$query = new WP_Query( $args );
if ( $query->have_posts() ) : ?>
<div class="wppsac-wrap wppsac-slick-carousel-wrp wppsac-clearfix <?php echo esc_attr( $extra_class ); ?>" data-conf="<?php echo htmlspecialchars( json_encode( $carousel_conf )); ?>">
<div id="wppsac-post-carousel-<?php echo esc_attr( $unique ); ?>" class="wppsac-post-slider-init wppsac-post-carousel <?php echo esc_attr( $design ); ?>">
<?php while ( $query->have_posts() ) : $query->the_post();
$post_id = isset( $post->ID ) ? $post->ID : '';
$cat_list = wppsac_get_category_list($post->ID, $taxonomy);
$slider_orig_img = wppsac_get_post_featured_image( $post->ID, $media_size, true );
$feat_image = $slider_orig_img;
if ( $lazyload ) {
$feat_image = WPRPS_URL.'assets/images/spacer.gif';
}
if( $design_file ) {
include( $design_file );
}
endwhile; ?>
</div>
</div>
<?php
endif;
wp_reset_postdata();
$content .= ob_get_clean();
return $content;
}
Code file location:
wp-responsive-recent-post-slider/wp-responsive-recent-post-slider/includes/shortcodes/wppsac-carousel.php
[recent_post_slider] Shortcode
The wp-responsive-recent-post-slider plugin shortcode allows you to display a responsive slider of your most recent posts. The shortcode function ‘wprps_recent_post_slider’ customizes the slider’s appearance and behavior, including the number of posts displayed, design, category, and more. It also handles compatibility with various page builders.
Shortcode: [recent_post_slider]
Parameters
Here is a list of all possible recent_post_slider shortcode parameters and attributes:
limit
– Sets the maximum number of posts to display.design
– Determines the layout and style of the post slider.category
– Filters the posts by specific category.show_date
– Option to display the date of the post.show_category_name
– Option to show the category name of the post.show_content
– Option to display the content of the post.content_words_limit
– Sets the word limit for the post content.dots
– Option to show navigation dots on the slider.arrows
– Option to show navigation arrows on the slider.autoplay
– Option to enable automatic sliding of posts.autoplay_interval
– Sets the interval for the autoplay function.speed
– Determines the speed of the sliding transition.posts
– Filters to display specific posts only.hide_post
– Option to hide specific posts from the slider.post_type
– Sets the type of posts to display.taxonomy
– Sets the taxonomy for the posts.show_author
– Option to display the author of the post.show_read_more
– Option to display a ‘Read More’ button.media_size
– Determines the size of the media in the post.rtl
– Option to enable right-to-left layout.lazyload
– Option to enable lazy loading for the slider.className
– Sets a custom class for the slider.align
– Determines the alignment of the slider.extra_class
– Sets an extra custom class for the slider.
Examples and Usage
Basic example – Displaying recent posts in a slider with default settings.
[recent_post_slider]
Advanced examples
Displaying recent posts in a slider with a specific design, limit of posts, and show date enabled.
[recent_post_slider design="design-2" limit="5" show_date="true"]
Displaying recent posts in a slider with a specific category, autoplay enabled, autoplay interval set to 5000 milliseconds, and speed set to 1000 milliseconds.
[recent_post_slider category="news" autoplay="true" autoplay_interval="5000" speed="1000"]
Displaying recent posts in a slider with content words limit set to 50, dots and arrows disabled, and show read more enabled.
[recent_post_slider content_words_limit="50" dots="false" arrows="false" show_read_more="true"]
Displaying recent posts in a slider with a specific post type, taxonomy, media size set to medium, and align set to center.
[recent_post_slider post_type="product" taxonomy="product_cat" media_size="medium" align="center"]
PHP Function Code
In case you have difficulties debugging what causing issues with [recent_post_slider]
shortcode, check below the related PHP functions code.
Shortcode line:
add_shortcode( 'recent_post_slider', 'wprps_recent_post_slider' );
Shortcode PHP function:
function wprps_recent_post_slider( $atts, $content = null ) {
// Taking some global
global $post;
// SiteOrigin Page Builder Gutenberg Block Tweak - Do not Display Preview
if( isset( $_POST['action'] ) && ($_POST['action'] == 'so_panels_layout_block_preview' || $_POST['action'] == 'so_panels_builder_content_json') ) {
return "[recent_post_slider]";
}
// Divi Frontend Builder - Do not Display Preview
if( function_exists( 'et_core_is_fb_enabled' ) && isset( $_POST['is_fb_preview'] ) && isset( $_POST['shortcode'] ) ) {
return '<div class="wppsac-builder-shrt-prev">
<div class="wppsac-builder-shrt-title"><span>'.esc_html__('Recent Slider View', 'wp-responsive-recent-post-slider').'</span></div>
recent_post_slider
</div>';
}
// Fusion Builder Live Editor - Do not Display Preview
if( class_exists( 'FusionBuilder' ) && (( isset( $_GET['builder'] ) && $_GET['builder'] == 'true' ) || ( isset( $_POST['action'] ) && $_POST['action'] == 'get_shortcode_render' )) ) {
return '<div class="wppsac-builder-shrt-prev">
<div class="wppsac-builder-shrt-title"><span>'.esc_html__('Recent Slider View', 'wp-responsive-recent-post-slider').'</span></div>
recent_post_slider
</div>';
}
extract(shortcode_atts(array(
'limit' => 10,
'design' => 'design-1',
'category' => '',
'show_date' => 'true',
'show_category_name' => 'true',
'show_content' => 'true',
'content_words_limit' => 20,
'dots' => 'true',
'arrows' => 'true',
'autoplay' => 'true',
'autoplay_interval' => 3000,
'speed' => 500,
'posts' => array(),
'hide_post' => array(),
'post_type' => 'post',
'taxonomy' => 'category',
'show_author' => 'true',
'show_read_more' => 'true',
'media_size' => 'full',
'rtl' => 'false',
'lazyload' => '',
'className' => '',
'align' => '',
'extra_class' => '',
), $atts, 'recent_post_slider'));
$unique = wppsac_get_unique();
$shortcode_designs = wppsac_slider_designs();
$posts_per_page = ! empty( $limit ) ? $limit : 10;
$cat = ! empty( $category ) ? explode(',', $category) : '';
$design = ( $design && ( array_key_exists( trim( $design ), $shortcode_designs ))) ? trim( $design ) : 'design-1';
$showCategory = ( $show_category_name == 'true' ) ? true : false;
$showContent = ( $show_content == 'true' ) ? true : false;
$showDate = ( $show_date == 'true') ? true : false;
$showAuthor = ( $show_author == 'true') ? true : false;
$showreadmore = ( $show_read_more == 'false') ? false : true;
$words_limit = ! empty( $content_words_limit ) ? $content_words_limit : 20;
$dots = ( $dots == 'false' ) ? 'false' : 'true';
$arrows = ( $arrows == 'false' ) ? 'false' : 'true';
$autoplay = ( $autoplay == 'false' ) ? 'false' : 'true';
$autoplay_interval = ! empty( $autoplay_interval ) ? $autoplay_interval : 3000;
$speed = ! empty( $speed ) ? $speed : 500;
$post_type = ! empty( $post_type ) ? $post_type : 'post';
$taxonomy = ! empty( $taxonomy ) ? $taxonomy : 'category';
$media_size = ! empty( $media_size ) ? $media_size : 'full'; // you can use thumbnail, medium, medium_large, large, full
$exclude_post = ! empty( $hide_post ) ? explode(',', $hide_post) : array();
$posts = ! empty( $posts ) ? explode(',', $posts) : array();
$lazyload = ( $lazyload == 'ondemand' || $lazyload == 'progressive' ) ? $lazyload : ''; // ondemand or progressive
$align = ! empty( $align ) ? 'align'.$align : '';
$extra_class = $extra_class .' '. $align .' '. $className;
$extra_class = wppsac_sanitize_html_classes( $extra_class );
// For RTL
if( empty( $rtl ) && is_rtl() ) {
$rtl = 'true';
} elseif ( $rtl == 'true' ) {
$rtl = 'true';
} else {
$rtl = 'false';
}
// Shortcode file
$design_file_path = WPRPS_DIR . '/templates/slider/' . $design . '.php';
$design_file = file_exists( $design_file_path ) ? $design_file_path : '';
// Enqueus required script
wp_enqueue_script( 'wpos-slick-jquery' );
wp_enqueue_script( 'wppsac-public-script' );
// Slider configuration
$slider_conf = compact('dots', 'arrows', 'autoplay', 'autoplay_interval','speed', 'rtl', 'lazyload');
ob_start();
// WP Query Parameters
$args = array (
'post_type' => $post_type,
'post_status' => array( 'publish' ),
'orderby' => 'date',
'order' => 'DESC',
'posts_per_page' => $posts_per_page,
'post__in' => $posts,
'post__not_in' => $exclude_post,
);
// Category Parameter
if( $cat != "" ) {
$args['tax_query'] = array(
array(
'taxonomy' => $taxonomy,
'terms' => $cat,
'field' => 'term_id',
)
);
}
$query = new WP_Query( $args );
if ( $query->have_posts() ) : ?>
<div class="wppsac-wrap wppsac-slick-slider-wrp wppsac-clearfix <?php echo esc_attr( $extra_class ); ?>" data-conf="<?php echo htmlspecialchars( json_encode( $slider_conf )); ?>">
<div id="wppsac-post-slider-<?php echo esc_attr( $unique ); ?>" class="wppsac-post-slider-init wppsac-post-slider <?php echo esc_attr( $design ); ?>">
<?php while ( $query->have_posts() ) : $query->the_post();
$post_id = isset( $post->ID ) ? $post->ID : '';
$cat_list = wppsac_get_category_list($post->ID, $taxonomy);
$slider_orig_img = wppsac_get_post_featured_image( $post->ID, $media_size, true );
$feat_image = $slider_orig_img;
if ( $lazyload ) {
$feat_image = WPRPS_URL.'assets/images/spacer.gif';
}
if( $design_file ) {
include( $design_file );
}
endwhile; ?>
</div>
</div>
<?php
endif;
wp_reset_postdata();
$content .= ob_get_clean();
return $content;
}
Code file location:
wp-responsive-recent-post-slider/wp-responsive-recent-post-slider/includes/shortcodes/wppsac-slider.php
Conclusion
Now that you’ve learned how to embed the WP Responsive Recent Post Slider/Carousel Plugin shortcodes, understood the parameters, and seen code examples, it’s easy to use and debug any issue that might cause it to ‘not work’. If you still have difficulties with it, don’t hesitate to leave a comment below.
Leave a Reply