我需要一个专为 FB 设计的社交媒体插件。我需要 FB 的大分享按钮。我在几个网站上看到过它,但我不知道它是哪一个。
我留下这个链接是为了向你展示我在说什么(文章开头和结尾的大 FB 按钮):
http://www.viralnova.com/animals-eating-ice-cream/
任何想法?
我需要一个专为 FB 设计的社交媒体插件。我需要 FB 的大分享按钮。我在几个网站上看到过它,但我不知道它是哪一个。
我留下这个链接是为了向你展示我在说什么(文章开头和结尾的大 FB 按钮):
http://www.viralnova.com/animals-eating-ice-cream/
任何想法?
制作大赞(这不是赞按钮,那是分享按钮)按钮并没有什么秘诀,这一切都归结为 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)
});