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

时间:2011-03-29 20:44:37

标签: html facebook share

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

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

感谢任何帮助。

5 个答案:

答案 0 :(得分:11)

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

答案 1 :(得分:9)

这可以解决您的问题: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 ,您应该没问题。

注意:为了您的用户安全,请使用指向FB的HTTPS链接,例如 a href 属性。

答案 2 :(得分: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>

答案 3 :(得分:3)

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

答案 4 :(得分:3)

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