微信分享朋友与朋友圈实现自定义标题，描述，图片

我们直接看效果：

 

由上面效果图可以看出，是否实现了自定义分享绝对了您分享出去的推广链接的展示效果。实现自定义分享后分享给好友或者朋友圈可以实现自定义标题，描述，图片功能，让您的分享链接以图文卡片的形式展示出来，更加美观与专业！那下面我就说说如何来实现自定义微信分享的功能。

实现方式：

首先我们要知道，实现好友朋友圈分享自定义内容，必须要接入微信的js-SDK。再用前端代码实现自定义内容：

----------------------------------------------/------------------------------------------------------

<script type="text/JavaScript">
	$(function() {
		var timestamp = $("#timestamp").val(); //时间戳
		var nonceStr = $("#noncestr").val(); //随机串
		var signature = $("#signature").val(); //签名
		wx.config({
			debug: false,
			appId: 'wx622ca8545e5c354b', // 必填，公众号的唯一标识
			timestamp: timestamp, // 必填，生成签名的时间戳
			nonceStr: nonceStr, // 必填，生成签名的随机串
			signature: signature, // 必填，签名，见附录1
			jsApiList: ['scanQRCode', 'onMenuShareAppMessage', 'onMenuShareTimeline']
			// 必填，需要使用的js接口列表，所有js接口列表见附录2
		});
		wx.ready(function() {
			// wx.hideOptionMenu();
			wx.onMenuShareTimeline({
				title: '这是一个测试的标题',
				link: 'http://blog.csdn.net/frankcheng5143',
				imgUrl: 'https://avatar.csdn.net/E/B/6/1_frankcheng5143.jpg',
				success: function() {
					// 用户确认分享后执行的回调函数
					alert('分享到朋友圈成功');
				},
				cancel: function() {
					// 用户取消分享后执行的回调函数
					alert('你没有分享到朋友圈');
				}
			});
			wx.onMenuShareAppMessage({
				title: '这是一个测试的标题--百度',
				desc: '这个是要分享内容的一些描述--百度一下，你就知道',
				link: 'http://www.baidu.com',
				imgUrl: 'https://www.baidu.com/img/bd_logo1.png',
				trigger: function(res) {

				},
				success: function(res) {
					alert('分享给朋友成功');
				},
				cancel: function(res) {
					alert('你没有分享给朋友');
				},
				fail: function(res) {
					alert(jsON.stringify(res));
				}
			});
		});
	});
</script>

----------------------------------------------/-----------------------------------------------------------

通过上述代码即可在前面自定义我们分享出的链接带有标题，描述和图标的微信图文卡片。但是前提是一定要对接微信js-SDK。