如何在Wordpress循环中显示4个Bootstrap列[关闭]

Question

i want to display a wordpress category post inside bootstrap 4 columns..

I want the output just like this link. https://addapinch.com/ scroll at the bottom and you will find the exact output which i want..

Answer 1

I don't like to give end to end solution, but here is the one part from my code which loops through the categories and shows them on the page. You can re-edit them a bit and you will get a desired output:

<?php
echo '<ul class="nav nav-tabs" role="tablist">';

$args = array(
    'hide_empty'=> 1,
    'orderby' => 'name',
    'order' => 'ASC'
);

$categories = get_categories($args);

foreach($categories as $category) { 

    echo '<li><a href="#' . $category->name.'" role="tab" data-toggle="tab">' .      
    $category->name.'</a></li>';
    $cat_name = $category->name;

} 
echo '</ul>';
echo '<div class="tab-content">';
foreach($categories as $category) { 
    echo '<div class="tab-pane" id="' . $category->name.'">';

$the_query = new WP_Query(array(
    'post_type' => 'acme_product',
    'posts_per_page' => 100,
    'category_name' => $category->slug
)); 
while ( $the_query->have_posts() ) : $the_query->the_post(); ?>

<h1><?php the_title(); ?></h1>

<?php endwhile; 
wp_reset_postdata();
wp_reset_query();
?>   

<?php } 
echo '</div>';
?>