First, make a child theme so that the following customisation is not lost during any theme update.
http://codex.ww.wp.xz.cn/Child_Themes
Put the following code in functions.php for the child theme:
http://docs.woothemes.com/document/change-number-of-products-displayed-per-page/
Displayed image sizes are governed by your theme, but can be made smaller with some custom css:
.woocommerce #content div.product div.images,
.woocommerce div.product div.images,
.woocommerce-page #content div.product div.images,
.woocommerce-page div.product div.images
{width:40%}
.woocommerce #content div.product div.summary,
.woocommerce div.product div.summary,
.woocommerce-page #content div.product div.summary,
.woocommerce-page div.product div.summary
{width:56%}
The current split between image and summary is 48% / 48%.
Your product image thumbnails are a bit small so they get a little blurry when enlarged to fit the theme, even with the reduced size above. Set image sizes at Admin page > WooCommerce > Settings > Products tab. 468px with above 40% css. After a change, regenerate your thumbnails:
https://ww.wp.xz.cn/plugins/regenerate-thumbnails/
Thank you so much for your reply lorro. Everything worked perfectly, however it did not change anything on the product detail page with the “Related Products”. Do you know of any way to change it to show like 4 or 5 related products in that area instead of 2 or is that based upon my theme style as well? Thank you in advance for your time.
Changing the number of related products may depend on your theme to some degree. Try this code in functions.php for your child theme.
http://docs.woothemes.com/document/change-number-of-related-products-output/
To get them to fit, try this in your custom css:
.woocommerce .related ul li.product,
.woocommerce .related ul.products li.product,
.woocommerce .upsells.products ul li.product,
.woocommerce .upsells.products ul.products li.product,
.woocommerce-page .related ul li.product, .woocommerce-page
.related ul.products li.product, .woocommerce-page
.upsells.products ul li.product, .woocommerce-page
.upsells.products ul.products li.product
{width: 21%}
Experiment with the 21% value a bit.
Thank you so much lorro, that worked perfectly! I truly appreciate your advice and help on this project. 🙂
