带有 ACF 的 Bootstrap 选项卡

如何解决带有 ACF 的 Bootstrap 选项卡

我想将 ACF 应用于客户端项目的 Bootstrap 选项卡。我可以实现这个目标……但唯一的问题是它使用的是 BS 4，我想将其调整为 v5。我从我研究过的网站上获得了代码（如果需要，我可以提供）。

    <?PHP

// *Repeater
// tabs_repeater
// *Sub-Fields
// tab_header
// tab_content

// check if the repeater field has rows of data
if( have_rows('tabs_repeater') ):
    $i = 1; // Set the increment variable
    
    echo '<ul class="nav nav-tabs" id="myTab" role="tablist">';
    
    // loop through the rows of data for the tab header
        while ( have_rows('tabs_repeater') ) : the_row();
        $header = get_sub_field('tab_header');
        $content = get_sub_field('tab_content');
    ?>
    
    <li class="nav-item">
            <a class="nav-link <?PHP if($i == 1) echo 'active';?>" id="<?PHP echo sanitize_title($header); ?>-tab" data-toggle="tab" href="#<?PHP echo sanitize_title($header); ?>" role="tab" aria-controls="<?PHP echo sanitize_title($header); ?>" aria-selected="true"><?PHP echo $header; ?></a>
    </li>
                  
    <?PHP   $i++; // Increment the increment variable

    endwhile; //End the loop 
    
    echo '</ul>
    <div class="tab-content" id="myTabContent">';
    $i = 1; // Set the increment variable
    
    // loop through the rows of data for the tab content
    while ( have_rows('tabs_repeater') ) : the_row();
        $header = get_sub_field('tab_header');
        $content = get_sub_field('tab_content');
    ?>
    
      <div class="tab-pane fade show <?PHP if($i == 1) echo 'active';?>" id="<?PHP echo sanitize_title($header); ?>" role="tabpanel" aria-labelledby="<?PHP echo sanitize_title($header); ?>-tab"><?PHP echo $content; ?></div>
    
    <?PHP   $i++; // Increment the increment variable
        
    endwhile; //End the loop 
    
    echo '</div>';

else :

    // no rows found

endif;

?>

（我已经有一段时间没有在这里发布问题了，只是忘记了如何发布代码，抱歉。但我希望这是有道理的？）