[Resolved] Lightbox on woocommerce product page

[Author]

Posts

[Pat]

Hello,

I'm using Toolset starter with toolset plugins and WC.
I have seen that the WC product lightbox has changed since WC V3 and some code have to be added to the function.php file in order to activate this feature.
I have added the code :

function wpc_theme_setup() {
add_theme_support('wc-product-gallery-zoom');
add_theme_support('wc-product-gallery-lightbox');
add_theme_support('wc-product-gallery-slider');
}
add_action('after_setup_theme', 'wpc_theme_setup');

But nothing appears in the product page (no lightbox, no zoom ...)

Is there something special to add?
Regards
Pat

[Nigel]

Hi Pat

My understanding is that as well as requiring theme support as you describe above the markup needs to be correct, but that should have been fixed by us with the updates to WooCommerce Views.

I don't see any debug info for your site (https://toolset.com/faq/provide-debug-information-faster-support/) to know what versions you are using, could you provide that in your next reply?

And how/where are you using the product gallery? You have created a custom product template, and inserted it using the wpv-woo-product-image shortcode?

[Pat]

Hi Nigel,

Thanks for taking care.
I have added the debug info. Please find the code I'm using in the product template :

<div class="col-sm-12 produit">
<div class="col-sm-6">
[wpv-woo-product-image size="large" output="img_tag"]

<table width="100" class="table-striped">
<tr><td>Univers</td><td>[wpv-post-taxonomy type="product_cat" separator=" - "]</td></tr>
<tr><td>Marque</td><td>[wpv-post-taxonomy type="marque" separator=" - "]</td></tr>
</table>
</div>
<div class="col-sm-6">
<h1>[wpv-post-title]</h1>
<div class="prix">[wpv-woo-product-price]</div>
[wpv-post-excerpt length="30" count="word"]

[wpv-woo-buy-options add_to_cart_text="AJOUTER AU PANIER"]
</div></div>
<div class="col-sm-12">
[wpv-woo-related_products][wpv-post-excerpt]</div>

Regards
Pat

[Nigel]

Hi Pat

I'm not sure why you have the attribute output="img_tag" in your wpv-woo-product-image shortcode, but that is what prevents the full functionality of the WooCommerce gallery from working.

[Pat]

Hi Nigel,

You're rihgt, but if I don't place this output="img_tag", then, only the url of the image is displayed !!!
Regards
Pat

[Nigel]

I tested it locally with the Toolset Starter theme and it worked as expected for me.

Can you delete the shortcode and re-insert it again using the Fields and Views button, leaving the default for the output type.

Does that not work?

[Pat]

Hi Nigel,

Really strange. I placed this code :
[wpv-woo-product-image]
nd the result is that only the image url (size thumbnail) is displayed :
hidden link

I have also desactivated all other plugins related to WC without succes.
Regards
Pay

[Pat]

Hi Nigel,

I made some complementory tests and it seems that a plugin like Responsive Lightbox (Dfactory) does not work neither on this configuration (add the lightbox class to the woo commerce image).

I have also tried to suppress all files of WC and load again a fresh version of the plugin, nothing change !

For info, here is the code I'm getting in the front end concerning the WC product image (nothing else) :

<div class="col-sm-6">
<img width="900" height="900" src="//www.my_site.fr/wp-content/uploads/2017/12/SIL2C.jpg" class="attachment-large size-large wp-post-image" alt="" srcset="//www.my_site.fr/wp-content/uploads/2017/12/SIL2C.jpg 900w, //www.my_site.fr/wp-content/uploads/2017/12/SIL2C-150x150.jpg 150w, //www.my_site.fr/wp-content/uploads/2017/12/SIL2C-300x300.jpg 300w, //www.my_site.fr/wp-content/uploads/2017/12/SIL2C-600x600.jpg 600w, //www.my_site.fr/wp-content/uploads/2017/12/SIL2C-90x90.jpg 90w" sizes="(max-width: 900px) 100vw, 900px" />
</div>

Any idea?

Regards
Pat

[Nigel]

You should have a container div with a class of woocommerce-product-gallery amongst others.

I think I should get a copy of your site to test, if you could prepare a duplicate (https://toolset.com/faq/provide-supporters-copy-site/).

I'll mark your next reply as private.

[Nigel]

Hi Pat

The issue seems to be connected with your parent Layout (airedesco).

If you edit the child Layout and unset the parent then the gallery works.

I couldn't spot anything obviously responsible, and I've passed this on to my colleagues to investigate further.

I'll keep you posted.

[Pat]

Hi Nigel,

Thanks for your analysis.
I'm working since years with the same way of doing in terms of parent / child Layout structure!
So, let wait until your developers will have a look on it.

Regards
Pat

[Pat]

Hi Nigel,

I'm coming back on this topic as my client is requesting the lightbox effect on the product image.
Is there any news about the investigation and how I could have this function again?
Regards
Pat

[Nigel]

Hi Pat

I don't see any progress on the internal ticket about this, so I have added a note saying that you are asking about progress.

Hopefully that will trigger a response soon, and I will let you know.

[Nigel]

Hi Pat

We published an update to WooCommerce Views this week which contains a fix for this issue.

If you still have problems, let me know.