Product Loop Images and Add To Cart

Hi,

I have a Product Loop Widget on my homepage and it’s not displaying evenly if extra lines of text exist in product titles… Smaller images seem to misalign and empty image placeholders don’t appear (I have manually added these to products currently on this widget as a temporary workaround) causing the whole grid to be out of alignment.

Is there any way to force the Product Loop images to appear the same as the products page in terms of alignment and thumbnail size?

See the issue here under the heading “New Arrivals”: https://lovemybillylidz.com.au/

Lastly, is there any way to add an “Add To Cart” in the Loop rather than “Show More” links?

Hi,

Thank you for contacting us. I am happy to help with your queries.

I checked your site and saw two or three products have tiny tumbnail images and other else are a bit larger. I think you should manage the sizes carefully before uploading. I’d recommend using the same sizes for all of your products images.

I am sorry, currently there is no such that feature on the current version of the theme. I will be passing this to our development team to confirm whether it is worth adding to the future versions or not.

Regards,
Kharis
aThemes Support

Thanks Kharis. I’ll get the client to cross check their image upload sizes.

Do you have an answer for the “empty image placeholders don’t appear” part of my question? If a product has no image it doesn’t show the default “placeholder” it just shows a title and throws the grid out.

Hi,

The placeholder image should show up by default when there is no featured image. Perhaps you’re running the older version of WooCommerce?

Regards,
Kharis
aThemes Support

I am currently on the latest WooCommerce version. Placeholders show up on correctly Product pages, just not in Product Loops… ??

Hi,

Thank you for getting back.

Can you point me to the specific part/section not showing the placeholder? Sharing a screenshot with explanatory annotations will help better.

Regards,
Kharis
aThemes Support

Screenshot above. See the issue here: https://staging.lovemybillylidz.com.au/ if there is no image associated with the product the placeholder doesn’t appear in the Product Loop Widget.

Hi,

Thank you for sharing the screenshot.

Try these steps:

  1. Edit the widgets/class-leto-product-loop.php file of the Leto theme folder
  2. Find this code block:
    <?php if ( has_post_thumbnail() ) : ?>
    	<div class="product-thumb">
    		<a href="<?php the_permalink(); ?>" class="product-thumb__link">
    			<?php echo woocommerce_get_product_thumbnail(); ?>
    		</a>
    	</div>
    <?php endif; ?>
  1. Replace it with:
    <?php if ( has_post_thumbnail() ) : ?>
    	<div class="product-thumb">
    		<a href="<?php the_permalink(); ?>" class="product-thumb__link">
    			<?php echo woocommerce_get_product_thumbnail(); ?>
    		</a>
    	</div>
    <?php endif; ?>
    <?php if ( !has_post_thumbnail() ) : ?>
    	<div class="product-thumb">
    		<a href="<?php the_permalink(); ?>" class="product-thumb__link">
    			<?php echo wc_placeholder_img('leto-medium-thumb'); ?>
    		</a>
    	</div>
    <?php endif; ?>

Please note that editing theme’s files is not recommended as all files will be replaced when you update the theme in the future. Thus you’ll need to redo this change after theme update.

Regards,
Kharis
aThemes Support

Thanks this has resolved this issue. Any chance this can be written into future updates?

Hi,

Thank you for trying that code changes. Surely it will be permanently available in the future theme updates.

But we don’t know when it will come as we’e currently having some other urgent priorities. You’ll be notified from your website’s dashboard when the updated version is available.

Regards,
Kharis
aThemes Support