1

早些时候，我只为每页设置一个按钮而使用 Sharrre，它工作得很好。但是，我不得不改变它，现在我有 4 组按钮，并且数据文本和数据 url 值没有显示在 facebook 弹出窗口中——而是从实际链接页面加载文本，这不会打扰我所以如果它不是来自显示“联系 usNameEmail ..”等的隐藏表单，它会很重要。它与 twitter 一起使用，首先显示数据文本值，然后显示数据 url，就像它应该的那样。

我使用的系统几乎类似于 Sharrre 示例 2 ( http://sharrre.com/example2.html )，我的代码现在是：

HTML

<div class="share-buttons" data-url="MY URL" data-text="MY TEXT"></div>

和 jQuery

$('.share-buttons').each(function() {
    $(this).sharrre({
        share: {
            twitter: true,
            facebook: true
        },
        template: '<div class="share-icon-holder"><a href="#" class="facebook"><img src="fb.png" /></a><a href="#" class="twitter"><img src="twitter.png" /></a></div><div class="share-text"><img src="share.png" /></div>',
        enableHover: false,
        enableTracking: false,
        render: function(api, options){
            $(api.element).on('click', '.twitter', function(event) {
                event.preventDefault();
                api.openPopup('twitter');
            });
            $(api.element).on('click', '.facebook', function(event) {
                event.preventDefault();
                api.openPopup('facebook');
            });
        }
    });
});

所以我的页面上有 4 次 html 部分，我添加了 .each 函数试图解决这个问题，但它没有任何效果。任何提示或建议来解决这个问题？

这是一个问题：http: //jsfiddle.net/b54sc/

4

2 回答 2

2

I found out a solutions for this myself. But if there's any other ideas please share them! Thanks to @CBroe for pointing to the right direction.

Best practice would be using Open Graph meta tags but that's not possible for me because my site is one-page-site so all the content is on the same page. And since meta tags need to be in the HEAD of the html this won't suit me because I'd need four different urls and titles.

But while browsing for the meta tags solution I found another fairly easy solution.

So, Sharrre uses Facebook's sharer.php which is already deprecated. Thou it's deprecated it's still available to use and it's quite common because it doesn't require app_id. But it has changed: it doesn't accept the 't' parameter in the url for the title so that's the reason why my data-text wasn't working. And there's a solution.

This is the page I found: http://ar.zu.my/how-to-really-customize-the-deprecated-facebook-sharer-dot-php/ Changing the url a little bit does the thing. The title part needs to be 'p[title]' instead of just 't'. And there's also other parameters to use.

THE FIX to Sharrre Sharrre uses the old method which doesn't work anymore and I just changed the popup creation function in the sharrre.js file on line 325.

From

window.open("http://www.facebook.com/sharer/sharer.php?u="+encodeURIComponent((opt.buttons.facebook.url !== '' ? opt.buttons.facebook.url : opt.url))+"&t="+opt.text+"", "", "toolbar=0, status=0, width=900, height=500");

To

window.open("http://www.facebook.com/sharer/sharer.php?s=100&p[url]="+encodeURIComponent((opt.buttons.facebook.url !== '' ? opt.buttons.facebook.url : opt.url))+"&p[title]="+opt.text+"", "", "toolbar=0, status=0, width=900, height=500");

I don't know how long this solution works because Facebook can change it again anytime but it'll do for now!

Another way would be usign a Facebook dialog but that needs the app_id.

于 2013-11-15T07:45:09.140 回答
0

试试这个：我在你的代码中添加了标题，网址

$('.share-buttons').each(function() {
    $(this).sharrre({
        share: {
            twitter: true,
            facebook: true
        },
        title: $(this).attr('data-href'),
        url: $(this).attr('data-url'),
        template: '<div class="share-icon-holder"><a href="#" class="facebook"><img src="fb.png" /></a><a href="#" class="twitter"><img src="twitter.png" /></a></div><div class="share-text"><img src="share.png" /></div>',
        enableHover: false,
        enableTracking: false,
        render: function(api, options){
            $(api.element).on('click', '.twitter', function(event) {
                event.preventDefault();
                api.openPopup('twitter');
            });
            $(api.element).on('click', '.facebook', function(event) {
                event.preventDefault();
                api.openPopup('facebook');
            });
        }
    });
});
于 2013-11-13T09:26:45.610 回答