create multiple featured slider

are you wanting it only at home page?

Ok.I am trying to make it on my dev server. But it is much customization. Are you created the child theme? lot of files will need for this.

@nayeem_888

You can try this. First put the following code in your functions.php file:

<?php
function featuredSlider($tags, $limit){
?>
<div style="clear:both; content:''; display:table;"></div>
<div id="featured-content-<?php echo $tags?>" class="custom-featured-content <?php echo $tags?>-slider">
<div class="<?php echo $tags?>-featured-content-inner">
<?php
    query_posts('posts_per_page='.$limit.'&tag='. $tags);
    if(have_posts()):
      while(have_posts()):
        the_post();
  			 // Include the featured content template.
  			get_template_part( 'content', 'featured-post' );
  		endwhile;
    endif;
    wp_reset_query();
?>
	</div><!-- .featured-content-inner -->
</div><!-- #featured-content .featured-content -->
<script type="text/javascript">
  jQuery(document).ready(function(){
    var body    = jQuery( 'body' ),
		_window = jQuery( window );
    // Initialize Featured Content slider.
	 _window.load( function() {
  		if ( body.is( '.slider' ) ) {
        jQuery( '.<?php echo $tags?>-slider' ).featuredslider( {
  				selector: '.<?php echo $tags?>-featured-content-inner > article',
  				controlsContainer: '.<?php echo $tags?>-slider'
  			} );
  		}
    });
  });
</script>
<?php } ?>

Next add the some css in your child theme’s css file. Here is the code:

.custom-featured-content {
background: #000 url(../twentyfourteen/images/pattern-dark.svg) repeat fixed;
-webkit-box-sizing: border-box;
-moz-box-sizing:    border-box;
box-sizing:         border-box;
position: relative;
width: 100%;
}

.custom-featured-content-inner {
overflow: hidden;
}

.custom-featured-content .hentry {
color: #fff;
margin: 0;
max-width: 100%;
width: 100%;
}

.custom-featured-content .post-thumbnail,
.custom-featured-content .post-thumbnail:hover {
background: transparent;
}

.custom-featured-content .post-thumbnail {
display: block;
position: relative;
padding-top: 55.357142857%;
overflow: hidden;
}

.custom-featured-content .post-thumbnail img {
left: 0;
position: absolute;
top: 0;
}

.custom-featured-content .entry-header {
background-color: #000;
-webkit-box-sizing: border-box;
-moz-box-sizing:    border-box;
box-sizing:         border-box;
min-height: 96px;
overflow: hidden;
padding: 24px 10px;
}

.custom-featured-content a {
color: #fff;
}

.custom-featured-content a:hover {
color: #41a62a;
}

.custom-featured-content .entry-meta {
color: #fff;
font-size: 11px;
font-weight: 700;
line-height: 1.0909090909;
margin-bottom: 12px;
}

.custom-featured-content .cat-links {
font-weight: 700;
}

.custom-featured-content .entry-title {
font-size: 18px;
font-weight: 300;
line-height: 1.3333333333;
margin: 0;
text-transform: uppercase;
}

/* Slider */

.slider .custom-featured-content .hentry {
-webkit-backface-visibility: hidden;
display: none;
position: relative;
}

.slider .custom-featured-content .post-thumbnail {
padding-top: 55.49132947%;
}

@media screen and (min-width: 673px) {
.slider .custom-featured-content .entry-header {
min-height: inherit;
padding: 24px 30px 48px;
position: absolute;
left: 0;
bottom: 0;
width: 50%;
z-index: 3;
}
}

@media screen and (min-width: 1080px) {
.custom-featured-content {
padding-left: 222px;
margin-top: 20px;
}

.slider .custom-featured-content .entry-title {
font-size: 33px;
line-height: 1.09091;
}

.slider .custom-featured-content .entry-header{
width: 534px;
}
}

now you will place the “featuredSlider()” function in your template file or index.php file. I added this function in my index.php file. This is code:

<?php

// I put the code just below this line <?php get_sidebar( 'content' ); ?>

if ( is_front_page() ) {
featuredSlider('blockquotes', 6); // passing the tag and post limit

?>

@nayeem & wprock

Would either one of you like to post a link to a demo showing that the function does indeed work?

I see 3 issue with the function off the bat….

* Use of query_posts(); is a bad bad idea – you should never use it. Use WP_Query(); instead.

* Also use of wp_reset_query(); is not a good idea – use wp_reset_postdata();

* You are missing the closing } for the code placed in index.php which would cause the “blank white page of death” or throw up and error if error reporting is enabled.

I’ll let Codex explain the problem 🙂
http://codex.wordpress.org/Function_Reference/query_posts

get_posts(); would be perfectly fine