0

我正在建立一个摄影展示 wordpress 网站。我在无法加载的页面上动态加载了一个画廊。同样的事情发生在其他页面上。

图像正在从 AWS 中加载。我尽我所能优化它们，

有任何想法吗？你会注意到它最后也会加载一个空白关于如何解决这个问题的任何想法？

这是崩溃的 URL。第一名的获胜者就是我所说的。

https://bop.nppa.org/2021/stillphotojournalism/sports-photojournalist-of-the-year/

这是一个可行的方法，它们都使用相同的代码模板-https: //bop.nppa.org/2021/stillphotojournalism/presidential-story/

我猜这是因为页面上有太多图像 - 关于如何修复的任何想法？

<!-- Light Gallery Start -->



<div class="d-image">

        <a id="dynamic" href>
                    <img <?php awesome_acf_responsive_image(get_sub_field( 'poster' ),'large','1024px'); ?>  alt="<?php the_sub_field( 'place' ); ?>" /></a>


</div>





        <script type="text/javascript">

        $('#dynamic').on('click', function(e) {

            e.preventDefault();
            $(this).lightGallery({
              dynamic:true,
              download: false,
              rotate: false,
              flipHorizontal: false,
              flipVertical: false,
              zoom: false,
              share: false,
              dynamicEl: [{

                  <?php $gallery_images = get_sub_field( 'gallery' ); ?>
                  <?php if ( $gallery_images ) :  ?>
                    <?php foreach ( $gallery_images as $gallery_image ): ?>


                    "src": '<?php echo esc_url( $gallery_image['sizes']['large'] ); ?>',
                    'thumb': '<?php echo esc_url( $gallery_image['sizes']['thumbnail'] ); ?>',
                    'subHtml': '<p><?php echo esc_html( $gallery_image['caption'] ); ?></p>'
                },{

                <?php endforeach; ?>
                <?php endif; ?>


              }]
            })
        });
        //]]></script>




        <!-- Light Gallery End -->

谢谢

4

0 回答 0