sizing images on catagory page
-
Wordpress has upgraded to 5.3.1 and now I can’t figure out how to size the images on this page
https://jsmotorsport.com/product-category/bolts-studs-norton-motorcycle-bike/
For instance I want to adjust the top right image so its the same size as the top middle image but it defaults smaller than i want it.
The page I need help with: [log in to see the link]
-
Hi @jseng1,
I understand you would like to adjust the images on the product category page. Image sizes can now be configured under the Customizer. Go to Appearance > Customize > WooCommerce > Product Images.
Here is a screenshot for reference: https://d.pr/i/fSYtYO
Yes but that only lets you change the aspect ratio. How do I adjust the overall size of a particular image so it appears LARGER on the web page? Without changing the sizes of other images on the same page.
on this page:
https://jsmotorsport.com/product-category/bolts-studs-norton-motorcycle-bike/To adjust the image size of a specific product image, go to Edit Product > Click on the featured image that you want to change > Click Edit image
You can check the short clip here: https://d.pr/i/UvXkNc
However, I recommend keeping all your image sizes and aspect ratios the same for all the product images. You can change the image sizes on your desktop and then upload the new image sizes.
In the short clip you sent the size box is selected but the size of the image is already at default and you can only make it smaller – not larger. But I need it larger. Word press upgraded and now it defaults new uploaded images that are smaller than the original images I uploaded in a previous version of wordpress. The new workpress defaults are causing the problem of some images being smaller than my original images.
I looked into this further and it looks like there is no option to make the image size larger than the uploaded image size in WordPress core as well as plugins.The best option I can recommend is resizing the image on your PC and then upload the image.
If you are looking for a way to customize the code to have this function in-build in your site, we highly recommend contacting one of the services on our Customizations page (https://woocommerce.com/customizations/).
I tried making the images larger in photoshop and reloading them but they all default to the same size on the wordpress webpage.
I understand you resized the image in photoshop but it displays the same size on your site.
Can you tell me what image ratio did you use and did you set the new image as the featured image for your product? Here is a screenshot of what I see: https://d.pr/i/H99cXg
I recommend keeping the same size or ratio for all the images as this will make everything look properly aligned.
The image I’m talking about is the one on the right (of the 3 in your screen shot https://d.pr/i/H99cXg). The image size is 1148×1000 which is bigger than other two images on the left. The aspect ratio box is blank on all 3 images.
The problem is that I created that page a couple years ago and all those early images are larger than the last image that I’m complaining about. This happened because WordPress changed their defaults or database or whatever. I don’t want to make all the other images smaller to match the new image. I just want to make the one image larger (the last one that I uploaded – the one I’m complaining about – so it matches the rest in proportion.
your screen shot is of this page:
https://jsmotorsport.com/product-category/bolts-studs-norton-motorcycle-bike/thanks
JimHi @jseng1,
I got your point. The reason why the product image on the right side is not displaying proportionately even after uploading a larger image is because the aspect ratio is different. e.g the other two images on the left are vertical whereas the right image is horizontal.
One way is to switch the right image into a vertical image. Another way is via CSS.
With CSS the image might look a little bit stretched sometimes if the image is horizontal. But for reference you can check how it looks with a custom CSS:
https://d.pr/i/mw5YMTzIf you want to go ahead with custom CSS, you can add the following code in Appearance > Customize > Additional CSS
ul.products li.product img { height: 300px; }Let me know how that goes.
We haven’t heard back from you in a while, so I’m going to mark this as resolved – if you have any further questions, you can start a new thread.
The topic ‘sizing images on catagory page’ is closed to new replies.