基于产品的图库，动态标题无法正常工作

Question

这是该网站的链接：https : //www.silvanacasciaro.it/ 画廊是在系列的 3 轮图像之后，在“i nostri Brand”旁边的鞋子和包包。问题在于，无论您单击什么图像，左上角的小标题都会显示第一张图像的名称并从那里开始，而不是显示单击的照片的实际名称。任何帮助将不胜感激。

这是html：

    <div id="blueimp-gallery" class="blueimp-gallery">

        <!-- The container for the modal slides -->

        <div class="slides"></div>

        <!-- Controls for the borderless lightbox -->

        <h3 class="title"></h3>

        <!-- <p class="description"></p> -->

        <a class="prev">‹</a>

        <a class="next">›</a>

        <a class="close">×</a>

        <a class="play-pause"></a>

        <ol class="indicator"></ol>

        <!-- The modal dialog, which will be used to wrap the lightbox content -->

        <div class="modal fade">

            <div class="modal-dialog">

                <div class="modal-content">

                    <div class="modal-header">

                        <button type="button" class="close" aria-hidden="true">&times;</button>

                        <h4 class="modal-title"></h4>

                    </div>

                    <div class="modal-body next"></div>

                    <div class="modal-footer">

                        <button type="button" class="btn btn-default pull-left prev">

                            <i class="glyphicon glyphicon-chevron-left"></i>

                            Previous

                        </button>

                        <button type="button" class="btn btn-primary next">

                            Next

                            <i class="glyphicon glyphicon-chevron-right"></i>

                        </button>

                    </div>

                </div>

            </div>

        </div>

    </div>

这是js：

    <script src="//blueimp.github.io/Gallery/js/jquery.blueimp-gallery.min.js"></script>

    <script src="<?php echo get_stylesheet_directory_uri(); ?>/js/bootstrap-image-gallery.min.js"></script>