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

【问题标题】：Add Facebook Share button to static HTML page将 Facebook 分享按钮添加到静态 HTML 页面
【发布时间】：2011-03-29 20:44:37
【问题描述】：

有没有办法将 Facebook 分享按钮添加到静态 HTML 页面？我已经实现了一个没有服务器端的简单网站，只有一堆 html 页面，我可以添加一个 Like 按钮，因为它是用 iFrame 元素实现的。在此处发布之前，我已经搜索了有关 分享按钮 的解决方案，但实际上找不到任何东西。

（可以在 youtube 网站上的每个视频的分享部分看到分享按钮的示例。）

感谢任何帮助。

【问题讨论】：

标签： html facebook share

【解决方案1】：

这应该可以解决您的问题：FB Share button/dialog documentation 一般来说，您可以使用普通的 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，应该没问题。

注意：为了您的用户安全，请使用 HTTPS 链接到 FB，就像在 a 的 href 属性中一样。

【讨论】：

【解决方案2】：

您应该可以在这里生成自己的按钮代码：http://developers.facebook.com/docs/reference/plugins/like/

【讨论】：

这个页面允许你生成一个我能做的点赞按钮。我的问题是获得一个不同的分享按钮，它允许用户在他们的墙上发布我页面上的内容。
所以您希望人们分享它，而不是喜欢它？以这种方式传递参数：facebook.com/sharer.php?u=http://google.com 或其他 - 当您共享您的 URL 时，它们会抓取页面。
它以一种非常奇怪的方式工作，它完全删除了框的所有样式并显示大 Facebook 徽标，当您单击它时，它会在全屏页面中显示共享对话框，而不是在弹出窗口中。你能分享整个代码吗？你说什么是什么意思？谢谢
@Burjua sharer.php 链接只是一个裸链接。没有涉及样式按钮。您可以在 href 标记中将其与标准 HTML 一起使用。它只是将您链接到 facebook 上的一个页面，该页面允许您传递有关您正在共享的页面的 2 个参数：?u=mylink.com&t=my+page+title - 您指定的标题仅在 facebook 无法抓取您的页面以获得更多相关信息时使用信息。大多数时候，facebook 会覆盖您在 title 参数中输入的内容，因此几乎更容易将其排除在外。

【解决方案3】：

<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>

【讨论】：

【解决方案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>

【讨论】：

【解决方案5】：

 <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');

【讨论】：

【解决方案6】：

通过一种非常简单的方式，你可以实现这个

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

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

例子

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

【讨论】：