Change OG: IMAGE value with jQuery click

I just create a portfolio of images with one HTML page where all the images are dynamically loaded. So far, everything is working fine, except for facebook META OG: IMAGE.

Since the page only loads once, I can assign the URL OG: IMAGE once ... But I really would like to have each picture with its own OG: IMAGE, since this is a photo album.

Photos are uploaded by clicking on -li class = "open-pic" tag. I would like to change the value of OG: IMAGE every time I click on the -li class = "open-pic" tag.

Is it possible? I found things like this:

$('meta[name=og\\:image]').attr('content', newImageUrl);

However, I do not know how to associate this with the on.click.pen-pic onclick event. Thank!

G.

+5
source share
3

, URL- OG: IMAGE ... OG: IMAGE, .

- OG - Facebook , , HTTP- URL- , HTML; JavaScript.

. URL - / / FB URL .

( , - , AJAX, , URL- , Open Graph.)

+14
$('li.open-pic').click(function(){
 $('meta[name=og\\:image]').attr('content', newImageUrl);
});
+3

This is a colon. Try using single quotes and double quotes as follows:

var imgSrc = $(this).find('img').attr('src'); // image stored as variable
$('meta[property="og:image"]').attr('content', imgSrc); // assigns meta property
+3
source

All Articles