logo标签列表

将Facebook分享按钮添加到静态HTML页面

htmlfacebookshare
21
有没有办法在静态 HTML 页面上添加 Facebook 分享按钮？我的网站没有服务端，只有一些 html 页面，我已经成功地添加了一个 Like 按钮，因为它是使用 iFrame 元素实现的。在发布这篇文章之前，我已经搜索过关于分享按钮的解决方案，但真的找不到什么信息。
（例如，YouTube 网站上每个视频的分享部分中可以看到共享按钮。）
非常感谢您的帮助。
6个回答
23

这应该能解决您的问题：FB分享按钮 / 对话框文档。

一般来说，您可以使用普通的HTML代码并用CSS进行样式设置，或者您可以使用JavaScript。以下是一个示例：

<a href="https://www.facebook.com/sharer/sharer.php?u=https%3A%2F%2Fparse.com" target="_blank" rel="noopener">
    <img class="YOUR_FB_CSS_STYLING_CLASS" src="img/YOUR_FB_ICON_IMAGE.png" width="22px" height="22px" alt="Share on Facebook">
</a>

将https%3A%2F%2Fparse.com，YOUR_FB_CSS_STYLING_CLASS和YOUR_FB_ICON_IMAGE.png替换为您自己的选择，您就应该没问题了。

注意：为了保障用户的安全性，请在href属性中使用HTTPS链接到Facebook。

15
这个页面允许您生成一个“赞”按钮，我已经做到了。我的问题是如何获得一个不同的“分享”按钮，它允许用户在他们的墙上发布来自我的页面的内容。 - aumanets
14
所以你希望让人们分享它，而不是点赞它？可以这样传递参数：http://www.facebook.com/sharer.php?u=http://google.com 或其他链接- 这将在您分享URL时抓取网页。 - jpea
它的工作方式相当奇怪，它完全删除了盒子的所有样式，并显示大的Facebook标志，而且当你点击它时，它会在全屏页面中显示共享对话框，而不是弹出窗口。你能分享整个代码吗？还有，你所说的“whatnot”是什么意思？谢谢。 - Burjua
1
@Burjua，sharer.php链接只是一个简单的链接，没有样式化的按钮。您可以在href标签中使用它与标准HTML一起使用。它只是将您链接到Facebook上的一个页面，允许您传递有关您要分享的页面的两个参数：?u=http://mylink.com&t=my+page+title - 如果Facebook无法从您的页面中获取更相关的信息，则会使用您指定的标题。大多数情况下，Facebook会覆盖您放置在标题参数中的内容，因此最好将其省略。 - jpea
4

将<url>替换为您自己的链接

<script>function fbs_click() {u=location.href;t=document.title;window.open('http://www.facebook.com/sharer.php?u='+encodeURIComponent(u)+'&t='+encodeURIComponent(t),'sharer','toolbar=0,status=0,width=626,height=436');return false;}</script><style> html .fb_share_link { padding:2px 0 0 20px; height:16px; background:url(http://static.ak.facebook.com/images/share/facebook_share_icon.gif?6:26981) no-repeat top left; }</style><a rel="nofollow" href="http://www.facebook.com/share.php?u=<;url>" onclick="return fbs_click()" target="_blank" class="fb_share_link">Share on Facebook</a>
4
<a name='fb_share' type='button_count' href='http://www.facebook.com/sharer.php?appId={YOUR APP ID}&link=<?php the_permalink() ?>' rel='nofollow'>Share</a><script src='http://static.ak.fbcdn.net/connect.php/js/FB.Share' type='text/javascript'></script>
2
以非常简单的方式，您可以实现这一点。
<a href="https://www.facebook.com/share.php?u=your_page_link.com" target="_blank"> Facebook Share </a>

*将your_page_link.com替换为您想要的URL或页面链接

示例

<a href="https://www.facebook.com/share.php?u=youtube.com" target="_blank"> Facebook Share </a>

img_Share

2
 <div class="fb_share">
     <a name="fb_share" type="box_count" share_url="<?php the_permalink() ?>"
       href="http://www.facebook.com/sharer.php">Partilhar</a>
     <script src="http://static.ak.fbcdn.net/connect.php/js/FB.Share" type="text/javascript"></script> </div> <?php }  }

 add_action('thesis_hook_byline_item','fb_share');
网页内容由stack overflow 提供, 点击上面的
可以查看英文原文，
原文链接