javascript - WooCommerce 图像缩放

Question

我是该网站的新用户。 我在开发自己的 WordPress 主题时遇到问题。 我已经安装了名为 Woocommerce 图像缩放的 WordPress 插件。 悬停缩放功能不起作用。 在其他主题中它很好。 它是唯一安装和使用的插件，但我认为在我的主题中我必须进行一些更改或者必须添加一些 javascript 代码？ 我使用 jquery、bootstrap js 和自己的 js 文件，代码很少。 有人可以帮我做什么吗？我可以从哪里开始？

第二个问题是如何在没有插件的情况下更改单个产品页面布局？ 我想插入引导列类。 我想在左列上显示图像，在右列上显示其他图像(属性、订单按钮等)。 我该怎么做？

谢谢 安德鲁

Answer 1

对于 Woocommerce 图像缩放，一定存在与插件冲突的 JavaScript，从而阻止其正常工作。为此，请检查控制台中是否有任何错误。引用这里https://codex.wordpress.org/Using_Your_Browser_to_Diagnose_JavaScript_Errors

可能它与我们的主题不兼容，它与您正在使用的主题不兼容。请停用该主题并在 WordPress 默认主题(WordPress 2017 主题)上尝试一下，看看是否有效。

关于第二个问题: 您可以做的是将 single-product.php 模板复制到子主题中的 WooCommerce 文件夹中。更改文件名并修改文件，然后使用 single_template 或 template_include 以及正确的条件标记，如下所示:

single_template

function get_custom_post_type_template($single_template) {
 global $post;

 if ($post->post_type == 'product') {
      $single_template = dirname( __FILE__ ) . '/single-template.php';
 }
 return $single_template;
}
add_filter( 'single_template', 'get_custom_post_type_template' );

template_include

add_filter( 'template_include', 'portfolio_page_template', 99 );

function portfolio_page_template( $template ) {

    if ( is_page( 'slug' )  ) {
        $new_template = locate_template( array( 'single-template.php' ) );
        if ( '' != $new_template ) {
            return $new_template ;
        }
    }

    return $template;
}