Bootstrap Tabs used with Advanced Custom Fields ACF PHP JS HTML

Bootstrap Tabs used with Advanced Custom Fields ACF PHP JS HTML.php

<?php if( have_rows('tabs') ): ?>
	<ul class="nav nav-tabs" id="myTab" role="tablist">
		<?php $i=0; while ( have_rows('tabs') ) : the_row(); ?>
			<?php 
				$string = sanitize_title( get_sub_field('tab_title') ); 
			?>
			<li role="presentation" <?php if ($i==0) { ?>class="active"<?php } ?>  >
				<a href="#<?php echo $string ?>" aria-controls="<?php echo $string ?>" role="tab" data-toggle="tab"><?php the_sub_field('tab_title'); ?></a>
			</li>
		<?php $i++; endwhile; ?>
	</ul>
	<div class="tab-content">
		<?php $i=0; while ( have_rows('tabs') ) : the_row(); ?>
			<?php 
				$string = sanitize_title( get_sub_field('tab_title') ); 
			?>
		    <div role="tabpanel" class="tab-pane text-center fade <?php if ($i==0) { ?>in active<?php } ?>" id="<?php echo $string; ?>">
		    	<h2><?php the_sub_field('tab_title'); ?></h2>
		    	<?php the_sub_field('tab_text'); ?>
		    </div>
		<?php $i++; endwhile; ?>
	</div>
<?php endif; ?>

Nice work, if you add show to lines 7 and 17 along with ?>in active<?php } it will display the tab contents by default.