team.php

<section id="team" class="team pad-section narrow">

	<h1 class="section-title"><?php the_field('t_title'); ?></h1>

	<div class="contain">

		<?php $tImage = get_field('t_image'); ?>
	
		<?php echo wp_get_attachment_image($tImage, 'full'); ?>

		<div class="people-sort">

            <?php $roles = array_diff_key( members_get_role_names(), members_get_wordpress_role_names() ); ?>

           <?php $custom_order = array( 'management', 'social_team', 'design_development', 'sales_marketing' );

			$roles = array_merge( array_flip( $custom_order ), $roles ); ?>

            <?php foreach ( $roles as $slug => $name ) { ?>
        
                <a class="filter" data-filter=".<?php echo $slug; ?>"><?php echo $name; ?></a>

                <?php $roleslist[] = $slug; ?>
    
               <?php } ?>

            <a class="filter" data-filter="all">All</a>

        </div>

		<div id="team-members" class="team-members">

				<?php 
				$args5 = array(
					'role__in' => $roleslist,
					'orderby' => 'user_nicename',
					'order' => 'ASC'
				); ?>


				<?php $all_users = get_users($args5); ?>

				<?php foreach ( $all_users as $user ) { ?>

					<?php $user_acf = 'user_' .$user->ID; ?>

					<?php $rolelist = array();
					
					$roles = array_diff( (array) $user->roles, members_get_wordpress_role_slugs() );

						foreach ( $roles as $role ) {

						    $rolelist[] = $role;
						}

					if ( $rolelist ) { ?>

    				<div id="member-<?php echo $user->ID; ?>"class='team-member mix <?php echo join( ' ', $rolelist ); ?>'>

						<a href="<?php echo get_author_posts_url($user->id); ?>"></a>

						<?php $pImage = get_field('profile_image', $user_acf); ?>
	
						<?php echo wp_get_attachment_image($pImage, 'team-thumb'); ?>

						<div class="banner">

							<p><?php the_field('job_title', $user_acf); ?></p>

							<h3><?php echo esc_html( $user->display_name ) ?></h3>

						</div>
								
					</div>

					<?php } ?>
				
				<?php } ?>

		</div>

	</div>

</section>