bootstrap carousel with multiple items in wordpress/ custom post / cmb2( Group field)

bootstrap carousel with multiple items - wordpress

<section id="team">
        <div class="container">
            <div class="row">
                <h1 class="title text-center wow fadeInDown" data-wow-duration="500ms" data-wow-delay="300ms">Meet the Team</h1>
                <p class="text-center wow fadeInDown" data-wow-duration="400ms" data-wow-delay="400ms">Sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. <br>
                Ut enim ad minim veniam, quis nostrud </p>
                <div id="team-carousel" class="carousel slide wow fadeIn" data-ride="carousel" data-wow-duration="400ms" data-wow-delay="400ms">
                    
                    <!-- Wrapper for slides -->
                    <div class="carousel-inner">
                        
                      <?php 
                        
                            $i = 4;
                            global $post;
                            $args = array('post_type' => 'team-items', 'numberposts' => -1, 'orderby' => 'menu_order', 'order' => 'ASC');
                            $myposts = get_posts($args);
                            
                            if($myposts) :
                            $chunks = array_chunk($myposts, $i);
                            $html = "";
                            foreach($chunks as $chunk):
                            // Sets as 'active' the first item
                            ($chunk === reset($chunks)) ? $active = "active" : $active = "";
                            $html .= '<div class="item '.$active.'">';
                            
                            
                            
                            foreach($chunk as $post):setup_postdata($post);
                            
                            
                            
                            $entries = get_post_meta( get_the_ID(), 'wiki_test_repeat_group', true );
                            $position = get_post_meta( get_the_ID(), 'triangle_position', true );
                            $service_thumb = wp_get_attachment_image_src(get_post_thumbnail_id($post->ID), 'team-thumb');
                            
                        
                            $html .=   '<div class="col-sm-3 col-xs-6"> <div class="team-single-wrapper"> <div class="team-single">';
                            $html .=  '<div class="person-thumb">
                                        <img src=" '.$service_thumb[0].'">
                                          
                                        </div>';
                            $html .=    '<div class="social-profile"> <ul class="nav nav-pills">';
                                                
                            foreach ( (array) $entries as $key => $entry ) :
                           $icon = (isset($entry['icon']) ? $entry['icon'] : '' );                        
                           $link = (isset($entry['link']) ? $entry['link'] : '' );                      
                                                	
                                                
                            $html .=   '<li><a href="'.$link.'"><i class="fa fa-'.$icon.'"></i></a></li>';
                                                
                                                
                            endforeach; 
                                            
                            $html .=  '</ul> </div> </div>';
                                    
                            $html .=  '<div class="person-info"></h2>';
                            $html .=  get_the_title($post->ID);
                            $html .= '</h2>';
                            $html .=   '<p>'.$position.'</p>'; 
                            $html .=   '</div></div></div>';   
                            
            
                              
                            
                            endforeach;

                            $html .= '</div>';	

                          endforeach;

                          // Prints the HTML
                          echo $html;

                        endif;;

                       ?>
                        
                    </div>

                    <!-- Controls -->
                    <a class="left team-carousel-control hidden-xs" href="#team-carousel" data-slide="prev">left</a>
                    <a class="right team-carousel-control hidden-xs" href="#team-carousel" data-slide="next">right</a>
                </div>
            </div>
        </div>
    </section>