Thumbnail Sizes

• 

  macamrstudios

  |

  Participant

  | March 12, 2018 at 9:47 pm

  Hi

  I am trying to modify the default size for the Products carousel to show the whole image rather than a cropped version of it. Can you point me to the correct file (CSS div/style tag) I would need to need to modify in order to achieve this?

  Site URL: http://macamrstudios.com/production/verne/

  Theme version: Version: 4.21

  WooCommerce version: Version 3.3.3

  #187974 copied to clipboard
  

  Rose Tyler

  |

  Keymaster

  | March 13, 2018 at 2:55 pm

  Hello,

  I hope you are well today and thank you for the topic.
  In woocommerce 3.3.3 version, the plugin authors removed image settings at all even from customizer. But we keep the previous version of their settings http://prntscr.com/ik093w, so image size you can change via Customizer > woocommerce > product images (do not forget to regenerate thumbnails using Regenerate thumbnails plugin to apply changes). But 8theme product widgets use WP thumbnails size (Settings > Media) to avoid too big image in that area. So, if you don’t want to crop these images disable it in WP settings and regenerate thumbnails.
  Feel free to ask if you have any other questions.

  Regards

  #188080 copied to clipboard
  

  macamrstudios

  |

  Participant

  | March 13, 2018 at 3:58 pm

  Thanks – that solved one issue, but presents a new one… of course. Can I modify the CSS so that the product names are all aligned in a row and the thumbnails are center aligned (vertical) with each other? Right now everything is top aligned.

  

  Site URL: http://macamrstudios.com/production/verne/

  Theme version: Version: 4.21

  WooCommerce version: Version 3.3.3

  #188090 copied to clipboard
  

  Olga Barlow

  |

  Keymaster

  | March 13, 2018 at 5:25 pm

  Hello,

  If you sell pictures and don’t want to crop images we would recommend preparing images using any graphical editor before uploading to your media library and make them one size for example http://prntscr.com/iqokkg
  If you can’t change the images then you may add the fixed min/max width for all the grid images using the code below but it would be better to use the correct images from start

  .content-product .product-content-image img {    
      min-width: 1px;
      width: auto;
      max-height: 360px;
  }
  .content-product .product-image-wrapper {
      min-height: 360px;
      display: -webkit-box;
      display: -ms-flexbox;
      display: flex;
      -webkit-box-align: center;
          -ms-flex-align: center;
              align-items: center;
  }

  Regards

  #188108 copied to clipboard
Viewing 4 results
1 through 4 (of 4 total)