This topic is: resolved

This topic contains 7 replies, has 2 voices, and was last updated by  Support Team 5 years, 1 month ago.

  • Author
    Posts
  • #417

    chiefnaka
    Member

    I want to disable the product image zoom on the product page. I have my images set at 220 X 220 and want them to be rendered that size on the product pages. However, they “upscale” to 440 X 440 and I cannot find the code to get that to stop!

    Thank you for helping me. All plug ins are current.

    I have the Cosmos theme, all current, and Woocommerce installed and Simple Images plug-in installed but it will not stop the up-scaling or down-scaling for thumbnails, which is OK for the thumbnails for now.

    You can see this at htp://c-clearantifog.net/shop. Then click on 1 ounce spray bottle to see the image size. Right click view image p0roperties and you will see the up-scaling. This is what I want to stop.

    Thank you!

    Terry

  • #419

    Support Team
    Keymaster
    Post count: 739

    Hi Terry, firt of all thanks for prefer our items. We hope these answers works for you.

    Please open the style.css find with CTRL+F line “1912” and delete this style or comment.

    [code title=””].woocommerce ul.products li.product, .woocommerce-page ul.products li.product {
    width: 13.8%;
    }[/code]

    product listing page thumbnails will be turning normal height/weight.

    Also for the single product image size please add this style to you style.css:

    [code title=””].woocommerce #content div.product div.images img, .woocommerce div.product div.images img, .woocommerce-page #content div.product div.images img, .woocommerce-page div.product div.images img {
    box-shadow: 0 1px 2px 0 rgba(0, 0, 0, 0.3);
    display: block;
    height: auto;
    transition: all 0.2s ease-in-out 0s;
    width: auto;
    }[/code]

    Both image sizes will be turn regular size.

    King Regards
    ThemeofWP.com Team

  • #424

    chiefnaka
    Member

    Thank you! That fixed the image size, but now I got too much white space in the product box between the image and the text description.

    How do I center the image in the box? I tried “position: center;” but the image did not move.

    You can see the issue here: http://c-clearantifog.net/shop/1-oz-spray-bottle-c-clear-lens-cleaner-anti-fog/

    The theme is getting me where I want to go, so let’s keep going!

    Terry

  • #426

    Support Team
    Keymaster
    Post count: 739

    Hi, please add these in to your style.css

    [code title=””].woocommerce #content div.product div.images, .woocommerce div.product div.images, .woocommerce-page #content div.product div.images, .woocommerce-page div.product div.images {
    margin-bottom: 2em;
    text-align: center;
    }
    }[/code]

    also add this:

    [code title=””].woocommerce #content div.product div.images img, .woocommerce div.product div.images img, .woocommerce-page #content div.product div.images img, .woocommerce-page div.product div.images img {
    box-shadow: 0 1px 2px 0 rgba(0, 0, 0, 0.3);
    display: inline;
    height: auto;
    text-align: center;
    transition: all 0.2s ease-in-out 0s;
    width: auto;
    }[/code]

    Maybe you can change the text-align: center; to text-align: right;

  • #429

    chiefnaka
    Member

    Outstanding! Thank you!

    I have couple of cleanup issues I may need some help with, but for now I am moving forward. Thank you for your great support!

    Terry

    • #430

      Support Team
      Keymaster
      Post count: 739

      You’re welcome! When you need help please contact us anytime. We’re ready to help our valuable customers everytime!

  • #431

    chiefnaka
    Member

    Due to your support I am recommending your themes to my website designers. They have built over 300 websites and are now hooked on WP.

    • #432

      Support Team
      Keymaster
      Post count: 739

      Great, We are glad to hear that! We’re ready to give help you and them anytime.

You must be logged in to reply to this topic.