0

我需要一个专为 FB 设计的社交媒体插件。我需要 FB 的大分享按钮。我在几个网站上看到过它,但我不知道它是哪一个。

我留下这个链接是为了向你展示我在说什么(文章开头和结尾的大 FB 按钮):

http://www.viralnova.com/animals-eating-ice-cream/

任何想法?

4

1 回答 1

0

制作大赞(这不是赞按钮,那是分享按钮)按钮并没有什么秘诀,这一切都归结为 Facebook 开发人员工具的基本知识......

Facebook 的Sharer接受GET参数u,即您要在时间轴、朋友的墙上甚至私人消息中分享的 URL ...

分解

您可以为您的共享按钮创建一个新元素或包装器,我将使用<a>它们,因为它们看起来快速且易于使用。

<a class="fsl fsl-facebook" data-href="{URL_to_Share}" href="#">
   <span class="fa-facebook fa-icons fa-lg"></span>
   <span class="sc-label">Share on Facebook</span>
</a>

注意data-href属性,因为您应该将其替换为您要共享的 URL

接下来我们需要一些 JavaScript (jQuery) 来让我们的分享按钮做一些事情

$('.fsl-facebook').click(function(e){ // target all elements with fsl-facebook class in the DOM
    e.preventDefault(); // prevent scrolling to top or bottom, because href is set to # 
    var href = $(this).attr('data-href'); // get URL from the data-href 
    window.open('https://www.facebook.com/sharer/sharer.php?u=' + encodeURIComponent(href), "", "width=800, height=350"); // pop up a new window, it's prefered to urlencode the URL because of 2nd & 3rd GET parameter that can be found in some URLs (?a=1&b=2&c=3)
});

演示

于 2014-07-22T22:19:26.317 回答