国内最全IT社区平台 联系我们 | 收藏本站
华晨云阿里云优惠2
您当前位置:首页 > web前端 > htmlcss > facebook分享(含图片)

facebook分享(含图片)

来源:程序员人生   发布时间:2015-04-17 08:49:36 阅读次数:3199次

1、查看当前URL下facebook信息情况

Open Graph Object Debugger<输入URL,查看当前URL是不是具有facebook信息>:
https://developers.facebook.com/tools/debug/og/object/
Show existing scrape information:查看已配置的facebook信息
Fetch new scrape information:设置新的facebook信息

2、设置对应facebook信息

1. 所有信息必须在对应URL下的页面进行添加,如www.baidu.com,必须在baidu的主页下进行添加
2. Facebook同享清单,参照下述URL
https://developers.facebook.com/docs/plugins/checklist

3、实例

如:在http://tztest4.ptmind.cn/test.htm下,添加facebook分享代码。
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF⑻"> <title>facebook share test</title> <meta property="og:site_name" content="site name"/> <meta property="og:title" content="title"/> <meta property="og:type" content="website"/> <meta property="og:description" content="description"/> <meta property="og:image" content="http://www.ptengine.jp/images/hatenablog.png"/> <meta property="og:url" content="http://tztest4.ptmind.cn/test.htm"> </head> <body> <script> function fbs_click(){ window.open('http://www.facebook.com/sharer.php?u='+encodeURIComponent('http://tztest4.ptmind.cn/test.htm'),'sharer','toolbar=0,status=0,width=626,height=436'); return false; } </script> <a onclick="return fbs_click()" target="_blank"> <img src="ADD_IMAGE_URL_HERE" alt="Share on Facebook" /> </a> </body> </html>

Window.open()请参考:http://www.w3cschool.cc/jsref/met-win-open.html
facebook开发API:https://developers.facebook.com/docs/plugins/embedded-posts
分享按钮:https://developers.facebook.com/docs/plugins/share-button/
参考文献:http://blog.sina.com.cn/s/blog_6cd33db60100sd9j.html


生活不易,码农辛苦
如果您觉得本网站对您的学习有所帮助,可以手机扫描二维码进行捐赠
程序员人生
------分隔线----------------------------
分享到:
------分隔线----------------------------
关闭
程序员人生