Mettre en place un bouton Facebook Like sur la page JQuery Galleriffic

Question

J'utilise l'album photo JQuery Gallerific sur notre site.

Je souhaite implémenter le bouton Facebook Like et le protocole Open Graph sur cette page.

facebook comme bouton

<fb:like href="http://www.twospy.com/galleriffic/example-5.html" layout="button_count"></fb:like> 

protocole graphique ouvert

<meta property="og:url" content="http://www.twospy.com/galleriffic/example-5.html"/> 
<meta property="og:image" content="http://farm4.static.flickr.com/3261/2538183196_8baf9a8015_s.jpg"/> 

Je souhaite modifier l'og: url et og: liens image lorsque l'utilisateur clique sur le bouton suivant et les boutons précédents à la page appropriée liens.

Supposons que l'utilisateur clique sur 5 image, puis les liens de protocole graphique ouvert devrait changer pour

<meta property="og:url" content="http://www.twospy.com/galleriffic/example-5.html#5"/> 
<meta property="og:image" content="http://farm4.static.flickr.com/3150/2538167224_0a6075dd18_s.jpg" /> 

et comme le bouton doit être changé pour

<fb:like href="http://www.twospy.com/galleriffic/example-5.html#5" layout="button_count"></fb:like> 

S'il vous plaît laissez-moi savoir est-il possible . Une solution à ce problème me sauvera la vie. S'il vous plaît aidez-moi avec le code.

Merci.

Answer 1

J'ai rencontré le même problème. Le problème est que les «plug-ins» de réseaux sociaux (Facebook, Twitter, Google+, etc.) injectent tous des iframes dans lesquels ils font leur travail. En tant que tel, modifier les méta-informations de la page arrive trop tard, car il a été analysé pour construire l'iframe et est ignoré après cela, et inaccessible à tout JS à l'intérieur de l'iframe. J'ai même essayé de supprimer la div avec l'iframe et de la rajouter après avoir changé les méta-informations, mais la deuxième injection ne fonctionne jamais aussi bien que la première.

La solution que j'ai utilisée était un lien démodé pour le bouton "like" ou "tweet" ou "plus-one" que je mettrais à jour dans la méthode Galleriffic onSlideChange(). Une fois que vous encodez l'URL et le titre, changer href pour le un (en supposant qu'il a l'ID de « facebooksharer » dans l'exemple ci-dessous):

$("facebooksharer").attr("href","http://www.facebook.com/sharer/sharer.php?u="+newUrl+"&t="+newTitle); 

Bien sûr, vous perdez le compte en ligne et « amis aime aussi, "mais au moins les visiteurs peuvent aimer l'image exacte dans la galerie.