[Resolved] Adding Classes and Title/Alt Tags to Woocommerce Product Images on Archives Page

[Author]

Posts

[nedG]

This is my Woocommerce Product Archive Page.

hidden link

I have installed Woocommerce Views and per your documentaion I am using the WordPress Archives to create my View for this product Grid

The problem is with my image.

Here is a sample of my View code that I am using to display the product image....

<a href="[wpv-post-url]" title="[wpv-post-title]">[wpv-woo-product-image size="thumbnail-300x300" output="img_tag" gallery_on_listings="yes" class="img-responsive" attr="title=[wpv-post-title]"]</a>
<h2>[wpv-post-link]</h2>

Am am trying to accomplish 2 things here...
1) Add the class "img-responsive" to the image
2) Add the Product Name (post name) as the Title of the image

Adding the additional class of "img-responsive" directly to the shortcode results in nothing. It seems to be ignored.

class="img-responsive"

Also adding the title or alt tag directly to the shortcode results in nothing. As you can see above, I have also tried...

attr="title=[wpv-post-title]"

It doesn't have any effect. By default it always seems to output the title of the "Image".. not the title of the "Product".

[Shane Supporter Languages: English (English ) Timezone: America/Jamaica (GMT-05:00)]

Hi Ned,

Thank you for contacting our support forum.

Unfortunately this is not possible because we are using a shortcode to generate the images, so html attributes won't work.

The only attribute that the shortcode accepts are the ones listed in the link below.
https://toolset.com/documentation/views-shortcodes/#wpv-woo-product-image

Please let me know if this helps.
Thanks,
Shane

[nedG]

I guess I don't understand why this hasn't been implemented.

For other image shortcodes, you seem to have implemented this feature just fine.

For example...

[wpv-post-featured-image attr="class=my-custom-class"]

or

[wpv-post-featured-image attr="title=mytitle"]

Why can't this be implemented for a Woocommerce Product Image?

I have even tried to do the image URL as a raw code and add the HTML attributes myself manually, but I get an error when I try to use the raw code URL.

[Shane Supporter Languages: English (English ) Timezone: America/Jamaica (GMT-05:00)]

Hi Ned,

There is actually a difference with this.

I believe the [wpv-woo-product-image ] uses the woocommerce default hooks in order to get the product image.

However with our wpv-post-featured image shortcode it allows for more flexibility as it gets the featured image.

Woocommerce products uses the featured image for their product images so using this shortcode should work as well.

Thanks,
Shane