Problem with lightbox on product page for matrix items

Today we have noticed that the lightbox on our product pages is not always loading when you click the image if the product is a matrix product (also the alternate images don’t work). If you select an alternate matrix product (by selecting from dropdown box) then you can get the light box to load for that and then can go back to the main product then it loads.

eg http://www.broughtons.com/store/product/95802/Sanford-Double-Wall-Light-Antique-Brass-with-Shades/

I have replicated this issue in Firefox, Safari & Chrome.
I don’t think this is something I’ve done as I’ve replicated it on someone elses Nitrosell site. (and all I’ve done of late is add the open graph tags for rich pins?!?!).

Non matrix products don’t seem to have an issue.

I’ve also noticed some social share buttons disappear when you change matrix variants. I’ve not noticed this before.

Has something changed?

Emma

Hi Emma, did you ever get to the bottom of this? I am experiencing the same issue
Ang

@franclin_foping, could you take a look at this at your earliest convenience, please?

Hi Angela,

It still seems to be an intermittent problem with the lightbox for us (although I’ve found it harder to replicate this time). The problem with the social sharing panel not loading properly when you change the matrix variant does seem consistent though and our Facebook button disappears when you change variant which would also be great to get fixed.
Emma

Hi Emma, thanks for getting back to me. We are not having the issue with the social sharing buttons, so not sure if it is related? For us, the issue is just that the first image loads in a lightbox, but when you change to a different matrix item it doesn’t open in a lightbox, but opens the image path in the window. Upon clicking back and selecting a different matrix item, the image will not enlarge at all.
Ang

Hi @emma,

It looks like the reason why those images were failing to be loading has nothing to do with us. Your product pages were throwing some javascript errors due to some custom content introduced by your designers or whoever has editing privileges to your templates.

Also, we always ensure that our product pages are error-free before being released. Occasionnally, retailers change the front-end and ultimately introduced errors. To see those errors, when opening a page press F12 in your browser and you will see these errors in the console.

At the moment, I don’t see any more errors and your product pages appear to be working as expected. Can you confirm that please?

Thanks for your custom.

Regards,
Franclin

Hi @angela_morton,

Please can you provide some links to help our investigation please?

Thanks,
Franclin

Hi Franclin,
take a look at this page:
http://store.langlandsgardencentre.co.uk/kingswood-fir-artificial-christmas-tree-150cm-688550/
the first matrix item which shows on page load (150cm) works fin with the lightbox.
Selecting the second item in the matrix (180cm) upon enlarging the image just opens the image.
If you then click back to the product page, and select the third item in the matrix (210cm), nothing happens at all when clicking to enlarge the image.
I am not seeing any errors in the console.
thanks
Ang

(Pinging @franclin_foping, please turn on forum notification emails if you haven’t already)

Hi @angela_morton

Thanks for bringing this issue into our attention and our sincere apologies for the delay. We have now fixed it and it is available in our Beta channel. As your store is already from that branch, the patch is already available for you.

On a side note, I noticed that your Add to Basket button is not displaying properly. It looks really nice on Firefox 40 but doesn’t seem to be rendered as well in IE 8 and Chromium 44. You may need to have a chat with your designer about that issue. The attached screenshot clearly shows it.

Let us know your thoughts please.

Regards,
Franclin

Hi Franclin, thanks for highlighting that display issue, I have had that fixed now.
There is still a bit of an iddue with the matrix item lightbox images. If you look at that product link above, the first and second items in the matrix open up in a lightbox, but not the third.

Hi Angela,

I have just tried to recreate the issue but to no avail. Maybe you are using a cached version of that webpage?

I tested that page on Firefox 40, Chrome 44, and even Internet Explorer 10 and it is all working for me.

On the other hand, the basket button is currently only working on Firefox and not on other browsers.

Regards,
Franclin

Hi @franclin_foping,

You are correct that our site was designed by your resellers - that was 2 years ago now. As an end user I have to make an educated guess with regard to the cause of an issue so sometimes I may get that wrong - apologies. However it was definitely previously working fine so its a bit odd!

With regard to the Facebook Share button not appearing when you change matrix items, that is still an issue for us. I followed the instructions in this post Change Facebook 'Like' to 'Share' to put that button in. At the time I found the same error in the flowsurfandskate implentation (who raised the post) which is why I looked to you for help. Can you shed any light on that at all?

Thanks,
Emma

Emma

the issue with matrix items and social buttons needs looked at. In short, these social buttons use information from meta tags output in the page header. When we reload matrix items the header meta information refers to the base matrix item not the newly selected matrix item.

We are aware of this issue.

Regards
James