Facebook Like Button in Pretty Photo Image Gallery

Question

On this site I used pretty Photo image gallery. The problem is - when a user clicks on the facebook like button - on his news is displayed only the name of the site. what I would like is - when a user clicks fb LIKE button on a particular image, that image is shown on his news feeds. can you help me make this?

Answer 1

When working with Facebook, always ALWAYS check your website url with the Facebook debugger.

Looks like the problem is that Facebook couldn't featch the image probarly, so you will need to add a meta tag so Facebook can know the desired image for the prvded URL.

Ex: <meta property="og:image" content="YOUR_IMAGE_PATH"/>

Update 1:

In order to modify the Meta tag value when the user changes the gallery image, you can use the following code to do so:

$("meta[property=og\\:image]").attr("content", YOUR_IMAGE_PATH);

note that we needed to escape the : character as mentioned in the documentation

Update 2:

you will need to alter those functions in order to make it to work:

    $pp_gallery.find('.pp_arrow_next').click(function(){
            $.prettyPhoto.changeGalleryPage('next');
        // here you will need to read the current image url, then assign it to our facebook line.
    $("meta[property=og\\:image]").attr("content", YOUR_IMAGE_PATH);
            $.prettyPhoto.stopSlideshow();
            return false;
        });

    $pp_gallery.find('.pp_arrow_previous').click(function(){
            $.prettyPhoto.changeGalleryPage('previous');
        // here you will need to read the current image url, then assign it to our facebook line.
$("meta[property=og\\:image]").attr("content", YOUR_IMAGE_PATH);
            $.prettyPhoto.stopSlideshow();
            return false;
        });