Woocommerce Image issue

  • Resolved chamisaedmo

    (@chamisaedmo)


    4 years, 5 months ago

    Hi!

    I’m wondering if someone can help me. I’m using Woocommerce and in the store, whenever a user clicks into a single product and is directed to that product’s page, two things happen that shouldn’t:

    1. the featured image shows up but is a distorted zoom until the user hovers over the image.
    2. the gallery images are highlighted but don’t display at all in the window.

    I’ve tried isolating with CSS selectors but I can’t seem to figure out what’s happening to make it break. I’ve tried debugging by deactivating all my plugins but nothing has fixed it yet which leads me to think it might be an issue with how the theme is working with woocommerce.. Is there anything anyone can do to help me with this issue??

    Thank you in advance.

    The page I need help with: [log in to see the link]

Viewing 4 replies - 1 through 4 (of 4 total)
  • Theme Author Superb

    (@themeeverest)

    Hi @chamisaedmo !

    This isn’t really an eCommerce theme sadly, so you might run into some troubles ??

    Anyways, I have spent the last hour looking into the issue and it seems like some CSS is bugging the javascript.

    If you go appearance > theme editor > styleshet > line 52 then you’ll see following:

    div, img, pre, figure {
  max-width: 100%;
  overflow: hidden;
}

    If you delete that and add 

    .image-creativeily-header {
position:absolute !important;
}
img.zoomImg {
width:auto !important;
height:auto !important;
}

    Then it should be working it seems!
    Please let me know how it goes ??

    Thread Starter chamisaedmo

    (@chamisaedmo)

    Thank you @themeeverest for taking a look!! Unfortunately that CSS doesn’t seem to be working.. I was considering adding theme support functions and also adding hooks into the theme functions file: 

    add_theme_support( 'wc-product-gallery-slider' );
add_theme_support( 'wc-product-gallery-zoom' );
add_theme_support( 'wc-product-gallery-lightbox' );
    remove_action( 'woocommerce_before_main_content', 'woocommerce_output_content_wrapper', 10);
remove_action( 'woocommerce_after_main_content', 'woocommerce_output_content_wrapper_end', 10);

    and then: 

    add_action('woocommerce_before_main_content', 'my_theme_wrapper_start', 10);
add_action('woocommerce_after_main_content', 'my_theme_wrapper_end', 10);

function my_theme_wrapper_start() {
  echo '<section id="main">';
}

function my_theme_wrapper_end() {
  echo '</section>';
}

    I found these in while searching for simple ways to make non-woo sites woo compatible. Do you have any recommendations about where I should put them? ?? I’m still familiarizing myself with the order of functions in wp.

    Thread Starter chamisaedmo

    (@chamisaedmo)

    Update: I added a file to handle the woo specific content. It’s now pretty much woo-compatible!! WOO! Lol thanks again for being so responsive, @themeeverest! ??

    Theme Author Superb

    (@themeeverest)

    Oh I’m sorry that my code didn’t work, I thought it did.
    Great job! Is there any chance you wanna share the file with us? Then I’ll add it to the theme ??

    We’re not allowed to exchange emails over the forum, but if you write a message to me here then I’ll get back to you asap: https://superbthemes.com/contact/

    Have an amazing day and I’m super happy that you made it work! ??

Viewing 4 replies - 1 through 4 (of 4 total)
  • The topic ‘Woocommerce Image issue’ is closed to new replies.