将 Woocommerce 产品图片库移至特色图片的一侧

Question

我正在定制一个安装了 WooCommerce 的 WordPress 主题。客户希望单个产品页面上的图片库从主图片下方移动到它旁边（在产品摘要下方）。我尝试简单地将 do_action( 'woocommerce_product_thumbnails' ); 从 product-image.php 移动到 content-single-product.php 中的摘要之后，但这破坏了将特色图片更改为您单击的内容的能力，也破坏了灯箱功能。

我需要怎么做才能将该画廊移到我想要的右侧？

Answer 1

您可以删除该操作，然后将其重新添加，以将产品照片重新定位在产品摘要下方。将此代码添加到您的 functions.php 文件中。

remove_action( 'woocommerce_product_thumbnails', 'woocommerce_show_product_thumbnails', 20 );
remove_action( 'woocommerce_before_single_product_summary', 'woocommerce_show_product_images', 20 );
add_action( 'woocommerce_single_product_summary', 'woocommerce_show_product_thumbnails', 25 );
add_action( 'woocommerce_single_product_summary', 'woocommerce_show_product_images', 25 );

唯一的问题是它的外观取决于您使用的主题图库不会是列的 100% 宽度。我尝试使用 2016 年主题并使用此 CSS 使画廊成为页面的全宽。

#content .twentysixteen div.product div.images {
   width:100%;
}

将 Woocommerce 产品图片库移至特色图片的一侧

Move Woocommerce Product Image Gallery to Side of Featured Image

php

wordpress

customization

woocommerce