动态Bootstrap 4图像轮播无法正常工作

Question

我在静态网站上有一个有效的图片bootstrap 4 carousel。

但是当我希望为自己的WordPress主题动态地显示图像时，图像没有显示。但是，在源代码中，图像显示得很好。

这是图像轮播中的代码段：

<div id="slider" class="carousel slide" data-ride="carousel">
    <div class="carousel-inner">
        <?php $args = array('cat' => 2,'post_per_page' => 4);
        $slider = new WP_Query($args);
        if( $slider -> have_posts() ) : 
            /* start the loop */
            while ($slider -> have_posts() ) : $slider -> the_post();
            $thumb_id = get_post_thumbnail_id();
            $thumb_url = wp_get_attachment_image_src($thumb_id,'full',true); ?>

            <div class="carousel-item <?php if($i === 0): ?>active<?php endif; ?>">
                <?php if ($thumb_url !== false) : ?>
                <img class="d-block img-fluid" src="<?= $thumb_url[0] ?>" width="<?= $thumb_url[1] ?>" height="<?= $thumb_url[2] ?>" />
                <?php endif; ?>
            </div>
            <?php endwhile; /* end of the loop */
                wp_reset_postdata();
                endif;
                    ?>
     </div>
    <!-- Prev,Next Btn -->
    <a href="#slider" class="carousel-control-prev" data-slide="prev">
        <span class="carousel-control-prev-icon"></span>
    </a>
    <a href="#slider" class="carousel-control-next" data-slide="next">
        <span class="carousel-control-next-icon"></span>
    </a>
</div>