prettyPhoto产品滑块-如何使图像居中

Question

我正在尝试建立一个WooCommerce站点(https://storetest.rigwald.com/?cmp_bypass=test)，它使用基于prettyPhoto.js的产品滑块。问题是图像不在滑块的中间，它们显示在滑块画布/窗口的左侧幻灯片上。有没有办法强制图像在滑块中居中？主题创建者似乎对自己的产品没有概念，只是告诉我将滑块中显示的任何产品的图像大小更改为800x512，即使产品照片应该是600x600或800x800。他们只是试图让我填充滑块“画布”，所以偏离中心的图像是不明显的。

我不是一个程序员。我可以在Woocommerce/Wordpress中查看Chrome开发人员工具和主题编辑器，这就是我发现滑块使用prettyPhoto的原因。

感谢你在这方面的帮助！

Answer 1

看看你的主题，似乎所有你需要的是一些css来解决这个问题。

我已经创建了一个操作，它插入了一些内联样式，应该有助于解决这个问题。

add_action('wp_head', 'bt_custom_inline_style');
function bt_custom_inline_style () {
?>
<style>
    .big-slider .home-slider li {
        display: flex;
        justify-content: center;
    }
</style>
<?php
}

您可以将此代码复制粘贴到functions.php文件中