这里所说的不是遍历文章内容里的图片地址来获取所有图片，而且获取上传到当前文章的媒体库的所有图片，因为有时候我们回去单独做一个相册，而文章内容里的图片可能有其他不相干的图片存在，所有获取上传到当前文章的媒体库图片是最合适的。
下面的代码是通过获取所有图片来弄一个类似淘宝产品图切换的效果，swiper版本是4.5。
|
1 |
function MBThemes_thumbnail_gallery(){ global $post; $attachments = get_posts(array( 'post_type' => 'attachment', 'posts_per_page' => 6, 'post_status' => 'any', 'post_parent' => $post->ID )); if ($attachments){ $count = count($attachments); if($count){ ?> <link rel="stylesheet" href="<?php bloginfo('template_url');?>/static/css/swiper.min.css"> <div class="swiper-container gallery-top" id="gallery-top<?php echo $post->ID;?>"> <div class="swiper-wrapper"> <?php foreach ($attachments as $attachment){ echo '<div class="swiper-slide"><img src="'.wp_get_attachment_url($attachment->ID).'"></div>'; } ?> </div> </div> <div class="swiper-container gallery-thumbs" id="gallery-thumbs<?php echo $post->ID;?>"> <div class="swiper-wrapper"> <?php foreach ($attachments as $attachment){ echo '<div class="swiper-slide"><img src="'.wp_get_attachment_url($attachment->ID).'"></div>'; } ?> </div> </div> <script src="<?php bloginfo('template_url');?>/static/js/swiper.min.js"></script> <script> var galleryThumbs = new Swiper('#gallery-thumbs<?php echo $post->ID;?>', { spaceBetween: 10, slidesPerView: <?php echo ($count>6)?$count:6;?>, freeMode: true, autoHeight: true, watchSlidesVisibility: true, watchSlidesProgress: true, }); var galleryTop = new Swiper('#gallery-top<?php echo $post->ID;?>', { spaceBetween: 10, thumbs: { swiper: galleryThumbs } }); </script> <?php } } } |
声明：本站所有文章，如无特殊说明或标注，均为本站原创发布。任何个人或组织，在未征得本站同意时，禁止复制、盗用、采集、发布本站内容到任何网站、书籍等各类媒体平台。如若本站内容侵犯了原著者的合法权益，可联系我们进行处理。
