prettyPhoto灯箱社交工具:所有图片都有相同数量的Facebook喜欢 [英] prettyPhoto lightbox social tools: all images have the same number of Facebook likes

问题描述

背景:我有一个使用prettyPhoto灯箱显示照片的网站.我启用了社交工具，以便在灯箱上显示"tweet"和Facebook"like"按钮，希望能够只喜欢" 将当前显示的照片显示为观看该照片的人.

问题:Facebook的喜欢"按钮实际上导致了同一图库中的所有照片都被赞:所有照片在灯箱中显示的赞次数相同；在Facebook上，用户在其新闻源或最近活动中的喜欢"链接到图库页面，而不是实际喜欢的照片.

我尝试过的操作:我尝试编辑jquery.prettyPhoto.js文件以添加在此答案中找到的占位符:

帮助:如果任何人都有解决方案，以使Facebook支持和使用Twitter通过Twitter发出来自prettyPhoto灯箱的单个照片的消息，我将不胜枚举.即使在某种程度上，照片显示的是喜欢的次数，而不是所有照片都具有相同的数目:在这个阶段，我对链接回单个照片并不感到大惊小怪:链接回主画廊页面就足够了那个.

谢谢！

解决方案

万一有人再来一次，此解决方案对我有用，它直接共享图像.

这仅适用于图像，但是没有理由在PrettyPhoto中的其余情况下将不起作用.

在prettyPhoto.js的PrettyPhoto参数中，切换出Facebook iframe以使其具有所需的任何参数，这里重要的是"{path}"位于iframe src的href位置:

<iframe id="fbiframe" src="//www.facebook.com/plugins/like.php?href={path}&amp;width&amp;layout=button&amp;action=like&amp;show_faces=false&amp;share=true&amp;height=21&amp;" scrolling="no" frameborder="0" style="border:none; overflow:hidden; height:26px;" allowTransparency="true"></iframe>'

然后在prettyPhoto.js文件中的第274行周围，您应该看到以下行:

$pp_pic_holder.find('#pp_full_res')[0].innerHTML = settings.image_markup.replace(/{path}/g, pp_images[set_position]);

像这样添加另一行，并将src的href替换为如下所示，再次用所需的任何参数表示，要点是href替换为图像位置变量:

$('#fbiframe').attr('src', "//www.facebook.com/plugins/like.php?href="+pp_images[set_position]+"&width&layout=button&action=like&show_faces=false&share=true&height=26");

Background: I have a site using a prettyPhoto lightbox to display photos. I've enabled social tools to display the 'tweet' and Facebook 'like' buttons on the lightbox, in hope to enable the ability to 'like' only the current photo being displayed to the one viewing it.

Problem: The Facebook 'like' button actually results in all photos in the same gallery being liked: all photos display the same number of likes in the lightbox; and on Facebook, the user's 'like' in their news feed or recent activity links to the gallery page rather than the actual photo that was liked.

What I've tried: I have tried editing the jquery.prettyPhoto.js file to add in the placeholder found in this answer: https://stackoverflow.com/a/11796964/2205165

I have also tried replacing 'location_href' with '{path}' to see if that used the photo's full path/URL, but it did not, or didn't appear to do so.

I've tried the above with 'deeplinking' enabled and disabled, with no avail.

Help: If anyone has a solution to enable Facebook liking and Twitter tweeting of individual photos from the prettyPhoto lightbox, I'm all ears. Even if it's to the degree of photos displaying the correct number of likes, rather than all having the same number: I'm not too fussed at this stage about linking back to the individual photo: linking back to the main gallery page will suffice for that.

Thank you!

解决方案

In case anyone ever comes up on this again, This solution worked for me and it shares the image directly.

This is for images only, but there's no reason it wont work for the rest of the cases in PrettyPhoto.

In your PrettyPhoto parameters in prettyPhoto.js, switch out the facebook iframe to look like this with whatever params you want, all that matters here is that "{path}" is in the href spot of the iframe src:

<iframe id="fbiframe" src="//www.facebook.com/plugins/like.php?href={path}&amp;width&amp;layout=button&amp;action=like&amp;show_faces=false&amp;share=true&amp;height=21&amp;" scrolling="no" frameborder="0" style="border:none; overflow:hidden; height:26px;" allowTransparency="true"></iframe>'

Then around line 274 in the prettyPhoto.js file you should see this line:

$pp_pic_holder.find('#pp_full_res')[0].innerHTML = settings.image_markup.replace(/{path}/g, pp_images[set_position]);

Add another line just like it and replace the href for the src like below, again with whatever params you want, the point is that the href is replaces with the image location variable:

$('#fbiframe').attr('src', "//www.facebook.com/plugins/like.php?href="+pp_images[set_position]+"&width&layout=button&action=like&show_faces=false&share=true&height=26");

这篇关于prettyPhoto灯箱社交工具:所有图片都有相同数量的Facebook喜欢的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！