高级自定义字段库缩略图大小答案

【问题标题】：Advanced Custom Fields Gallery Thumbnail Sizes高级自定义字段库缩略图大小
【发布时间】：2018-02-12 14:24:39
【问题描述】：

我使用 WordPress 的 acf pro 插件创建了一个画廊。这一切都适用于横向格式的图像。但是，由于缩略图是固定的宽度，而纵向图像的比例不同，因此它们在按比例缩小时比横向图像的高度要大得多，这显然看起来非常错误。

我要解决的是是否有办法裁剪缩略图的图像，但仍将原始图像用于灯箱。

您可以查看图库here:

代码如下：

 <?php
$gallery = get_field('gallery');
$images = array();


$items_per_page = 12;
$total_items = count($gallery);
$size = 'full'; 
$total_pages = ceil($total_items / $items_per_page);

if(get_query_var('paged')){
    $current_page = get_query_var('paged');
}
elseif (get_query_var('page')) {
    $current_page = get_query_var('page');
}
else{
    $current_page = 1;
}
$starting_point = (($current_page-1)*$items_per_page);

if($gallery){
    $images = array_slice($gallery,$starting_point,$items_per_page);
}

if(!empty($images)){
     ?>  <div id="slider" class="flexslider"> 
                  <div class="gallery-div">
                    <?php foreach( $images as $image ): ?>
                            <a href="<?php echo $image['url']; ?>"  data-fancybox="gallery" data-caption="<?php echo $image['alt']; ?>" ><img src="<?php echo $image['sizes']['medium']; ?>" alt="<?php echo $image['alt']; ?>" /></a>
                    <?php endforeach; ?>
                  </div>
                </div>
                <?php
}

?><div class="pagination-links">
<?php
$big = 999999999;
echo paginate_links(array(
    'base' => str_replace( $big, '%#%', esc_url( get_pagenum_link( $big ) ) ),
    'format' => '?paged=%#%',
    'current' => $current_page,
    'total' => $total_pages,
    'before_page_number' => '<span class="screen-reader-text">'.$translated.' </span>'
));?>
</div>
<?Php
?>

任何帮助将不胜感激。

【问题讨论】：

标签： thumbnails advanced-custom-fields acfpro

【解决方案1】：

您的 Fancybox 位于链接上，该链接将打开 href 中的 URL，但您没有理由不能在 img 标记中使用不同的图像。为什么不试试这个：

<a href="<?php echo $image['url']; ?>" data-fancybox="gallery" data-caption="<?php echo $image['alt']; ?>" >
  <img src="<?php echo $image['sizes']['thumbnail']; ?>" alt="<?php echo $image['alt']; ?>" />
</a>

这应该会在灯箱中为您提供完整的图像，但在您的画廊的屏幕上显示缩略图。

【讨论】：