网页上facebook分享功能的具体实现

Posted

tags:

篇首语:本文由小常识网(cha138.com)小编为大家整理,主要介绍了网页上facebook分享功能的具体实现相关的知识,希望对你有一定的参考价值。

1,一个链接: 参数是要分享的页面的链接 

代码如下:
<a style="width:35px; height:40px; position:relative; top:10px; left:48px; " title="Share on Facebook" target="_blank" 
onclick="javascript:window.open(‘http://www.facebook.com/sharer.php?u=‘+encodeURIComponent(‘https://www.baidu.com‘)+‘&t=‘+encodeURIComponent(document.title), ‘newWindow‘, ‘width=800, height=400‘,‘center‘);void(0);"> 
 
2.fb识别的标签: 
代码如下:
<title>test</</span>title> 
<meta property="og:image" content="test/test.jpg" /> 
<meta property="og:description" content="test>" /> 
<meta property="og:url" content="https://www.baidu.com" /> 
 
注意: 
1.title fb可以自动读取要分享页面的title 这个要设置在fb的sharer.php参数里 
你也可以自己设置 方式就是 
<meta property="og:title" content="test" /> 
2.image标签 可以写多个 分享人可以自己选择图片 
3.url就是你的要分享的页面 
4.description 介绍信息 

提示: 
图片像素必须是100*100 这样的格式 我用90*90 就是OK的 
例如:300*100 150*50在www.facebook.com图片会截取90x90图片显示就不正确了 
如果图片小了 更不行了,分享的那个弹出框就不会显示你的图片 这个情况发生在图片小于90x90的情况吧
 
facebook分享理解:要分享的页面传递url过去,facebook通过这个url自动的去抓取符合要求的图片和标题和description。url后面可以带titile参数,带image和description 参数无效。

以上是关于网页上facebook分享功能的具体实现的主要内容,如果未能解决你的问题,请参考以下文章

Facebook 分享功能在 iOS8 中不起作用

Instagram:从网页分享照片

Android Facebook和Twitter登录和分享完整版

使用 PhoneGap / jQuery Mobile 在 Facebook / Twitter / 电子邮件功能上分享

H5网页实现微信分享,分享朋友圈功能(分享带图片,附源码)

H5网页实现微信分享,分享朋友圈功能(分享带图片,附源码)