㈠ 微信分享链接自定义标题、描述信息和图片
在微信分享之后,默认的样子是如下:
我们希望得到的样子是这样:
那么如何实现,现在记录一下。
先登录微信公众平台进入“公众号设置”的“功能设置”里填写“js接口安全域名”,这里的安全域名是你的要分享的H5的域名。
备注:登录后可在“开发者中心”查看对应的接口权限。
在需要调用JS接口的页面引入如下JS文件,(支持https): http://res.wx.qq.com/open/js/jweixin-1.6.0.js
如需进一步提升服务稳定性,当上述资源不可访问时,可改访问: http://res2.wx.qq.com/open/js/jweixin-1.6.0.js
其中jsApiList一般为:
那么其他配置参数如何获取呢,接下来就是最重要的获取微信签名、随机串之类的数据了
具体方法微信也给了指南,贴链接
https://developers.weixin.qq.com/doc/offiaccount/OA_Web_Apps/JS-SDK.html#61
接着就可以自定义你的分享标题和描述信息、图片之类的了,首先定义一下你要自定义的分享信息:
㈡ 微信上的文件标题全部显示设置
长按文件名。
点击编辑,选择标题,就可以对标题进行编辑,右键把文件另存为下来就可以看到标题了。发送的微信文件标题如果想要更改,长按文件名。
㈢ 手机微信上分享网站时,如何加入标题、描述和图片
在你分享的选项的时候,最上面就是输入文字描述的。
㈣ 自定义微信分享的卡片链接 可自定义链接的标题和缩略图
更新:微信6.5.5版本以后调整了分享规则,针对的是没有接入公众号的网页分享,必须接入微信认证公众号!(没有公众号或者没有认证的可以前往 138tool工具 )
查了下微信公众平台,以下做法只能在微信收藏内及收藏中长按‘转发’时能生成缩略图;而页面内的‘发送给朋友’及‘分享到朋友圈’分享功能均失效了。。
---------------------
1、标题(上图中红色框内文字)
生成标准:自动获取当前页面的标题,即title里面的内容
自定义方法:设置页面标题即可,可使用:document.title = “标题内容”,动态设置。
2、小缩略图(上图中红色箭头所指图片)
生成标准(以下标准来自微信公众平台):
注:若页面中没有此标准的图片,则会显示箭头1处的无图样式。
自定义方法:在body标签内的最前面放入一张宽度为屏幕宽度80%的正方形img 。(如果不想显示可将其隐藏,微信仍能提出来作小缩略图)
---------------------
㈤ 微信分享网页时自定义标题、描述和图片
用微信打开一个网页,选择右上角的“发送给朋友”后,收到的消息是这样的:
而为了推广效果,我们更希望能自定义标题、描述和图片,效果如下图:
实现工具: GetwxLink
下面介绍下怎样来实现这个功能
<script type="text/javascript" src="http://res.wx.qq.com/open/js/jweixin-1.2.0.js" ></script>
<script type="text/javascript">
var imgUrl = 'http://www.gettool.cn/GetwxLink/';
var lineLink = 'http://www.gettool.cn/GetwxLink/';
var descContent = '人类天生就爱玩游戏,游戏为什么吸引人?如果借助游戏的规律,是否可以让工作学习变得更精彩?';
var shareTitle = '游戏化学习工作坊第四站-北京清华科技园';
var appid = '';
$.ajax({
type : 'POST',
url : "http://dev.mymax.cn/running/comm/weixin/open/jsSDKConfig", //这个地址并非通用且长期有效,请去微信官方查看文档,并自行配置
dataType : "json",
data:{url:window.location.href},
success : function(response){
var appId = response.s.appId;
var timestamp = response.s.timeStamp;
var nonceStr = response.s.nonceStr;
var signature = response.s.signature;
wx.config({
debug: false,
appId: appId,
timestamp: timestamp,
nonceStr: nonceStr,
signature: signature,
jsApiList: [
'checkJsApi',
'onMenuShareTimeline',
'onMenuShareAppMessage'
]
});
wx.ready(function() {
wx.onMenuShareTimeline({
title: shareTitle, // 分享标题
link: lineLink, // 分享链接,该链接域名或路径必须与当前页面对应的公众号JS安全域名一致
imgUrl: imgUrl, // 分享图标
success: function () {
// 用户确认分享后执行的回调函数
},
cancel: function () {
// 用户取消分享后执行的回调函数
}
});
wx.onMenuShareAppMessage({
title: shareTitle, // 分享标题
desc: descContent, // 分享描述
link: lineLink, // 分享链接,该链接域名或路径必须与当前页面对应的公众号JS安全域名一致
imgUrl: imgUrl, // 分享图标
type: '', // 分享类型,music、video或link,不填默认为link
dataUrl:'' , // 如果type是music或video,则要提供数据链接,默认为空
success: function () {
// 用户确认分享后执行的回调函数
},
cancel: function () {
// 用户取消分享后执行的回调函数
}
});
});
},
error:function(response){
window.parent.growl("删除失败["+response.responseText+"]!","error");
}
});
</script>