微信分享图文链接制作，h5分享朋友圈带图标

　　我们直接看效果：

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

　　实现方式：

　　首先我们要知道，实现好友朋友圈分享自定义内容，必须要接入微信的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: 'http://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。

　　--------------------------------0.0---------------------------------------------------------

　　难点咨询以及需要帮忙对接服务的可以找我了解，有偿服务，价格可谈!

　　我的联系方式：

　　QQ:814102037 VX:zss7114

　　或者扫码加我微信详谈，二维码如下：