Photo Gallery Forums

Hi,
I've looked around the forum and can't find an answer to this, but when sharing a picture in my gallery on facebook or twitter using the add this buttons I'm only getting a link and no thumbnail.
Facebook debug returns this :

To find the object, these are the redirects we had to follow
original http://stephen-bolton.co.uk/gallery/#/P ... anny-1.jpg
og:url http://stephen-bolton.co.uk/gallery/
The following will be treated as a redirect by the crawler:

A HTTP redirect
A <link rel="canonical" href=".." /> tag
A <meta property="og:url" content=".." /> tag

The final URL, which we tried to extract metadata from is highlighted in bold


And This:
og:url http://stephen-bolton.co.uk/gallery/
og:type website
og:title The Images of Stephen Bolton
og:image
og:description A collection of images

which seems to suggest the images can't be seen. Its the same with any of the images.

Any ideas?

thanks

Unfortunately, Facebook has changed their integration lately, so that it breaks the Imagevue Facebook sharing mechanism. I can explain why, and I can also explain why there is no workaround currently for us to get it working with Imagevue X2.

First of all, I need to emphasize that technically-speaking, Imagevue is a single-page application. Although we use hash #path/image.jpg in the URL to specify by javascript what image or folder to be viewed, technically there is only a single "page" in Imagevue X2. By example:

https://www.photo.gallery/demo/x2/
https://www.photo.gallery/demo/x2/#/earth/
https://www.photo.gallery/demo/x2/#/earth/Butterfly.jpg

All the pages above are the SAME page. The data that follows the #hash, simply tells the single-page application what file or folder to load via javascript, and also allows browser history navigation. If you view source in the URLs above, you will find that they are identical, simply because it is the same page.

This also affects how URLs are shared. If you were to share one of the links above in Facebook, it would simply share the same page (ignoring everything after the #hash), simply because it in fact IS the same page.

You can try for yourself in the Facebook debugger:
https://developers.facebook.com/tools/d ... mo%2Fx2%2F
https://developers.facebook.com/tools/d ... terfly.jpg

As you can see on the result page of the links above, it reads the same page, gets the same title, description and preview image. Basically its the same page.

So how does Imagevue get around this?
When clicking the "share" button in Imagevue, a special link is created that is basically a "landing page" for the specific gallery- or image that was shared. For example when sharing the butterfly image, Imagevue creates an URL specifically for the shared gallery/image:
https://www.photo.gallery/demo/x2/imagevue.p ... terfly.jpg


The above is in fact a separate "shareable" page, which has its own URL, data and preview image, which then redirects the visitor to the X2 application and appends the path after the #hash:
https://www.photo.gallery/demo/x2/#/earth/Butterfly.jpg

However, it seems that Facebook are now changing their bots to actually "follow" the redirect also, rendering our "landing" pages obsolete for use in Facebook, and leaving us with no option for sharing images- and galleries directly on Facebook.

It seems sharing is still working for some domains, possibly that have been running Imagevue for a while. I just checked one of yours, and it seemed to work ok:
https://developers.facebook.com/tools/d ... side-3.jpg
http://stephen-bolton.co.uk/gallery/ima ... side-3.jpg


This will be solved obviously with the new Imagevue X3 html5 version, which in fact renders separate pages on demand, but that is another story altogether. I am not 100% sure this answered your question, but the above is my discovery as of recently, and will explain why facebook fails to pick up images sometimes now ...

Thank you for that full and comprehensive explanation. Yes it fully answered my question.

Cheers

Stephen