私は写真表示ワードプレスのウェブサイトを構築しています。ページにギャラリーを動的にロードしていますが、ロードできません。他のページでも同じことが起こります。
イメージは AWS からロードされています。できる限り最適化して、
何か案は？最後に空白もロードされることに気付くでしょう。それを修正する方法についてのアイデアはありますか?
クラッシュする URL は次のとおりです。1 位の勝者は、私が話していることです。
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 -->どうも