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

代码如下:

<span style=" font-family: Verdana, Arial, Helvetica, sans-serif; word-wrap: normal; word-break: normal; line-height: 19.5px;"><span style="word-wrap:normal; word-break:normal; line-height:19px"></span></span>

题外话:直接跳到facebook登录页面的分享按钮:

url为: http://www.facebook.com/sharer.php?u=www.baidu.com&t=123213123

其中的u参数为你要分享的链接。t 参数目前还没弄清楚是干什么的。

facebook分享功能的实现:

分享页面设定

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


代码如下:

<a style="display:inline-block;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的情况吧

(0)

相关推荐

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

    复制代码 代码如下: <span style=" font-family: Verdana, Arial, Helvetica, sans-serif; word-wrap: normal; word-break: normal; line-height: 19.5px;"><span style="word-wrap:normal; word-break:normal; line-height:19px"></span><

  • VueJs单页应用实现微信网页授权及微信分享功能示例

    在实际开发中,无论是做PC端.WebApp端还是微信公众号等类型的项目的时候,或多或少都会涉及到微信相关的开发,最近公司项目要求实现微信网页授权,并获取微信用户基本信息的功能及微信分享的功能,现在总算完成了,但开发过程中遇到好几个坑.废话不多说了,开始正题. 描述点 微信相关开发知识了解 怎么样实现微信相关功能本地测试 微信网页授权 微信分享 微信相关开发知识了解 微信公众号的appId,AppSecret 当我们注册一个微信公众号后,便能够得到一个appId(每个微信公众号只有一个,一个微信公

  • 微信公众号网页分享功能开发的示例代码

    现在每天都可以看到很多微信分享的链接上面有网站或者商家的自定义的分享标题,和分享链接的描述及分享出去的图像,例如下面的分享出去的链接: 上面这个是微信的js-SDK页面分享给微信好友在聊天列表中显示的视觉效果. 微信JS-SDK Demo :这个是微信网页分享出去的标题. 微信JS-SDK,帮助第三方为用户提供更优质的移动web服务:这个是被分享的这个页面的分享描述. 微信图标:这个就是自己网站或者自己自定义的图像. 上面这个是微信官方网页分享出去的定义描述,那么怎样实现自己网站网页的自定义分享

  • php视频拍照上传头像功能实现代码分享

    如果要在php中实现视频拍照我们需要借助于flash插件了,由flash拍出的确照片我们再通过php的$GLOBALS ['HTTP_RAW_POST_DATA']接受数据,然后保存成图片就可以了,下面我来介绍一下. 使用的是$GLOBALS ['HTTP_RAW_POST_DATA'],这个系统函数跟post很相似,但是$GLOBALS ['HTTP_RAW_POST_DATA']支持的数据格式更丰富些. 设计流程: $GLOBALS ['HTTP_RAW_POST_DATA']传递照片数据流

  • js实现类似iphone的网页滑屏解锁功能示例【附源码下载】

    本文实例讲述了js实现类似iphone的网页滑屏解锁功能.分享给大家供大家参考,具体如下: iphone 的出现,打破了人们的用户体验,这一用户体验也延伸到了网页设计上.最近看到很多blog的评论都用类似iphone滑动解锁的方式实现.只有滑动解锁之后才能评论,或者做其他的事情.这个功能的实现,其实并不麻烦,关键是要有好的美工,做出好的滑动图片,然后javascript配合CSS就可以完成,我在这里也简单实现了一个,基本功能如下 1. 打开页面时隐藏评论框,你可以做成disable形式,下载源码

  • vue-cli构建项目下使用微信分享功能

    一.index.html中引入微信官方分享js <script type="text/javascript" src="https://res.wx.qq.com/open/js/jweixin-1.2.0.js"></script> 二.在src下的assets/js文件夹下新建wx.jsapi.js文件,把分享做成公用方法 使用axios来发送请求,参照 //www.jb51.net/article/141008.htm 配置vue-cl

  • 微信公众平台开发教程②微信端分享功能图文详解

    本文实例讲述了微信公众平台微信端分享功能.分享给大家供大家参考,具体如下: 背景 初次尝试微信公众号的开发,对于学习方法的探索都是来源于网上的博客.问答,对于参差不齐的信息,自己也是有苦说不出,抽出一点时间写点文章,既是对自己的学习总结,也希望给予同是菜鸟的小白一点帮助. 今天想添加微信分享的功能,如果不进行自定义设计,那么当我们点击分享朋友圈.好友或者QQ好友.空间时,默认的标题就是<title>标签中的信息,而显示的描述信息就是链接,图片多是默认为页面中显示的第一张图片,显然这样的处理是不

  • Android APP集成新浪微博分享功能

    本文为大家分享了新浪微博分享功能集成,供大家参考,具体内容如下 下载新浪微博Android SDK 直接导入weibosdkcore.jar:适用于只需要授权.分享.网络请求框架功能的项目. 无论使用哪一种方式,都需要先将demo中lib目录下的对应的全部 libweibosdkcore.so文件目录拷贝到你的目标工程中Demo.在app–>src–>main中新建文件夹jniLibs,将demo 中lib目录下的对应的全部 libweibosdkcore.so文件目录拷贝到其中,不要改变任何

  • Android实现原生分享功能

    本文实例为大家分享了Android实现分享功能的具体代码,供大家参考,具体内容如下 因为公司的需求,最近一直在做分享这一块的功能.大概有这样几种思路: 1.使用Intent调用andoird原生的分享功能: 2.使用第三方的sdk,比如ShareSdk或者友盟: 3.去对应的平台下载jar包,参考官方设计文档写出自己的分享demo,但这种一般也比较复杂,尤其搞不懂qq和微信一家公司的,为什么微信那么麻烦. 不废话了,直接上代码: 一. 新建ShareUtil.java类 import java.

  • 微信JS-SDK分享功能的.Net实现代码

    JS-SDK接口是什么? 为了方便开发者实现微信内的网页(基于微信浏览器访问的网页)功能,比如拍照.选图.语音.位置等手机系统的能力,并方便开发者直接使用微信分享.扫一扫等微信特有的能力,微信推出了JS-SDK的整体开发包,供开发者方便使用. 分享功能 官方文档里提供了php.java.node.js以及python的示例代码,唯独没有c#版的,为了弥补广大.net用户的需求,我把php版本的示例代码逻辑照搬成了.net版,并在网页前端中加入了分享功能,希望对大家有用. 程序实现 流程图 程序里

随机推荐