WooCommerce Image Zoom

Im new on the site. I have a problem in deveoping my own wordpress theme. I have installed wordpress plugin called Woocommerce image zoom. The hover zoom function not working. In other theme its good. Its an only install and use plugin, but i think in my theme i must make some changes or must add some javascript code? I use jquery, bootstrap js and own js file with little codes. Can someone help me what can i do? Where can i start?

The second question is how can i change the single product page layout without plugin? I want to insert the bootstrap column classes. I want to display the image on the left column and the other (properties, order button and etc. on the right column). How can i do this?

Thanks Andrew

Upvotes: 0

Views: 2231

Answers (1)

Dickens Otieno
Dickens Otieno

Reputation: 71

As for the Woocommerce image zoom, there must be a javascript that is conflicting with the plugin hence the preventing it form working. To do this check if there are any error in the console. Refer here https://codex.wordpress.org/Using_Your_Browser_to_Diagnose_JavaScript_Errors

Probably it’s not compatible with our theme it is not compatible with the theme you are using. Kindly deactivate the theme and try it on the WordPress default theme(WordPress 2017 Theme) to see if it works.

Concerning the second question: what you can do is copy over the single-product.php template to a WooCommerce folder in your child theme. change the file name and modify the file, then use single_template or template_include with the correct conditional tag like this:

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;
}

Upvotes: 1

Related Questions